Eigen website bouwen

Blog

1. Het doel

Een weblog, of kortweg blog, kunt u gebruiken als digitaal dagboek of voor het delen van foto's en video's, maar ook als website om uzelf bekend mee te maken aan de buitenwereld. Het verschil zit in de mate waarin u actief wilt zijn met het onderhouden van de pagina: wilt u eenmalig alle gewenste informatie online zetten, of liever regelmatig een nieuwe bijdrage leveren? In het laatste geval biedt een blog de beste mogelijkheden. Op een blog plaatst u in omgekeerde chronologische volgorde posts. U kunt een gratis blog aanmaken via diverse aanbieders, maar u kunt er ook zelf een ontwerpen en hem via een zelf te kiezen webhost online zetten. Een gratis blog is binnen enkele minuten aangemaakt, maar er hangt in principe een aantal beperkingen aan op het gebied van opmaak, privacy en commerciële uitingen. Tegen betaling kunt u zulke restricties vaak opheffen. Zelf een blog ontwerpen kost tijd en geld, afhankelijk van of u gratis of betaalde ontwerpsoftware gebruikt en via welke webhost u de pagina online zet.

De posts op een blog kunnen over allerlei onderwerpen gaan, maar vaak hebben ze wel een overkoepelend thema.

2. Gratis weblog aanmaken

Blogger.com (onderdeel van Google) en WordPress.com zijn twee bekende diensten waarbij u gratis en Nederlandstalig een blog aan kunt maken. Beide diensten zijn bijzonder eenvoudig te gebruiken. Qua stijl oogt Blogger wat speelser dan het serieuzere WordPress. Omdat Blogger een Google-product is, biedt het ook integratie met Google+, Gmail en andere Google-onderdelen. Surf naar Blogger.com en log in met uw Google- account, of maak zo'n account aan als u het nog niet hebt. Vervolgens moet u uw blog een naam geven en een blogadres opgeven. Dat adres kan bijvoorbeeld de naam van uw blog bevatten, dan krijgt u iets als 'vakantie2012.blogspot.com'. Ga daarna naar de laatste registratiestap: het kiezen van een van de acht beschikbare sjablonen die een uiterlijk aan uw pagina geven. U kunt het sjabloon later nog veranderen. Nu wordt gevraagd of u Blogger in de nieuwe Google-stijl wilt gebruiken, dat is de stijl waarmee ook Gmail en Google+ werken. Als voorbeeld voor dit artikel is voor ja gekozen. Een blog op WordPress.com maakt u aan door op Nu intekenen te klikken. Vul uw gegevens in, kies een url-adres voor uw blog en klik op Create blog. Activeer de pagina via een een mailbericht dat naar u wordt gestuurd, waarna u direct op het Dashboard van uw pagina terechtkomt.

Tijdens het aanmaken van een Blogger-pagina kunt u direct een sjabloon kiezen dat het uiterlijk bepaalt.

3. Blogger opmaken

Nu de pagina is aangemaakt, moet hij vorm krijgen, zodat duidelijk is waar de blog voor staat en wie u bent. In Blogger klikt u, nadat u bent ingelogd, op uw blognaam. In het Overzicht vindt u statistieken en verschillende instellingen. Klik op Pagina's om nieuwe ruimten aan te maken. Kies vervolgens Nieuwe pagina / Lege pagina. In de opmaakpagina, die het uiterlijk heeft van een document in Google Documenten, typt u bijvoorbeeld informatie over de blog. De tekst kan worden opgemaakt in diverse stijlen en u kunt hem verrijken met video's en foto's, die u eventueel kunt invoegen vanuit Picasa. Klaar? Kies rechts in beeld voor Opties en beslis of lezers een reactie onder de pagina mogen plaatsen. Sluit af met Gereed en klik vervolgens op Publiceren om de pagina te bewaren. De pagina wordt in eerste instantie niet getoond. Kies op het pagina-overzicht naast Pagina's weergeven als voor Bovenste tabs of voor Zijlinks om de paginakopjes boven of links in beeld te krijgen. Sluit af met Indeling opslaan. Via Nieuw bericht in de linker menubalk zijn blogberichten te plaatsen. Klik op Blog weergeven om te zien hoe een bezoeker van uw blog de pagina ziet en pas het geheel direct aan door in de zwarte balk op het huisje (het Dashboard) te klikken.

Ook een Blogger-pagina kan worden gekoppeld aan een eigen domeinnaam.

4. WordPress

