Maak je eigen professionele website

In 2006 maakte Apple het bouwen van een website al toegankelijker. Met het gebruiksvriendelijke iWeb kon iedereen een eenvoudige website ontwerpen. De web-sitebouwer liep echter op z’n zachtst gezegd niet uit tot het grootste succes in de geschiedenis van Apple. iWeb kende veel beperkingen en werd in 2011 stopgezet.

Sindsdien zijn concurrerende website-bouwers enorm geëvolueerd. Terwijl je met iWeb genoegen moest nemen met een houtje-touwtjewebsite, is dat nu wel anders. Zeker als WordPress je websitebouwer is. Daarmee ben je tegenwoordig in staat om binnen één dag een website te maken die er geweldig uitziet, zonder ook maar één regel code aan te raken. Het is wel handig als je weet waar je moet beginnen en wat de juiste stappen zijn om te volgen. Daarom helpen we je met een stapsgewijze handleiding op weg naar je eerste (WordPress)-website!

Ideeën voor je website

Voor iedereen is er een goede reden om een eigen website te beginnen. Wat dacht je van deze ideeën?

Portfolio

Thema: Elegant Portfolio

Ben je webdesigner, fotograaf, grafisch ontwerper, of heb je een ander creatief beroep? Laat je werk dan op een professionele manier zien in een portfolio-website. Een goede manier om nieuwe klanten te werven.

Webshop

Thema: Shoper

Als je een fysieke winkel hebt, mag een webshop anno 2021 niet ontbreken. Steeds meer mensen doen hun aankopen immers online. En het leuke: het maken van zo’n webwinkel is gemakkelijker dan je waarschijnlijk denkt.

Bruiloft

Thema: Blossom Wedding

Vóór het moment van ‘ja!’ is een bruiloft-website leuk om gasten informatie te geven over de locatie en datum. Daarna zet je het platform in om de bruiloftfoto’s te vereeuwigen en te nagenieten.

Blog

Thema: Dashy Bloh

Klim je graag in de pen en weet je veel af van een bepaald onderwerp? Begin een blog. Er is weinig leuker dan schrijven over onderwerpen waar je interesse in hebt.

CV

Thema: Ydyllic

Tover je cv om tot een website! Zo kom je professioneler over en kun je alvast veel van jezelf en je werk laten zien. En reken maar dat je potentiële werkgever je web-site ziet, want ze googelen áltijd je naam.

Sportteam

Thema: Sports Club Lite

Een website met wedstrijdverslagen, topscorerslijsten, teamfoto’s, video’s en een agenda van de aankomende wedstrijden. Hoe leuk is het als jouw team er straks een heeft?

Drie vliegen, één klap

Om een nieuwe website te maken, heb je drie dingen nodig. Dat is een domeinnaam (je websiteadres), een hosting (een server waarop je je website-bestanden opslaat) en een WordPress-installatie. Dat klinkt een heel gedoe, maar webhosters maken het je eenvoudig door alles aan te bieden op één platform en als één pakket. Zo vang je drie vliegen in een klap. Er zijn veel hostingaanbieders waaruit je kunt kiezen. Mijndomein.nl, YourHosting, Hostnet en Argeweb zijn daar voor-beelden van. Maar misschien het bekendst is Strato. Deze hostingaanbieder onderscheidt zich door aantrekkelijke prijzen en een goede service. Daarom kiezen wij voor deze webhoster.

Registreer je domeinnaam

Een eigen website begint bij het vastleggen van je websiteadres. Met een paar klikken is het gebeurd.

1 Naar de website

Heb je een domeinnaam bedacht (zie kader hiernaast)? Navigeer dan naar www.strato.nl. Voer in de zoekbalk je beoogde websiteadres in en klik op ‘Domein checken’ om te zien of het domein beschikbaar is.

2 Leg je domeinnaam vast

Is de domeinnaam vrij? Klik op de knop ernaast om hem vast te leggen. Let hierbij op of je de gewenste domeinextensie kiest, zoals .nl of .com. Kies vervolgens voor ‘Door naar productkeuze’.

3 Kies je pakket

Kies voor het pakket ‘PowerWeb Basic’. Via deze weg krijg je een domeinnaam, webhosting en WordPress-installatie, dus alles wat je nodig hebt. Een e-mailadres met je eigen domeinnaam is ook inbegrepen.

