In dit artikel laat ik je in 5 stappen zien hoe ik een razendsnelle nieuwe WordPress website heb gemaakt met Rocket, Google Workspace, Squarespace, FlyingPress, GeneratePress en Google Lighthouse.
Stap 1: Hosting (Rocket)
Wat is hosting?
Voordat ik kon beginnen met bouwen, had ik een server nodig waar ik mijn website kon hosten. Servers zijn de opslagplaats van de website. Hosting is het 24/7 beschikbaar stellen van de bestanden op een server, zodat deze wereldwijd via het internet bereikbaar zijn.
Welke hostingpartij heb ik gekozen?
Als hostingpartij heb ik gekozen voor Rocket, omdat ik deze heb ervaren als snel, veilig en gemakkelijk.
Snelheid
- Gemiddelde time to first byte (reactietijd van server) van 83 ms.
- Gratis Cloudflare Content Delivery Network (CDN), waardoor je content wereldwijd supersnel laadt.
Gemak
- Klantenservice die 24/7 gemiddeld binnen 1 minuut reageert.
- Makkelijk te gebruiken beheeromgeving.
- Gratis website-migraties.
- Gratis activiteitlogging, wat bugs oplossen makkelijker maakt.
Veiligheid
- Beveiliging is zonder enige configuratie ingesteld.
- Website application firewall (WAF) beschermt websites tegen onveilige serveraanvragen.
- Serverbestanden worden automatisch gescand op malware met Iminify360.
- Gratis secure sockets layers (SSL) op domeinen, waardoor de verbinding tussen browser en server beveiligd is.
- Automatische updates.
Wat heeft dit mij gekost?
Ik heb gekozen voor het starterspakket. Bij een jaarlijkse afname betaal je hiervoor $ 300. Dit was toen omgerekend €269,79.
Hoe heb ik een hostingpakket afgesloten bij Rocket in 5 stappen?
Stap 1: Bezoek https://rocket.net/pricing/ en kies een pakket
Stap 2: Maak een account aan
Stap 3: Kies je betaalmethode en betaal
Stap 4: Vul je gewenste sitegegevens in
Ik heb hier gekozen voor DE – Frankfurt, omdat dit een van de snelste locaties is die ze aanbieden voor Nederlandse bezoekers. Op het moment van schrijven waren er geen Nederlandse servers beschikbaar.
Stap 5: Vul je gewenste inloggegevens en instellingen in
- Ik heb multisite support uitgezet, omdat ik maar één website nodig had.
- Ik heb WooCommerce uitgezet, omdat ik niet van plan ben om een webshop te maken.
- Ik heb WP Recommended Plugins uitgezet, omdat ik deze plug-ins niet allemaal ga gebruiken.
Ik moest even wachten totdat de website op de achtergrond automatisch werd klaargezet. Zo zag het dashboard er uit toen alles klaar stond:
Stap 2: Domein en e-mail (Squarespace & Google Workspace)
De website was nu alleen nog te bereiken via een standaarddomeinnaam zoals (wiersmaweb.onrocket.site). Voor mijn bedrijf wilde ik de domeinnaam wiersmaweb.nl kopen. Rocket is helaas geen alles-in-1-provider, waardoor ik het domein van een andere partij moest afnemen.
Ik wilde daarnaast vanuit een zakelijk e-mailadres jeroen@wiersmaweb.nl kunnen mailen en daarvoor had ik een aparte e-mailprovider nodig, omdat Rocket dit ook niet aanbiedt.
Ik heb ervoor gekozen om een Google Workspace-abonnement af te sluiten in combinatie met een domein. Deze wordt dan automatisch bij Squarespace aangemaakt met de juiste domain name server (DNS)-instellingen. Daarnaast kreeg ik ook meteen toegang tot een digitale werkplaats voor mijn onderneming.
Ik heb hier gekozen voor een standaardpakket. Voor €163,20 per jaar. Mijn domein kost €9,68 per jaar.
Hoe heb ik een Google Workspace-pakket inclusief domein afgesloten in 12 stappen?
Stap 1: Navigeer naar https://workspace.google.com/ en klik op “Nu starten”
Stap 2: Vul je bedrijfsgegevens in en klik op “Volgende”
Stap 3: Vul je contactgegevens in en klik op “Volgende”
Stap 4: Klik op “Een nieuw eigen domein aanvragen” en klik daarna op “Doorgaan met deze methode”
Stap 5: Bevestig je domein en klik op “Volgende”
Stap 6: Voer je bedrijfsinformatie in en klik op “Volgende”
Stap 7: Vul je nieuwe accountgegevens in en klik op “Volgende”
Stap 8: Vul je nieuwe Google-e-mailadres in en klik op “Volgende”
Stap 9: Lees de voorwaarden en klik op “Ik begrijp het”
Stap 10: Klik op de “Jaarlijks”-knop onderaan de pagina
Stap 11: Klik op de “Proefperiode starten”
Stap 12: Controleer je winkelwagen en klik op “Akkoord en doorgaan”
Gefeliciteerd! Je hebt nu een Google Workspace-abonnement en domein afgesloten.
Hoe heb ik mijn domeinnaam doorgestuurd naar Rocket in 4 stappen?
Voordat mensen mijn website konden bezoeken via mijn domeinnaam, moesten eerst wat domain name system (DNS)-instellingen aangepast worden in Squarespace. Dit vertaalt het domein naar het juiste IP-adres of in dit geval het tussendomein.
Stap 1: Ga naar https://control.rocket.net/ en kopieer je CDN-URL
Dit is de huidige test-URL waar ik mijn Rocket-website mee kon bekijken zonder eigen domeinnaam.
Stap 2: Ga naar https://account.squarespace.com/domains en klik op “DNS”
Stap 3: Klik op “ADD RECORD”
Stap 4: Vul onderstaande recordgevens in en klik op “SAVE”
- TYPE = CNAME
- NAME = WWW
- TTL = 30 mins
- ALIAS DATA = CDN URL VAN ROCKET DASHBOARD
Binnen 48 uur na het aanpassen van de DNS records kon ik mijn website bezoeken via mijn domeinnaam.
Stap 3: Thema (GeneratePress)
Na het domein en e-mail ben ik aan de slag gegaan met het thema. WordPress thema’s gebruik je om de styling van je WordPress website in te stellen. Hoewel WordPress standaard met een aantal gratis thema’s wordt meegeleverd, heb ik gekozen voor GeneratePress. Ik heb deze keuze gemaakt omdat het een lichtgewicht thema is dat zich focust op snelheid, stabiliteit en toegankelijkheid.
Ik heb gekozen voor het GeneratePress One-pakket. Bij een jaarlijkse afname kost mij dit $149 per jaar. Dit was toen omgerekend €128,64.
Hoe heb ik een website gebouwd met GeneratePress in 25 stappen?
Ik laat je in dit stappenplan zien hoe je een eigen standaard GeneratePress-thema kan activeren op je website en niet hoe je mijn website kunt nabouwen (leek mij niet waardevol). Dit thema kan je helemaal aanpassen naar je eigen smaak.
Stap 1: Ga naar https://generatepress.com/
Stap 2: Klik op “GET STARTED”
Stap 3: Klik op “BUY NOW”
Stap 4: Klik op “Account” en vervolgens op “Downloads”
Stap 5: Download alle 3 plug-ins
Stap 6: Klik op “Plugin >> “Plugin toevoegen” in WordPress
Stap 7: Klik op “Plugin uploaden”
Stap 8: Klik op “Bestand kiezen”
Stap 9: Klik op “Nu installeren”
Stap 10: Klik op “Plugin activeren”
Stap 11: Herhaal stap 6 t/m 10 voor de resterende 2 plug-ins en ga daarna naar stap 12
Stap 12: Klik op “Installeer nu” om het GeneratePress-thema te installeren
Stap 13: Klik op “Installeren”
Stap 14: Klik op “Activeren”
Stap 15: Klik op “het huisje met je websitenaam” om je website te bekijken
Stap 16: Bekijk je website
Je hebt nu het standaardthema geactiveerd. Je zou dit kunnen gebruiken als basis van je website. GeneratePress heeft daarentegen allemaal website-templates die veel mooier zijn. In de onderstaande stappen zie je hoe je dit kunt activeren.
Stap 17: Klik op “JE WEBSITENAAM”
Stap 18: Klik op “GeneratePress” onder Weergave
Stap 19: Klik op “Activeren” bij Sitebibliotheek
Stap 20: Klik op “Open site bibliotheek”
Stap 21: Klik op je gewenste thema
Stap 22: Klik op “Nu beginnen”
Stap 23: Lees de waarschuwing en klik op “Ik begrijp het”
Stap 24: Klik op “Begin importeren”
Stap 25: Bekijk je nieuwe website!
Nu is het aan jou om hem helemaal aan te passen naar jouw smaak. Dit valt buiten de scope van dit artikel. Bekijk de documentatie van GeneratePress voor meer informatie.
Hoe mijn website is geworden, kun je natuurlijk al zien, want daar lees je als het goed is dit artikel. 🙂
Stap 4: Plugins (FlyingPress)
Nadat ik klaar was met het thema, ben ik aan de slag gegaan met FlyingPress. Dit is een lichtgewicht en gemakkelijk te gebruiken snelheidoptimalisatieplug-in voor WordPress.
Ik heb gekozen voor het starterspakket voor 1 website. Bij een jaarlijkse afname kost mij dit $ 59 per jaar. Dit was toen omgerekend €51,88.
Hoe heb ik mijn website versneld met FlyingPress in 15 stappen?
Stap 1: Ga naar https://flyingpress.com en klik op “Start Free Trial”
Stap 2: Klik op “Start Free Trial” bij het starterspakket voor 1 website
Stap 3: Rond je betaling af
Stap 4: Ga naar https://flyingpress.com en klik rechtsboven op “Account”
Stap 5: Klik op het pijltje ( > ) bij downloads om de plug-inbestanden te downloaden
Stap 6: Klik op de “Download”-knop
Stap 7: Ga naar {{jouwdomein}}/wp-admin/plugins.php en klik op “Plugin toevoegen”
Stap 8: Klik op “Plugin uploaden”
Stap 9: Klik op “Bestand kiezen”
Stap 10: Klik op “Nu installeren”
Stap 11: Klik op “Plugin activeren”
Stap 12: Klik op “Instellingen” bij FlyingPress
Stap 13: Ga naar https://flyingpress.com/account/ en klik op het pijltje ( > ) bij “License Keys”
Stap 14: Klik op “Copy” bij je License Key
Stap 15: Ga naar {{jouwdomein}}/wp-admin/admin.php?page=flying-press#/settings, plak je licentiesleutel en klik op “Activeren”
De standaardinstellingen zorgen al voor een aanzienlijke snelheidsverbetering, dus die heb ik niet aangepast.
Stap 5: Meten (Google Lighthouse)
Nadat ik FlyingPress had geïnstalleerd was mijn website klaar voor gebruik. Maar hoe snel was die nu eigenlijk? Ik heb mijn websitesnelheid gemeten met Google Lighthouse. Dit is een open-source geautomatiseerde tool waarmee je de snelheid van websites kunt meten.
Je kunt Google Lighthouse op verschillende manieren gebruiken. Ik heb gekozen voor de makkelijkste manier via https://pagespeed.web.dev/.
Je krijgt voor elke URL een totale prestatiescore voor mobile en desktop.
Ik heb deze naar eigen interpretatie vertaald naar het Nederlands.
Dit is een score van 0 tot 100 op basis van…
- Total blocking time >> Totale blokkeertijd (TBT)
- First contentful paint >> Eerste inhoudelijke weergave (FCP)
- Largest contentful paint >> Grootste inhoudelijke weergave (LCP)
- Cumulative layout shift >> Cumulatieve lay-outverschuiving (CLS)
- Speed index >> Snelheidsindex (SI)
Totale blokkeertijd (TBT)
TBT is de tijd dat je website bezig is met taken, waardoor de browser
niet kan reageren op de acties van een bezoeker.
Als een klant op een knop klikt, iets probeert in te vullen of een andere actie wil uitvoeren, en de TBT is te hoog (langer dan 50 milliseconden), dan reageert de website niet direct.
Bron: Total Blocking Time (TBT). (2024, 4 november). web.dev. https://web.dev/articles/tbt
Eerste inhoudelijke weergave (FCP)
FCP meet de tijd vanaf het moment dat een gebruiker naar de pagina navigeert totdat een deel van de inhoud van de pagina op het scherm verschijnt.
Bron: First Contentful paint (FCP). (2023, 6 december). web.dev. https://web.dev/articles/fcp
Grootste inhoudelijke weergave (LCP)
LCP meet hoe snel het belangrijkste en grootste deel van je website (zoals de hoofdafbeelding of titeltekst) laadt wanneer een bezoeker de pagina opent.
Bron: Largest Contentful Paint (LCP). (2025, September 4). web.dev. https://web.dev/articles/lcp
Cumulatieve lay-outverschuiving (CLS)
CLS meet hoe vaak en hoe erg elementen op je website onverwacht verspringen terwijl de pagina laadt. Het plaatje hieronder laat zien dat een bezoeker per ongeluk een bestelling plaatst:
Bron: Cumulative Layout Shift (CLS). (2023, April 12). web.dev. https://web.dev/articles/cls
Snelheidsindex (SI)
SI meet hoe snel de onderdelen van je website verschijnen tijdens het laden. Dit is waar veel mensen aan denken als het gaat over laadsnelheid. Lighthouse geeft de snelheidsindex in seconden weer.
Bron: Snelheidsindex. (2019, May 2). Chrome for Developers. https://developer.chrome.com/docs/lighthouse/performance/speed-index?hl=nl
Wat is een goede score?
Hier zijn de benchmarks van Google:
| Snel | Matig | Langzaam | |
| TBT | Sneller dan 200 ms | Tussen 200 ms en 600 ms | Langer dan 600 ms |
| FCP | Sneller dan 1,8 s | Tussen 1,8 s & 3 s | Langer dan 3 s |
| LCP | Sneller dan 2,5 s | Tussen 2,5 s & 4 s | Langer dan 4 s |
| CLS | Lager dan 0,1 | Tussen 0,1 & 0,25 | Groter dan 0,25 |
| SI | Sneller dan 3,4 s | Tussen 3,4 s & 5,8 s | Langzamer dan 5,8 s |
| TPC | Groter dan 90 | Tussen 50 en 89 | Kleiner dan 49 |
Hoe heb ik mijn websitesnelheid gemeten met Google Lighthouse in 4 stappen?
Let op: de methode die ik heb gebruikt maakt geen analyse van de gehele website, maar specifiek van de URL die je hebt ingevoerd.
Stap 1: Ga naar https://pagespeed.web.dev/ en analyseer de URL
Stap 2: Bekijk de resultaten van mobile
Stap 3: Klik op de “Desktop”-knop
Stap 4: Bekijk de resultaten van desktop
Ik ben erg tevreden met de resultaten en de website voelt heerlijk snel aan. Hieronder als afsluiter een overzicht van de kosten, mocht je mijn aanpak willen gebruiken:
| Dienst | Kosten (per jaar) |
| FlyingPress | € 51,88 |
| Rocket.net | € 269,79 |
| GeneratePress | € 128,64 |
| Squarespace | € 9,68 |
| Google Workspace | € 163,20 |
| Totaal | € 623,19 |
| Per maand | € 51,93 |
Nuttig gevonden? Help een ander (en mij) en deel dit artikel.