Het overzichtsmenu van WordPress is een stuk uitgebreider dan dat van Blogger. U ziet er een gigantische hoeveelheid opties in beeld, zoals de mogelijkheid om een bericht direct te posten, statistieken over uw blog in te zien of algemene informatie te bekijken. Het linkermenu is het belangrijkst. Het aanmaken van een pagina of bericht werkt bij WordPress op dezelfde manier als bij Blogger. Klik op Pagina's en vervolgens op Nieuwe pagina om een tabblad te maken waarin u bijvoorbeeld uitlegt wie u bent. Een bericht schrijft u via Berichten / Nieuw bericht. Voeg een titel toe, typ de tekst en maak hem op met mediabestanden, hyperlinks of zelfs een poll met vragen waar bezoekers antwoord op kunnen geven. In het Publiceren-kader is via Zichtbaarheid de pagina te beveiligen met een wachtwoord. U kunt er op deze plaats ook voor kiezen om uw pagina af te schermen voor derden, wat handig is als u persoonlijke fotogalerijen toevoegt. Bij Onmiddellijk publiceren kunt u een datum invoeren, zodat u vooruit kunt werken bij de invoer van berichten en pagina's. Een bericht kan ook worden voorzien van tags, dat zijn trefwoorden waarmee lezers (en uzelf) snel berichten kunnen terugvinden. Tevreden? Klik op de blauwe knop Publiceren en de pagina of het bericht wordt direct online gezet. De opmaak van de blog kunt u aanpassen via Weergave / Thema's. Daar staan kant-en-klare opmaakprofielen voor u klaar.

Een WordPress-pagina kan heel fraai worden opgemaakt, dankzij de grote hoeveelheid opties in het opmaakmenu.

Website bouwen

5. Statische pagina bouwen

Een 'gewone' website is op verschillende manieren te bouwen. Vergeet daarbij het invoeren van HTML-codes. Tegenwoordig kunt u de bouw van een website gemakkelijk aanpakken via 'WYSIWYG'-editors, waarbij de afkorting staat voor What You See Is What You Get. Dat betekent dat u onderdelen kunt invoegen door erop te klikken en ze te verslepen ('drag & drop'), om zo een pagina op te bouwen alsof het een Lego-huis is. Professionals gaan het liefst aan de slag met software als Adobe Dreamweaver, maar daar betaalt u bijna 600 euro voor. Het vergt bovendien oefening en wellicht een cursus om dit programma onder te knie te krijgen. Er zijn echter ook gratis varianten verkrijgbaar waarin u enorm veel bouwopties zult ontdekken. Denk hierbij aan een opensource-cms (content management system) of aan het dashboard van uw site, zoals Joomla of WordPress. In het geval van WordPress gaat het in dit geval niet om de online blogversie die we net hebben besproken, maar om de (statische) websitebouwer. We gebruiken het Nederlandstalige WordPress als voorbeeld om aan te tonen hoe eenvoudig u een website online kunt zetten.

Hebt u echt Dreamweaver nodig om een professionele pagina te maken?

6. Benodigdheden

Wat hebt u nodig om een website snel online draaiende te krijgen? Allereerst de software waarmee u de pagina ontwerpt. Dit kan gewoon offline op de computer. Neem de tijd hiervoor, overhaast u niet zodat u voorkomt dat er onprofessioneel ogende fouten op de pagina verschijnen. Met onder andere WordPress installeert u een cms op uw eigen online locatie. De pagina ontwerpt u dan offline. U zult nu een locatie op internet moeten vinden waarop u de website kunt plaatsen. Dit wordt een webhost genoemd, en als u die hebt, kunt u een unieke domeinnaam (url) registeren. Op de vergelijkingssite ISPGids.com vindt u een mooi overzicht van bedrijven waarbij u een hostingabonnement kunt afsluiten. Links in het scherm kunt u de enorme lijst namen inperken door uw wensen aan te vinken. Om een gemiddelde website te kunnen draaien, moet de host bijvoorbeeld het script PHP en de database MySQL ondersteunen. Lees ook goed de ervaringen van eerdere gebruikers, zodat u geen kat in de zak aanschaft. Een gratis webhost met ondersteuning voor PHP en MySQL is 000webhost.com, dit is een handige locatie om te testen hoe u een website onderhoudt. Als laatste hebt u een ftp-programma nodig zoals FileZilla, om de website naar de webhost te kopiëren.

Vergelijk verschillende webhosts voordat u een contract afsluit!

7. Ftp gebruiken

