EEN WEBSITE MAKEN MET WEEBLY

Servicebureau ICT leren – Website maken met Weebly

EEN WEBSITE MAKEN MET WEEBLY Dit is de handleiding om op Weebly.com een website te leren maken. De handleiding is verdeeld in 5 hoofdstukken; 1. Aanmelden 2.Weebly werkblad 3. Draggen en Droppen 4.Pagina’s maken en 5. Extra mogelijkheden. Succes met deze leuke en handige manier om een site te leren bouwen!

1. Aanmelden Ga naar Weebly: http://www.weebly.com/

Zodra je je hebt aangemeld bij Weebly kan je meteen beginnen met het maken van één of meerdere websites. Als je inlogt met de door jezelf gekozen gebruikersnaam en wachtwoord wordt er aan je gevraagd om een titel en onderwerp te kiezen voor de website. De titel kan je later altijd nog veranderen. Vervolgens kan je een domeinnaam kiezen. Je krijgt drie keuzes: 1.Een subdomein van weebly.com. Je website eindigt dan op 'weebly.com'. Dit is volledig gratis. 2.Een nieuwe domeinnaam registreren. Tegen betaling kan je een website aanmaken die eindigt op .com , .net of .org. 3.Een domeinnaam die je al bezit. Dit brengt geen extra kosten met zich mee. Ook het domein kan je later nog veranderen.

2.Het Weebly werkblad Als je een website hebt aangemaakt klik dat op ‘Edit site’ en je komt op het werkblad:

1


Een design kiezen en aanpassen Als je eerst een ontwerp wilt maken dan biedt Weebly verschillende designs aan, onderverdeeld in de volgende categorieën: Klik in boven in op het tabblad ‘Design’ Je krijgt dit overzicht:

Uitleg: Een design bestaat uit een standaard kopfoto (header image in het Engels), een bepaald type navigatieknop en een website-indeling. De kopfoto kan verwijderd worden en vervangen worden door foto's op flickr, het internet en door foto's die je zelf gaat uploaden. Elke foto kan voorzien worden van een onderschrift. Bovendien kunnen de foto's zelf nog bewerkt worden: je kan ze bijsnijden, roteren, ondoorzichtig maken, vervagen en effecten toevoegen. Als je een design hebt uitgekozen/gemaakt dan kan je via de ‘Design options’ ook de lettertypen aanpassen die je wilt gebruiken voor de titel, tekst, links. Zie onderstaand voorbeeld:

2


Eigen plaatje als ontwerp Je kunt makkelijk een eigen plaatje gebruiken voor ontwerp. Dit ontwerp heb je gekozen:

Plaats je muis op de afbeelding en de knop ‘Edit images’ komt tevoorschijn, klik daar op:

De afbeelding kan nu van effecten worden voorzien maar je kunt het nu ook verwijderen. Links boven zie je de afmeting van deze afbeelding (is voor ieder ontwerp weer anders): Hier is de afmeting: Header size 960x270px Dit betekent dat je vervangende afbeelding dezelfde maat moet krijgen! Maak dus eerst een afbeelding klaar in de juiste maat klaar met een fotoprogramma. Voorbeeld:

Sla deze foto op als webfoto, dus niet zwaarder dan bijvoorbeeld 150 kilobytes. Laad je gemaakte afbeelding op en je site ziet er weer heel anders uit: 3


3.Draggen en Droppen Als je tevreden bent met het design kan je gebruik maken van de vele mogelijkheden die Weebly biedt om pagina elementen in te voegen en te bewerken. Weebly maakt gebruik van een 'drag and drop interface'. Dit houdt in dat je onderdelen in de werkbalk naar het werkblad kunt slepen en daarna bewerken. Zie voorbeeld:

Deze manier van werken is eenvoudig en praktisch, gewoon uitproberen en dan vind je vanzelf alle mogelijkheden. Zo kun je heel snel een fotootje uit je PC op de pagina krijgen door op het blauwe vak met de tekst ‘Click Here to Edit’ klikken, je ziet dan:

4


Foto invoeg venster, resultaat van foto en tekst invoer:

Drag en Drop elementen De onderdelen die je op je website kan zetten zijn onderverdeeld in vier hoofdonderdelen: Basic: hiertoe behoren o.a. de paragrafen, foto's en titels, contact formulieren etc. Multimedia: hiertoe behoren o.a. een fotogalerij, YouTube-video's en google maps. Revenue: dit is met name geschikt voor professionele doeleinden. Zo kan je bijvoorbeeld een online winkel beginnen als je een 'google Checkout merchant account' of een 'PayPal Business/Premier account' hebt. More: hiertoe behoren o.a. een contactformulier, een feed reader en spelletjes. Wijzigingen voorbehouden, Weebly is voortdurend bezig het product te verbeteren, veranderingen kunnen dus optreden. Er zijn meer elementen die je in kunt voegen, die worden besproken bij extra informatie.