4 Bestellen

Strato verleidt je nu tot de aanschaf van wat extra diensten. Negeer ze en doorloop het aankoopproces, zoals je gewend bent als je een paar schoenen bestelt. De eerste stap naar je eigen website is gezet!

Welke domeinnaam?

Bij een mooie website hoort een sterke domeinnaam. Dat is je websiteadres. Zorg dat de domeinnaam wat vertelt over je website. Maak je een website-cv? Gebruik dan gewoon je voor- en achternaam. Is fotograaf je beroep? Kies dan voor iets als www.sannejanssenfotografie.nl. Verkoop je meubels in Amersfoort? Ga voor www.meubelsamersfoort.nl. Door de product of dienst en locatie te noemen in je domeinnaam, is je website beter te vinden in zoekmachines.

Kies ook een extensie die erbij past. Meestal is .nl of .be het meest geschikt, of .com als je je op een internationaal publiek richt. Maar je kunt je websitedomein ook laten eindigen op bijvoorbeeld .tech, .info, .online of een van de tientallen andere extensies. Het is ook handig om uit te wijken naar een andere extensie als de domeinnaam die je in gedachten had, niet meer vrij is.

Wat kost een eigen website?

Bij een website zoals we die in deze feature maken, betaal je alleen voor de hosting en de domeinnaam. Bij de meeste hostingbedrijven moet je denken aan een bedrag tussen de vijf en vijftien euro per maand. Om klanten over de streep te trekken, is het eerste jaar vaak extra goedkoop. Bij Strato betalen we in het eerste jaar één euro per maand. Na dat jaar wordt er maandelijks zes euro afgeschreven. In deze situatie kost de website je het eerste jaar dus twaalf euro. Daarna betaal je jaarlijks 36 euro.

Installeer WordPress

Wereldwijd draait ongeveer de helft (!) van alle websites op WordPress. Met dit zogeheten Content Management Systeem (CMS) bouw je eenvoudig een website, zonder dat je kennis van HTML en CSS nodig hebt. Doordat de software wordt geleverd met duizenden website-ontwerpen, vind je altijd een stijl die bij je idee past. Met de duizenden plug-ins met extra functionaliteiten is WordPress bovendien erg flexibel. En het is gratis!

In de onderstaande stappen leggen we uit hoe je WordPress installeert. Maar let op: na de registratie van de domeinnaam moet Strato nog wat functies activeren. Hierdoor kan het ongeveer een uur duren voordat je de onderstaande stappen zijn uit te voeren. Een goed moment om wat koffie te pakken en na te denken over de lay-out van je website. Neem alvast een kijkje naar de gratis WordPress-thema’s die beschikbaar zijn, via https://wordpress.org/themes.

1 Inloggen

Na het registreren van je domeinnaam ontvang je van Strato een klantnummer en link waarmee je je wachtwoord aanmaakt. Doe dit, surf naar de website van Strato en log in.

2 Website-apps

Klik op het tabblad ‘Website-apps’. Hier zie je een overzicht van CMS’en, zoals WordPress. Kies onder WordPress voor ‘Nu installeren’ en selecteer de domeinnaam die je zojuist hebt aangemaakt.

3 Log-in gegevens

Maak een gebruikersnaam en wachtwoord aan; deze gegevens heb je straks nodig om in de CMS van WordPress te komen. Vul ook de andere velden in en klik op ‘Klaarzetten.’

Je website is in de lucht. De pagina http://jewebsiteadres.nl laat nu het beroemde standaardtekstje ‘Hello world!’ zien. De url http://jewebsiteadres.nl/wp-admin gebruik je straks om in te loggen in WordPress, waar je de lay-out bepaalt en content toevoegt.

Maak kennis met WordPress

Deze omgeving zal je nog vaak zien; het is de backend van je website, waar je de inhoud en lay-out regelt. Je komt er als je naar http://jewebsiteadres.nl/wp-admin navigeert en inlogt. Voordat we verdergaan met het ontwerpen van de website, leiden we je rond door de gebruikersinterface van WordPress.

Naar je website

Linksboven staat de naam die je je website gegeven hebt. Onthoud deze knop, want het is een handige snelkoppeling die je snel naar de voorkant van je website leidt.

