Home Blog 10 tips om je website sneller te maken!
Let’s collab
10 tips om je website sneller te maken!
  • 23 jan 18:26
  • 6 min.
  • Development
Niek heerink
Niek Heerink

10 tips om je website sneller te maken!

Een snelle website wordt steeds belangrijker. Allereerst natuurlijk omdat het gewoon prettig werkt op je device naar keuze; worden je lezers blij van. Daarnaast vooral ook omdat grote bedrijven als Google dat relevanter vinden voor de kwaliteit van je website. In deze blog onthul ik alles over het hoe en waarom van die snelheid. Bovendien krijg je vooral mijn 10 handige tips waarmee je zelf je website een stuk sneller maakt!

Wat vindt Google er dan van?
Natuurlijk zijn er altijd externe factoren waar je geen invloed op hebt, zoals de snelheid van je internetverbinding of een storing op je server. Maar op de snelheid vanuit je webtechniek heb je wél invloed. Google zelf zegt zelfs dat de paginasnelheid er toe doet en besteedde hier een hele update aan. Controleer daarom regelmatig de snelheid van je website.

Als je die snelheid dus naar jouw hand zet, krijg je een snellere laadtijd. En dat heeft positief effect op je conversie. We hebben het hier dan over ‘pagespeed’.

Wat is pagespeed? De basis bij website sneller maken.

Pagespeed is een meting van hoe snel jouw website wordt geladen. Let op: veel mensen verwarren dit met sitesnelheid. Maar dát is in feite de paginasnelheid voor een voorbeeld van paginaweergaven op een site. Paginasnelheid kan worden beschreven als ‘laadtijd van de pagina’. Wil je weten wat de paginasnelheid is van jouw website? Dat kan met PageSpeed Insights van Google.

Waarom is pagespeed belangrijk?

Paginasnelheid is een cruciale factor om een website hoger te laten scoren in de zoekresultaten van Google. Immers, wees eens eerlijk, hoe lang wil jij wachten totdat een pagina is geladen…? Is je website dus niet op één lijn met de top 10 organische pagina’s? Dan kom je niet op de eerste pagina.

Focussen op paginasnelheid helpt dus enorm mee om een website te laten converteren en dus veel succes op te leveren voor jouw bedrijf. Wat hierbij de kunst is? Ontdekken wat ervoor zorgt dat een pagina langzaam laadt.

Belangrijkste ‘vertragers’
De meest voorkomende oorzaken van trage pagina’s zijn:

  • zware afbeeldingen
  • slecht ontworpen codering

Als je naar een moderne website kijkt, is deze waarschijnlijk tot het kantelpunt gevuld met afbeeldingen. Als je die niet optimaliseert, kom je zomaar uit op pagina’s die meerdere mb’s ruimte in beslag nemen. En dat kost veel rekenkracht bij je hostingpartij. Hoe goed je website het ook doet, het kan altijd beter.

 

Tip 1 – Comprimeer je fotobestanden

Een van de grootste snelheidswinsten die je kunt halen? Foto’s en andere mediabestanden in je website comprimeren. Met comprimeren bedoelen we: compacter maken in bestandsgrootte. Waarom? Zo hoeft je site minder data te laden bij elke webbezoeker.

Heeft dat comprimeren dan geen impact op de kwaliteit? Nee! Veel mensen denken dat foto’s er dan opeens niet meer mooi of scherp uit zien. In de praktijk hebben heel hoge kwaliteit foto’s echter zo veel detail, dat je die vaak niet terugziet op je scherm! Dus als je comprimeert, filter je deze overbodige kwaliteit eruit en wordt de foto een stuk compacter.

Resizen: verkleinen
Een ander aandachtspunt om rekening mee te houden? De resolutie van de afbeelding. Door te ‘resizen’ comprimeer je in de meeste gevallen ook veel data zonder dat dit ten koste gaat van de kwaliteit. Een handige tool die ik hiervoor gebruik: www.tinypng.com.

Probeer het zelf eens uit. Benieuwd of jij het verschil ziet 😉

Tip 2 – Gebruik een caching plugin

Caching is een term die je vaker tegenkomt als je een website laat ontwikkelen. Meestal als we spreken over websitecaching en gebeurt dit op applicatieniveau. Maar wat is het nut van caching?

Een doorsnee website heeft al gauw duizenden bestandjes. Telkens alle bestanden opnieuw weer uitlezen van de schijf (hosting), vraagt veel tijd. Zonder caching kost het seconden om deze bestanden op te halen.

Iedere vorm van vertraging pakt negatief uit voor de gebruikerservaring op je website. Met een goede caching plugin voorkom je dit. Zelf werk ik veel met de (betaalde) WordPress plugin WP Rocket. Goede, gratis alternatieven zijn W3C Total Cache en WP Super Cache.

Heb je hulp nodig bij het inrichten van goede caching? Neem dan contact met mij op.

 

Tip 3 – Maak gebruik van REDIS cache op serverniveau

Op serverniveau kun je ook caching gebruiken. Een bekende techniek die de laatste tijd veel voorkomt? REDIS. REDIS laat je tijdelijke gegevens supersnel uitlezen vanuit het RAM-geheugen; vooral voor webshops en zwaardere websites heel nuttig. REDIS kun je trouwens alleen activeren als je huidige hosting die mogelijkheid biedt. Bij je hostingpartij vind je meestal ook een handleiding hoe je REDIS installeert.