5


4.Nieuwe pagina’s aanmaken Kies in de menubalk het tabblad ‘Pages’ Je komt op dit venster:

De Homepage staat er al. Je kunt de titel van de homepage aanpassen in het Edit Page vakje. Klik op ‘New Page’ voor de volgende pagina en geef deze een naam. Maak zoveel pagina’s als op het menu van het ontwerp van je site passen. Je kunt de volgorde van alle nieuwe pagina’s later weer veranderen. Gewoon schuiven. Bekijk ook het voorbeeld hier onder:

6


5.Extra mogelijkheden Een aantal andere interessante mogelijkheden zullen nu nader besproken worden. Drag en drop elementen Html Vanwege het drag and drop-systeem is het niet nodig om enige kennis te hebben van html. Toch kan je html gebruiken om elementen toe te voegen aan uw website die niet standaard worden aangeboden door Weebly. Onder de knop 'Basic' staat het onderdeel 'Custom html'. Als je dit onderdeel versleept naar de plaats waar je het wil hebben kan je html codes toevoegen. Hierdoor is het bijvoorbeeld mogelijk om een lichtkrant te plaatsen op de gratis website. Google Adsense Eén van de voordelen van Weebly is dat ze geen advertenties plaatsen op uw website. Je kunt er echter wel voor kiezen om advertenties te plaatsen als je een account hebt bij Google Adsense. Nadat je je accountcode hebt ingevuld bij Weebly kan je zelf beslissen hoeveel advertenties je wil hebben en waar ze komen te staan. Het is dus mogelijk om geld te verdienen met de gratis website. De voorwaarde is wel dat 50% van je inkomsten naar Weebly gaan. Blog Een ander groot voordeel is dat je een blog kan toevoegen aan de website. Ook dit is helemaal gratis. Je blog is automatisch voorzien van een RSS Feed. Je kunt er ook allerlei onderdelen aan toevoegen zoals een poll, een Twitter Badge en een LinkedIn Button. Al de berichten die je plaatst worden opgeslagen op basis van publicatiedatum en eventueel ook op basis van categorie. Forum Indien je met de bezoekers wilt discussiëren is het handig om een forum toe te voegen. In samenwerking met Tal.ki maakt Weebly het mogelijk om een forum toe te voegen aan de website. Zodra je een forum hebt toegevoegd staan er automatisch twee subfora, namelijk 'News' en 'Offtopic'. Je kunt dit uiteraard aanpassen en eventueel nieuwe subfora toevoegen. Je krijgt ook automatisch een avatar toegewezen die je ook weer kunt veranderen. Hoe krijg je je website goed vindbaar bij Google? Google zal na enige tijd je website vinden. Dit proces kan je versnellen door een 'site description' en 'meta Keywords' toe te voegen. Dit doet je door in het hoofdmenu bovenaan te klikken op 'settings'. Vervolgens kan je klikken op 'Search Engine Optimalization (SEO)'. Indien je dit gedaan hebt, heb je de mogelijkheid om de websitegegevens in te vullen. Of niet vindbaar bij Google? Je hebt ook de mogelijkheid om ervoor te kiezen om je website te verbergen voor zoekmachine's. In dat geval zal Google niet je website opnemen in haar bestand. Voor elke pagina van de website kan je deze gegevens invullen. Hoe publiceer ik mijn website? Als je tevreden bent met je website kan je klikken op de oranje knop 'Publish' dat zich rechts 7


bovenaan het scherm bevindt. Naderhand is het nog altijd mogelijk om de website aan te passen. Als je de veranderingen op de website online wil hebben moet je nogmaals klikken op 'Publish'. Hoe kan ik zien of mijn site bezocht wordt? Op je startpagina staat naast de knop ‘Edit’ de knop ‘Stats’ Daarna kun je precies zien hoeveel bezoekers je hebt gehad. Op deze pagina kun je ook een site verwijderen en weer een nieuwe site starten.

Wat is het voordeel van een betaalde website (Weebly Pro Account) Weebly biedt meer mogelijkheden tegen betaling. Zie onderstaand screenshot:

Je kunt dus later in je beroepssituatie van je opdracht website later een professionele website maken. Dat is makkelijk want je hebt geleerd hoe je de site moet onderhouden!

8

EEN WEBSITE MAKEN MET WEEBLY

Recommend Documents