Haal allereerst een programma in huis waarmee u straks de website of een cms zoals WordPress online kunt zetten. FileZilla is een gratis programma waarmee u verbinding kunt maken met uw webhost en bestanden op uw online locatie kunt plaatsen. Surf naar FileZilla en klik op Download FileZilla Client. Als Windows-gebruiker kiest u de meest actuele versie van het bestand FileZilla_[versienummer]win32-setup.exe. Na een korte installatie start FileZilla direct. Het enige dat u nu nodig hebt, zijn de ftp-gegevens van uw host, te weten de hostnaam, uw gebruikersnaam en het persoonlijke wachtwoord. Als u de gratis webhost 000webhost.com gebruikt, logt u in op 000webhost.com. Kies nu Go to CPanel en kies onder Main Menu voor View Account Details. Bij File Upload Details staan al de benodigde gegevens voor het inloggen op uw webruimte met FileZilla. In plaats van een ftp-hostnaam kunt u in FileZilla ook het IP-adres van uw account gebruiken.

FileZilla is een handig programma om snel bestanden mee op een ftp-server te plaatsen.

8. Installatiebestanden kopiëren

De Nederlandse versie van WordPress vindt u op nl.WordPress.org. Klik op Downloaden WordPress. Het zip-bestand van versie 3.3 is slechts 4,4 MB groot. Pak alle bestanden uit en ga vervolgens naar FileZilla. Log eerst in op uw webserver. Vul bij Host de hostnaam in, en vervolgens uw gebruikersnaam met wachtwoord. De poort kunt u leeglaten. Klik op Snelverbinden, waarna de bestanden die aanwezig zijn op de server verschijnen in het rechtergedeelte van FileZilla. Navigeer in het linkergedeelte naar de locatie waar de uitgepakte WordPress-map staat. Kopieer alle bestanden uit die map - en dus niet de overkoepelende WordPress-map zelf - naar de map public_html die aanwezig is op uw ftp-locatie. De installatiebestanden staan nu klaar om te gebruiken. In uw webbrowser surft u nu naar de domeinnaam die u van de webhost hebt gekregen of die u zelf hebt aangeschaft (bijvoorbeeld [uwnaam].com). Het installatiescherm van WordPress verschijnt nu.

Kies de juiste bronbestanden en kopieer ze naar public_html.

9. WordPress installeren

Het installeren van WordPress is bijzonder eenvoudig. Op het eerste scherm vraagt het programma u om op Maak een configuratiebestand te klikken, zodat u van start gaat. Vervolgens dient u de database-gegevens in te vullen. Deze gegevens krijgt u van uw webhost. Soms moet u zelf eerst een database aanmaken. In het configuratiescherm van 000webhost.com kiest u Manage MySQL Database. Vul een database en gebruikersnaam in en kies een wachtwoord. Sluit af met Create database. Deze gegevens gebruikt u nu ook in de WordPress-installatie. Let op: verander in het installatiescherm bij Table Prefix de standaardnaam wp_ in een zelf te kiezen code met een _ (underscore) als eindcode, zodat eventuele hackers of virussen er niet direct vat op hebben. Sluit af met Submit. In de volgende stap geeft u een naam voor uw website op en vult u de inloggegevens in. Verander hier de standaardnaam admin in iets persoonlijkers. Haal het vinkje weg naast Privacy als u niet wilt dat zoekmachines uw pagina vinden. Kies ten slotte WordPress installeren. Log nu in en hetzelfde dashboard dat u kent van de online blogdienst WordPress verschijnt in beeld.

Als uw webhost geen MySQL-database heeft, kunt u WordPress niet installeren!

Facebook als website

Als u naar reclameposters en folders kijkt, zal opvallen dat veel producten een eigen website hebben op het sociale netwerk Facebook. Dat is een slimme zet van het betreffende bedrijf, omdat het zo direct in contact komt met zijn klanten en andere geïnteresseerden. U kunt zelf ook een apart gedeelte op Facebook reserveren, bijvoorbeeld omdat u een belangrijke rol speelt in uw uw vakgebied, uw bedrijf of sportclub, of als u bezigheden hebt die interessant zijn voor anderen. Surf naar Facebook Pagina Maken en kies de categorie waarbinnen uw nieuwe pagina moet vallen. Vul een naam in voor de pagina en ga door met het stappenplan. Als eerste kiest u een foto of afbeelding. In stap 2 zijn Facebook-contactpersonen te benaderen die de pagina als 'leuk' kunnen beoordelen, maar u kunt ook contactpersonen van Skype, Gmail en andere diensten importeren. Vervolgens is het zaak om de pagina leuk in te richten om publiek te trekken en uw boodschap uit te dragen. Hoe meer 'fans' de pagina heeft, hoe meer opties u krijgt om de pagina op te maken. Klik op Pagina bewerken om specifieke zaken aan te passen, zoals het invullen van informatie, doelgroepinformatie en het aanstellen van externe beheerders. Statistieken over 'vind ik leuk' en reacties van 'fans' kunt u bekijken via de knop Oudere paginastatistieken bekijken, aan de rechterzijde van de startpagina.