REDIS caching voor je website

Zelf gebruik ik de gratis Redis Object Cache plugin. Activeren doe je door de volgende regels code toe te voegen in het wp-config.php bestand van je WordPress-website:

define(‘WP_REDIS_PATH’, ‘/tmp/redis.sock’);
define(‘WP_REDIS_SCHEME’, ‘unix’);

Zodra je deze code toevoegt, activeert de plugin en voilà, je REDIS cache is actief. Let op: dit hangt wel af van de partij waar je je website host.

Tip 4 - Gebruik zo weinig mogelijk html, Javascript en css

Je kunt je het volgende vast voorstellen: met meer in je website, des te meer er ‘uitgelezen’ moet worden om je website te tonen. Javascript, html en css vormen de basis van je site. Met meer scripts kan het zorgen dat een website langzamer laadt. Vooral plugins installeren pakt slecht uit voor je paginalaadtijd.

html en css verkleinen

 

Probeer dus zo min mogelijk plugins te gebruiken als je een website ontwikkelt. En vraag je ontwikkelaar kritisch te kijken naar gebruik van code. Als je de code slim vermindert en te veel plugins vermijdt, haal je beslist voordelige snelheidswinsten voor je paginalaadtijd.

Tip 5 – Maak gebruik va instant.page

De instant.page is een stukje javascript code. Die code zorgt ervoor dat je pagina nóg sneller laadt. Het wordt ook wel ‘just in time preloading’ genoemd en reageert op het gedrag van een bezoeker. Als deze langer dan 65 milliseconden over een link beweegt (hovert), wordt de pagina als het ware alvast ingeladen. De kans is immers vrij groot dat de bezoeker op de link klikt.

Gemiddeld bespaar je 300 milliseconden laadtijd. Klinkt niet veel, maar alle kleine beetjes tellen zeker mee. Je past het toe op je website met onderstaande code:

src=”//instant.page/5.1.0″ type=”module” integrity=”sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBzVPnkLHw”>

Plak dit vóór de </body> tag en je bent klaar! Ik adviseer dit te gebruiken als je veel nieuws- en/of blogberichten hebt.

Tip 6 – Pas op met sliders

Sliders of carrousels op je website zijn heel leuk. Maar … ze brengen ook extra veel afbeeldingen met zich mee. Uit vele steekproeven met usability tests blijkt ook dat mensen er vaak op klikken. Een beetje nutteloos dus. Mijn advies: ga voor één goede afbeelding in plaats van een slider met meerdere afbeeldingen.

 

Tip 7 – Gebruik zoveel mogelijk SVG’s

SVG staat voor Scalable Vector Graphics. Dat betekent zoiets als: schaalbare vectorafbeeldingen die altijd scherp blijven, welke afbeelding je ook hebt. Een SVG is een afbeelding die bestaat uit complexe termen in plaats van pixels. Het voordeel hiervan? Dat het enorm licht is wat betreft grootte. Daarom is het ideaal voor webgebruik. Ik gebruik het vooral voor logo’s, keurmerken en achtergronden bij onze website ontwikkeling.

 

Tip 8 – Gebruik niet teveel verschillende fonts

Als je bezig gaat met webdesign, houd het aantal verschillende fonts dan beperkt. Ga liever voor één goede font of maximaal 2 fonts. Hoe meer fonts, des te meer externe bronnen je site moet laden. Ook adviseer ik: gebruik zo veel mogelijk Google Fonts, omdat deze het beste werken bij websites.

kies niet teveel fonts

Tip 9 - Gebruik SSL

Een SSL gebruiken is eigenlijk een must. Zonder beveiligde https-verbinding wordt je website allereerst weggedrukt in de zoekresultaten van Google. Daarnaast, minstens zo belangrijk: je kunt ook het moderne en veel snellere HTTP/2 protocol niet gebruiken.

Zelf ontwikkel ik inmiddels al jaren websites met een https-verbinding. Heb jij nog geen groen slotje in je webbrowserbalk? En wil je ook zo’n veilige https-verbinding? Vraag dan een SSL aan bij de registrar van je domeinnaam. Of maak gauw een afspraak met Crossmedia House.

Tip 10 – Kies een snellere hosting om je website sneller te maken

Soms vormt de rekenkracht van je huidige webhosting een bottleneck. Bijvoorbeeld omdat je een grote website hebt. Of een webshop met ontzettend veel producten. Dan raad ik je aan ook een snelle hosting te nemen. Je zult zien dat je website dan stukken sneller laadt!

snellere hosting

 

Wil jij je website ook eens onder de loep nemen om te kijken of jij snelheidswinst kunt halen? Maak dan een afspraak voor een second opinion. Of doe eerst zelf alvast een test op de website Google Pagespeed , pingdom.com en GTmetrix.com.

Ben heel benieuwd: hoe ga jij voor een snellere website zorgen?

Niek heerink

Niek Heerink

Developer

    Let’s collab
    Plan een gesprekGratis SEO scan