Dashboard

Het Dasboard is het eerste wat je ziet als je op WordPress inlogt. Vanuit het Dashboard kun je bijvoorbeeld een nieuw bericht opstellen, de laatste reacties lezen en checken of je thema en plug-ins up-to-date zijn.

Berichten

Het onderdeel Berichten is de plek waar je een nieuw blogartikel of nieuwsbericht toevoegt, of bewerkt. Ze zijn vaak gericht op de actualiteit en bij de meeste the-ma’s wordt er bij een bericht ook de publicatiedatum getoond.

Media

Alle bestanden die je uploadt naar je WordPress-website, worden bij Media ondergebracht. Het gaat bijvoorbeeld om afbeeldingen, video’s, Excel-sheets en andere bestanden.

Pagina’s

Pagina’s lijken veel op Berichten, maar zijn niet hetzelfde. Terwijl Berichten zich meer richt op de actualiteit, is Pagina’s bedoeld voor statische content. Denk bij-voorbeeld aan webpagina’s als Contacten en Over ons: items die je meestal vindt in het menu van een website.

Reacties

Onder de berichten die je publiceert, kunnen mensen een reactie achterlaten. De reacties beheer je op deze plek, waar je ze bewerkt of verwijdert. Eventueel kun je de mogelijkheid tot reageren uitschakelen.

Assistent

Deze knop mag je links laten liggen. De tool is ingebouwd door Strato en helpt je bij het ontwerpen van je website. Wij doen dat straks op de reguliere manier, waarbij je veel meer keuze uit website-ontwerpen hebt.

Weergave

Als je iets wilt veranderen aan het uiterlijk van de website, dan moet je bij deze knop zijn. Hier selecteer en bewerk je een thema, maak je navigatie-menu’s aan en voeg je widgets toe.

Plugins

Een plug-in zorgt dat je meer kan met je website. Het is een stukje software waarmee je de standaard functionaliteit van je website uitbreidt. Zo voeg je bijvoorbeeld een contactenformulier toe. De plug-ins zijn open source en er zijn tienduizenden om uit te kiezen – betaald en gratis.

Gebruikers

In dit gedeelte beheer je de gebruikers die inloggegevens voor je website hebben. Je bepaalt er ook welke rechten ze krijgen.

Hulpmiddelen

Wil je content importeren uit een ander systeem, of andere WordPress-website? Dan helpt Hulpmiddelen je op weg. En anders heb je de optie (voorlopig) niet nodig.

Instellingen

Hier staan belangrijke instellingen voor je website. Het is belangrijk dat je alle opties doorloopt. Later in dit artikel lees je welke instellingen vooral belangrijk zijn.

Kies een design

Het leukste deel kan beginnen: bepaal het ontwerp van je website! Er zijn duizenden thema’s (een soort sjablonen) om uit te kiezen.

1 Thema kiezen

Log in op je WordPress-website. Klik in de navgatiekolom op ‘Weergave’ en kies ‘Nieuw thema toevoegen’. Vijftien thema’s worden uitgelicht, maar er zijn veel, veel meer thema’s om uit te kiezen.

2 Filteren

Klik op ‘Eigenschapfilter’. Er zijn zo’n vierduizend gratis thema’s, dus het is handig om te filteren. Geef onder ‘Onderwerp’ aan waar je website over gaat.

3 Bladeren

Vink eventueel bij ‘Eigenschappen’ of ‘Lay-out’ aan wat je belangrijk vindt en kies ‘Filters toepassen’. Blader door de resultaten en speur naar een ontwerp dat goed past bij jouw website.

4 Installeren

Open de thema’s, lees de beschrijving goed en let op de reviews. Iets moois gevonden? Klik op ‘Installeren’. Wij zijn gevallen voor het thema ‘FolioPress’.

5 Activeren

Nadat het thema is geïnstalleerd, hoef je hem alleen nog te activeren. Klik in de navigatiekolom op ‘Weergave’, houd de muiscursor boven je geïnstalleerde thema en klik op ‘Activeren’.

6 Nieuw thema

Je website heeft nu het nieuwe thema. Omdat de site nog geen inhoud heeft, lijkt hij nog niet op het voorbeeld dat je eerder zag.

Webshop beginnen?