10. Website bouwen

U bent nu klaar om een website te bouwen. In het dashboard van de site gaat u eerst naar Weergave. Kies nu Thema's installeren. Hier kunt u een uiterlijk zoeken op basis van uw voorkeuren: u kunt de kleur kiezen en aangeven hoeveel kolommen de site moet hebben. Als u een thema hebt gevonden dat u aanspreekt, kiest u Voorbeeld om een testversie te zien en daarna Installeren. Om uw website vorm te geven, kunt u pagina's toevoegen. Hoe u dat doet, leest u in tip 4. Maak een aantal pagina's aan. In het opmaakvenster van Nieuwe pagina vindt u onder Pagina-attributen de optie Volgorde. Geef de pagina die als eerste in de menubalk moet komen een 1, de tweede pagina een 2, enzovoort. U kunt ook meerdere menubalken aanmaken op de homepage. Ga naar Weergave, kies Menu's en vul naast Menunaam een titel in, bijvoorbeeld Informatie. Klik op het plusje ernaast om een tweede balk te maken. Voeg de zojuist aangemaakte pagina's toe die u op de balk wilt laten verschijnen, door een vinkje te plaatsen naast de naam. Klik dan op Aan menu toevoegen. Sla het geheel op met Menu opslaan. Kies bij Thema locaties een Header Menu (de menubalk die boven de site komt te staan) en een Footer Menu, dat onderaan de site komt.

Tover een blog om in een professionele website met menu's en pagina's!

11. Gratis pagina: Weebly

Is het regelen van een webhost voor u teveel gedoe? Weebly biedt uitkomst. Dit is een dienst die wordt gebruikt door duizenden consumenten, maar ook door kleine bedrijven. Weebly is niet Nederlandstalig, maar de stappen zijn zo duidelijk en eenvoudig uit te voeren, dat de dienst voor iedereen bruikbaar is. Surf naar Weebly.com, vul uw naam en e-mailadres in en kies Sign up. Vul in het welkomstscherm de naam in van uw pagina en kies een categorie waaronder uw pagina valt. U krijgt nu drie keuze-mogelijkheden met betrekking tot de domeinnaam. Bij de eerste optie krijgt u een Weebly-subdomein. Bij de tweede kunt u een .com-, .net- of .org-url aanschaffen en als u voor de derde keuze gaat, vult u de domeinnaam in die u via een andere webhost in bezit heeft. Een klik op Continue brengt u vervolgens meteen in de opmaakbewerker.

Weebly biedt een eenvoudige, gratis alles-in-één oplossing.

Weebly werkt door middel van het aanklikken van elementen en deze op de juiste plek slepen. Daarna kunt u de tekst aanpassen. Kies eerst een opmaak via Design. Scroll door de mogelijkheden en klik op de gewenste vormgeving, waarna u direct het resultaat ziet. Vervolgens kunt u in de pagina's aanmaken door in de menubalk naar Pages / Add Page te gaan. Vul een naam in en geef megadata aan zodat u sneller wordt gevonden als iemand een zoekmachine gebruikt. Dit doet uw via Advanced Settings. Pagina's sleept u boven of onder elkaar om de volgorde aan te geven. Een pagina is eenvoudig op te maken. U maakt een Contactpagina bijvoorbeeld aan door een pagina op te vullen met een contactformulier (Basic / Contact Form), een kaart met uw locatie (Multimedia / Google Maps) en een afbeelding van een contactformulier (Basic / Picture of Paragraph with Picture zodat u er ook een tekst bij kunt schrijven). Afbeeldingen en foto's zijn via een online url in te voegen, of door ze te uploaden vanaf de computer. Enkele handige extra's vindt u onder More, zoals een enquêteformulier en de mogelijkheid om een rss-feeder toe te voegen, zodat u berichten van andere sites op uw pagina kunt tonen. Kies rechtsboven in beeld op Publish om de site online te plaatsen.

Slepen, neerzetten, vergroten en verkleinen: het opmaken van uw webpagina is kinderspel in Weebly.

12. Webwinkel met Weebly

