WordPress Snelheid Optimaliseren
Veel WordPress gebruikers worstelen met de prestaties van hun website. In veel gevallen is het niet moeilijk om hogere snelheden te bereiken. Het meeste komt neer op het kiezen van de juiste technologie stack en het volgen van de beste optimalisatie praktijken.
Google gebruikt wat ze Core Web Vitals noemen. De mobiele versie van uw site krijgt een score op basis van een combinatie van zaken als de Large Contentful Paint (LCP), First Input Delay (FID) en Cumulative Layout Shift (CLS). Simpel gezegd, terwijl de hoeveelheid code en de totale laadtijd altijd van belang zijn voor de prestaties, moet je nu ook overwegen hoe je website de code laadt.
Hieronder vindt u een prestatiechecklist die ik heb samengesteld om u tijd te besparen. Wanneer u een vraag hebt, beantwoordt ik die graag, of u nu al klant bent of niet. Ik geloof dat snellere sites gelijk staan aan een beter web voor iedereen.
Investeer in goede WordPress hosting
Niets is belangrijker dan de WordPress host die u kiest om uw sites van stroom te voorzien. Zie dit als een motor van een auto. Wil je een Porsche of een Prius? Ik raad altijd aan om te investeren in beheerde WordPress hosting. Dit soort hosts hebben omgevingen die expliciet zijn afgestemd om WordPress te versnellen. Op aanvraag kan ik zelfs een VPS inrichten die geoptimaliseerd is voor WordPress.
Caching is de sleutel
Zonder een goede caching oplossing zult u nooit de gewenste scores behalen. Wanneer een gebruiker uw website voor de eerste keer bezoekt, wordt er een cache gebouwd en opgeslagen op uw server. Alle volgende hits op uw site worden razendsnel vanuit de cache aan gebruikers geleverd.
Er zijn twee manieren waarop u het kunt implementeren, op serverniveau of met een WordPress plug-in.
Een snel WordPress thema is cruciaal
Of het nu gaat om een blog met veel verkeer, een WooCommerce webshop of een Google AdSense site, het GeneratePress of Kadence thema is altijd onze eerste aanbeveling. Het is snel, lichtgewicht en zorgt ervoor dat uw site er altijd mooi uitziet.
Gebruik een Content Delivery Network
Een Content Delivery Network (CDN) helpt uw WordPress-site te versnellen door uw activa en code (HTML, JS, CSS, afbeeldingen) op verschillende edge-servers (POP’s) over de hele wereld op te slaan. Wanneer een gebruiker uw site bezoekt, wordt deze geleverd vanuit de cache op de edge-server die fysiek het dichtst in de buurt is. Ik heb gezien dat een CDN de snelheid met wel 68% verhoogt!
Er zijn twee verschillende benaderingen die ik kan aanbevelen:
- Cloudflare met automatische platformoptimalisatie (APO). Cloudflare bevindt zich tussen uw website en internet en levert volledige pagina cache vanaf hun edge-servers. Het resulteert in een lage TTFB- en serverresponstijd. Deze aanpak slaat HTML, JS, CSS en afbeeldingen in de cache op.
- Traditionele CDN zoals KeyCDN. Zie dit als een add-on voor uw site, meestal met een subdomein zoals cdn.uwdomein.nl. Deze aanpak cachet JS, CSS en afbeeldingen.
Beeldoptimalisatie (Comprimeren, WebP, Lazy Load)
Afbeeldingen maken op mobiele apparaten gemiddeld 48% uit van het paginagewicht van een hele website. Daarom is beeldoptimalisatie iets waar je niet omheen kunt.
Allereerst moet u uw afbeeldingen comprimeren om hun bestandsgrootte te verkleinen. We raden aan om de ShortPixel plug-in te gebruiken. De automatische lossy compressie zorgt voor de perfecte balans tussen beeldkwaliteit en grootte.
Ten tweede kunt u uw afbeeldingen converteren naar WebP, een bestandsindeling die is gemaakt door Google en die nu door alle moderne browsers wordt ondersteund. WebP bestanden zijn gemiddeld 59% kleiner dan PNG- of JPG-bestanden.
Ten derde moet u uw afbeeldingen ‘lui laden’, zodat alleen de afbeeldingen in de viewport meteen worden gedownload. Hoe meer media u heeft, hoe meer voordeel u zult behalen.
Database en schijfruimte
Na verloop van tijd beginnen dingen als revisies, spamcommentaar, transiënten, automatische concepten en zelfs prullenbak toe te voegen aan verspilde ruimte in uw database. Er is bijvoorbeeld de tabel, wp_options, die uw site enorm kan vertragen als deze te groot wordt.
Wees spaarzaam met webfonts
Webfonts maken op mobiel gemiddeld 6% uit van het totale gewicht van een webpagina. Ze hebben invloed op uw laadtijd en hoe uw pagina wordt weergegeven. Veel websites gebruiken meer lettertypen dan ze nodig hebben. Kies een aantal verschillende gewichtsvariaties, normaal, vet, enz. Ook wordt WOFF 2 inmiddels door meer dan 95% van alle browsers ondersteund.
Host webfonts altijd op uw eigen server of CDN. Elke moderne browser is overgestapt op HTTP cachepartitionering. Dit betekent dat lettertypen voor elke website opnieuw wordt gedownload, ongeacht de lettertypen die in de browser van een gebruiker worden opgeslagen. Profiteer dus van minder DNS verzoeken en de caching-headers van uw server.
Gebruik alleen de pictogrammen die u nodig hebt
Font Awesome is super en miljoenen sites gebruiken het om pictogrammen weer te geven. Een veelvoorkomende en gebrekkige implementatie van plug-ins en thema’s is echter dat ze de hele bibliotheek met alle pictogrammen op uw site laden.
De beste manier om Font Awesome qua prestaties te benaderen, is door alleen de pictogrammen in te sluiten die u daadwerkelijk op uw site gebruikt.
CSS en JS optimalisatie
Helaas zijn er veel WordPress plug-ins en thema’s niet ontwikkeld met het oog op prestaties. Ze voegen gewoon zoveel mogelijk functies toe om hun winst te vergroten. Daarom laden veel scripts (CSS en JS) op uw hele site zonder te bedenken hoe het efficiënter kan.
Een veelvoorkomend situatie is het gebruik van een plug-in voor het maken van contactformulieren. Behalve op uw contactpagina zijn de scripts overbodig op de rest van uw website.
Overige performance tips
Hier zijn een paar tips en suggesties om u snel op weg te helpen naar een WordPress site waar Google dol op zal zijn:
- Vermijd omleidingen ten koste van alles. Als u een omleiding moet toevoegen, doe dit dan op serverniveau.
- Gebruik geen Sliders en maak in plaats daarvan een statische kop om CLS te voorkomen.
- Gebruik geen Google AMP. Richt u op het sneller maken van uw responsieve site. Vanaf 2021 geeft Google geen voorkeursbehandeling meer aan degenen die AMP gebruiken.
- Google’s reCAPTCHA is een prestatiemoordenaar. De meeste contactformulieren hebben zogenaamde honeypots.
- Als je Cloudflare gebruikt, schakel Rocket Loader en Email Address Obfuscation uit.