Wil je een eigen webshop beginnen? Let er dan op dat het thema ‘WooCommerce compatibel’ is. Dit is een zeer populaire plug-in voor het maken van een webshop. Thema’s die overweg kunnen met WooCommerce, benadrukken dit bijna altijd in de beschrijving ervan.

Wisselen van thema

Ben je nog niet helemaal zeker van je thema? Dat is geen probleem, want je zit er niet voor altijd aan vast. Je kunt nog altijd een ander thema installeren en het via ‘Weergave>Thema’s’ activeren. Hierbij bewaart WordPress de inhoud van je artikelen, dus de inhoud verdwijnt niet.

Professionele thema’s

Er zijn duizenden gratis WordPress-thema’s, maar er zijn ook marktplaatsen waar je ze voor een paar tientjes koopt. Deze thema’s zijn ogen soms nog professione-ler en zijn uitgebreider. Een populaire website is www.themeforest.net. De thema’s zijn gemaakt door professionele webdesigners en de websites zien er vaak erg premium uit. Omdat de thema’s uitgebreider zijn en zich moeilijker naar je hand laten zetten, raden we het wel aan om met een gratis thema te beginnen. Durf je het wel aan? Ga na het kopen en downloaden van het thema in WordPress naar ‘Weergave>Thema’s’. Daar klik je boven op ‘Thema uploaden’ om het in WordPress te importeren.

Customize je website

Met de Customizer zet je je gekozen thema naar je hand. Dit moet je erover weten.

Voeg inhoud toe

Voordat je begint met customizen, is het handig als er alvast wat content op je website staat. Zo zie je beter hoe de lay-out eruit komt te zien. Ga naar de back-end van WordPress en maak een paar berichten en pagina’s aan. Voeg alleen een titel en een uitgelichte afbeelding toe; de rest komt later wel.

Naar de Customizer

Om de Customizer te openen, laat je in de backend de muiscursor boven ‘Weergave’ zweven en klik je op ‘Customizer’. Er opent zich een paneel met belangrijke opties waarmee je het uiterlijk van de website aanpast.

De opties

Welke gereedschappen je precies krijgt, hangt af van het thema dat je hebt gekozen. Wel komen een paar opties (bijna) altijd terug, zoals het aanpassen van de header, achtergrondafbeelding, typografie, kleuren en menu’s.

Potlood

Bij sommige onderdelen van de website zie je een blauwe cirkel met potlood. Door erop te klikken, begeleidt WordPress je naar de instelling waar je het website-element aanpast. Het potlood staat er helaas niet overal, dus soms is het even zoeken in de instellingen.

Trial and error

Ga alle opties langs en probeer ze een voor een uit. Soms zal het je niet precies duidelijk zijn waar ze voor bedoeld zijn. Verander in dat geval toch de instelling of voeg tekst of beeld toe, zodat je weet wat je ermee aanpast. De website rechts is een live preview, dus je ziet meteen welke wijzigingen je aanbrengt.

Zet http om in https

Als je nu naar je website navigeert, laat de adresbalk ‘Niet veilig zien’. Dat is omdat je website met ‘http://’ begint, wat betekent dat hij geen SSL-certificaat heeft. Zo’n certificaat zorgt dat de inhoud op je website versleuteld is, waardoor het voor je bezoekers veiliger is om je website te bezoeken. Goed nieuws: zo’n SSL-certificaat heb je al; je hoeft het alleen nog maar te activeren. Log in op de website van Strato en klap in het paneel links de opties van ‘Beveiliging’ uit. Klik op ‘Strato SSL’ en wijs het certificaat toe aan je domein.

Een duik in de instellingen

Nu de website vorm heeft gekregen, is het belangrijk om de instellingen door te nemen. De meeste opties kun je laten voor wat ze zijn, maar er zijn een paar aandachtspunten.

Algemeen

Ga naar de algemene instellingen van je WordPress-website. Verander de ‘Tijdszone’ in de doelgroep waar je je op richt; standaard staat hij namelijk ingesteld op Britse tijd. Als je doelgroep uit Nederland of België komt, stel je het in op ‘Parijs’. Vink in dat geval ook de bovenste optie bij ‘Datumnotatie’ en ‘Tijdnotatie’ aan.

Websiteadres