Maakt u zelf producten en wilt u deze online te koop aanbieden? Met Weebly maakt u van uw site, of van een gedeelte hiervan, eenvoudig een webwinkel. Ga in de Weebly Editor naar Revenue en sleep een klein, normaal of groot productblok naar de gewenste pagina. Weebly accepteert Google Checkout en PayPal. PayPal is wellicht de beste keuze, omdat Google Checkout standaard alle betalingshandelingen in dollars berekent, terwijl PayPal ook de euro ondersteunt. Een directe link om een account bij een van beide diensten te maken staat in beeld. Als u het betaalgedeelte hebt toegevoegd, maakt u de productenpagina in Weebly op. U kunt ook geld verdienen door reclame op uw pagina's te zetten. Dat kan niet alleen op uw Weebly-pagina, maar ook in WordPress en op een door uzelf ontwikkelde thuispagina. Daarvoor maakt u gebruik van Google AdSense. In Weebly gaat u naar Revenue en sleept u een Google AdSense-blok naar de pagina. Let op: Weebly is host en eist daarom de helft van de reclame-inkomsten op. De andere helft is voor u. Surf nogmaals naar uw Google AdSense-pagina, waarbij een melding opspringt waarin u Weebly toestemming moet geven om de inkomsten te delen.

U kunt een Weebly-website ook gebruiken als webwinkel.

13. Back-up van uw site

Als u denkt dat uw bestanden online veilig zijn, hebt u het mis. Uw site kan worden gehackt en u kunt vergissingen maken, waarna u ontdekt dat u geen reserveversie van de documenten hebt. Met Cobias Backup kunt u zelf instellen wanneer er een back-up van uw website moet worden gemaakt. Dat gaat via dezelfde ftp-route als waarmee u de site uploadt. Ga naar CobianSoft.com en download de nieuwste versie. Tijdens de installatie kunt u kiezen voor de Nederlandstalige versie van de software. Zodra Cobias Backup start, klikt u op het klokje (Nieuwe Taak) in de menubalk. Geef de taak een naam en ga naar Bestanden, in het linkermenu. Klik onder Bron Toevoegen op FTP. Vul hier de hostnaam, gebruikersnaam en het wachtwoord in om de webhost te benaderen en kies OK. Onder Doellocatie geeft u aan op welke locatie op de lokale schijf of de ftp-server de back-up moet worden geplaatst. Kies ten slotte Schema in het menu en laat de software uw site bijvoorbeeld elke maand back-uppen. Klik op Alle taken starten om de back-up direct uit te voeren.

Stel een automatische back-up van de ftp-server in om uw pagina te beveiligen.

Ontwerpsoftware

Er zijn zoveel programma's waarmee u een website bouwt, dat we al deze softwaretitels niet in dit artikel kunnen behandelen. Naast de besproken mogelijkheden, zoals het ontwerpen van een site via een cms als WordPress en het gebruik van de online dienst Weebly, zijn ook de volgende pakketten en diensten prettig in gebruik:

Magix Website Maker 5

Voor 40 euro biedt Magix de mogelijkheid om een moderne Flash-website te bouwen, en wordt ook de webhosting voor u verzorgd. U krijgt een .nl-domein met vijf e-mailaccounts en 5 GB online ruimte. De software is eenvoudig in gebruik en ideaal voor beginners.

Jimdo

Met Jimdo kunt u een gratis website of webwinkel maken met 500 MB ruimte. Voor 60 euro per jaar krijgt u onder andere een domeinnaam met een e-mailaccount en 5 GB ruimte. Bij de betaalde versie is uw pagina reclamevrij en krijgt u meer opties. De '180 euro per jaar'-versie biedt zelfs onbeperkte opslagruimte, twee domeinen en twintig e-mailaccounts.

Joomla

Op joomla.org vindt u het cms van websitebouwer Joomla. U kunt dit ongeveer vergelijken met de software van WordPress. Ook enkele grote bedrijven zoals MTV en organisaties als de universiteit van Harvard maken er gebruik van, zo stellen de makers. Het gaat hier om opensource-software die volledig gratis kan worden gebruikt en worden aangepast.

Aptana

Vindt u Adobe Dreamweaver te duur? Probeer dan Aptana eens. Dit is de opensource-variant van de website-ontwerpsoftware van Dreamweaver. Aptana werkt met JavaScript en PHP, maar ook met HTML5 en CCS3.

KompoZer

KompoZer is een product uit de Mozilla-familie, bekend van de browser Firefox. Met KompoZer kunt u volledige websites maken door middel van het invoeren van codes, maar u kunt ook gebruikmaken van de WYSIWYG-methode, waarbij elke bewerking direct visueel in beeld wordt gebracht. Op KompoZer.net vindt u de gratis te gebruiken software. De Nederlandse gebruikersgemeenschap heeft zich verzameld op MozBrowser.