Heb je http omgezet naar https? Dan is het belangrijk dat je die url ook in de algemene instellingen aanpast. Verander ‘https’ zowel bij ‘WordPress adres’ als ‘Siteadres’ in ‘https’.

Permalinks

Waarschijnlijk wil je met je website goed in Google gevonden worden. In dat geval is het belangrijk dat de pagina’s en berichten die je plaatst, een goede url hebben. Standaard is dat iets vaags als www.jouwwebsite.nl/?=p123, maar veel beter is www.jouwwebsite.nl/naam-bericht. Hiermee laat je zoekmachines weten waar jouw artikel over gaat, waardoor je hoger komt in de zoekresultaten.

Om dit goed in te stellen, klik je in de navigatiekolom op ‘Permalinks’. Hier selecteer je ‘Berichtnaam’. Wil je werken met categorieën op je website? Vink dan ‘Aan-gepaste structuur’ aan en selecteer respectievelijk ‘%postname%’ en ‘%category’.

Vijf goede plug-ins om mee te beginnen

Plug-ins maken je website nog beter. Dit zijn onze favorieten.

Yoast SEO

Yoast SEO is een van de populairste WordPress-plugins wereldwijd en van Nederlandse makelij. De plug-in laat algoritmes op je teksten los om te beoordelen of ze SEO-proof zijn. Door de aanbevelingen te volgen en zoveel mogelijk groene bolletjes te scoren, weet je dat je de teksten goed optimaliseert.

Contact Form 7

Op je website wil je ongetwijfeld een Contact-pagina. Een contactformulier is dan wel zo professioneel. De beste plug-in hiervoor is Contact Form 7. De formulie-ren zijn gemakkelijk te maken en de plug-in biedt veel extra opties.

MonsterInsights

Je wilt natuurlijk graag weten hoeveel bezoekers je website trekt. Om dit te meten, koppel je je website aan Google Analytics. Dat was voorheen een gedoe, maar niet het populaire MonsterInsights. Zonder met regels code te moeten stoeien, geeft de plug-in toegang tot alle Google Analytics-gegevens.

Redirection

Verander je een url van je website? Dan is het handig als de bezoekers (én zoekmachines!) naar de nieuwe URL worden geleid. Redirection is daar de beste plug-in voor. Simpel in gebruik, maar er zijn ook veel geavanceerde instellingen.

WooCommerce

Zeg je webshop, dan zeg je WooCommerce. De plug-in stelt je in staat om je WordPress-website een professioneel ingerichte webshop te geven, zonder ook maar een euro te spenderen.

Publiceer je eerste blogpost

Nu het geraamte klaar is, kun je beginnen met het vullen van berichten en pagina’s.

1 WordPress-Editor

Klik in de navigatiekolom van WordPress op ‘Berichten’ en kies ‘Nieuw bericht’. Je komt terecht in de WordPress-editor. Voeg een titel toe en begin met het schrij-ven van een (fantasie)tekst.

2 Tussenkop

Geef tussenkoppen de stijl ‘H2’, dat is gunstig voor de zoekmachine-optimalisatie. Selecteer hiervoor de tussenkop, klik in de pop-up op het icoon uiterst links en klik op ‘Kop’.

3 Afbeelding

Om een afbeelding toe te voegen, klik je linksboven op de +. Scrol naar beneden en kies ‘Afbeelding’. Je kunt er ook voor kiezen om bijvoorbeeld een quote, tabel, video of galerij in te voegen.

4 Yoast

Heb je de plug-in Yoast geïnstalleerd? Scrol naar beneden en vul de velden onder ‘Yoast SEO’ in. Bij ‘Focus keyphrase’ vul je de zoekwoorden in waarop je gevonden wilt worden.

5 Instellingen

Klik rechtsboven op het tandwiel. Scrol naar beneden en voeg een ‘Uitgelichte afbeelding’ toe. Deze toont zich op de homepagina van je website. Vul ook de velden van ‘Samenvatting’, ‘Categorieën’ en ‘Tags’ in.

6 Publiceren

Als je klaar bent, klik je boven op ‘Voorbeeld’ om te zien hoe het artikel aan de voorkant wordt getoond. Tevreden? Met een klik op ‘Publiceren’ staat je eerste artikel online.