PageSpeed: Hoe maak ik mijn website sneller?

Als er één fenomeen op het internet vervelend kan zijn, dan is het wel een website die traag laadt. Bezoekers hechten tegenwoordig veel waarde aan snelheid van websites en door niet in deze behoefte te voorzien, riskeer je deze bezoekers te verliezen, voordat ze een indruk hebben kunnen krijgen van jouw producten en diensten. Daarnaast is de hoge penetratiegraad van mobiel internet een belangrijke reden om je website zo snel mogelijk in te richten. Tenslotte is de laadtijd van een pagina ook nog een ranking factor binnen het algoritme van Google, aangezien deze een zo goed mogelijke ervaring voor de bezoeker nastreven. Het verbeteren van uw PageSpeed draagt dan ook bij aan een betere ranking in de zoekresultaten.

laadtijdlangzame page speed

5 tips om je website sneller te maken 

Met behulp van de vijf tips die je hieronder vindt, zul je merken dat de score die jouw website krijgt toegekend in Google’s PageSpeed Insights en GTmetrix zeer snel zal stijgen. Het is dan ook interessant om, voordat je begint, je website door deze twee tools te laten testen om zo de voortgang te kunnen meten. Ook is het leuk om na de implementatie van iedere tip te kijken wat de impact ervan is geweest op de PageSpeed.

Iedere website is qua verbeterpunten natuurlijk anders. Vandaar dat ik heb gekozen voor de sterkste 5 verbeterpunten die tegelijkertijd ook het meest toegankelijk zijn (uit eigen ervaring). Alle tips komen voort uit online onderzoek en zijn niet altijd geschikt voor iedere website. Vandaar dat het belangrijk is om altijd een backup-bestand te bewaren voordat je begint met optimaliseren, zodat je het proces eventueel terug kunt draaien bij ontevredenheid. 

Om het tempo erin te houden zal ik hieronder kort en krachtig de implementatietips bespreken die jouw website een stuk sneller zullen maken!

page speed dude

Tip 1: Maak een .htaccess bestand aan

Geen .htaccess bestand? Maak er eentje aan via Kladblok > Opslaan als > Alle bestanden en kies vervolgens als bestandsnaam ‘.htaccess’ en upload deze naar de hoofdmap (root) van je FTP-server.

Dit bestand hebben we nodig bij het implementeren van technische verbeteringen die worden gegeven in het vervolg van dit artikel.

Doe de nulmeting nu eerst via Google en GTmetrix

Tip 2: Gebruikmaken van browsercaching

https://developers.google.com/speed/docs/best-practices/caching#LeverageBrowserCaching

Om ervoor te zorgen dat browsers niet onnodig veel werk verrichten bij het laden van een pagina, is het handig om aan te geven dat ze ook bestanden mogen gebruiken die ze al een keer eerder gecached (opgeslagen) hebben.

Dit kan worden gerealiseerd door het toevoegen van een maximum leeftijd aan de bestanden die worden gecached. De code hiervoor kan worden geïmplementeerd via het .htaccess bestand.

Download de volgende code en voeg deze toe aan de .htaccess om zo de maximum leeftijd in te stellen! 

notepad

Tip 3: Comprimeren inschakelen

https://developers.google.com/speed/docs/best-practices/payload#GzipCompression

Zoals je ook bestanden op de harde schijf kunt comprimeren met behulp van een .zip / .rar bestand, is het ook mogelijk om dit automatisch in te schakelen voor bestanden op de FTP-server. Dit beperkt het aantal bytes dat over het netwerk verzonden wordt, waardoor de website in zijn geheel sneller laadt. De code hiervoor kan wederom worden geïmplementeerd via het .htaccess bestand.

Download de volgende code en voeg deze toe aan de .htaccess om het comprimeren van bestanden in te schakelen. 

notepad

Tip 4: Geschaalde afbeeldingen weergeven

https://developers.google.com/speed/docs/best-practices/payload#ScaleImages

Een eenvoudige manier om de PageSpeed te verbeteren, is het direct goed weergeven van afbeeldingen. In vrijwel ieder CMS worden afbeeldingen teruggeschaald vanuit de code, waardoor de browser eerst de volledige afbeelding moet laden om deze vervolgens kleiner te maken. Om deze verkleinstap te vermijden, zal je zelf voor de afbeeldingen de juiste dimensies (dwz hoogte / breedte) in moeten stellen.

Om dit te realiseren, zul je eerst de dimensies van de afbeeldingen(en) moeten achterhalen. Klik hiervoor met de rechtermuisknop op de afbeelding (in de browser) die wordt geschaald en kies vervolgens voor ‘Element inspecteren’. De browser zal vervolgens de coderegel met betrekking tot het plaatje blauw weergeven. Zoek binnen deze regel naar ‘width’ en ‘height’ en noteer/onthoud de bijbehorende dimensies. 

geschaalde afbeelding

Open daarna de originele afbeelding in bijvoorbeeld Paint om de afbeelding zelf te schalen naar de aangegeven dimensies. Ook handig hiervoor is: Fast Photo Resizer. Deze nieuwe afbeelding upload je vervolgens naar de FTP-server in de map waar de oude versie nog staat om deze te overschrijven met het lichtgewicht! 

Tip 5: Afbeeldingen optimaliseren

https://developers.google.com/speed/docs/best-practices/payload#CompressImages

In de standaard gegenereerde afbeeldingen zit vaak data opgeslagen die niet relevant is, waardoor onnodig veel ruimte wordt ingenomen. Om dit tegen te gaan kun je de eigen afbeeldingen comprimeren, zonder dat er kwaliteit verloren gaat.

Een zeer handige tool hiervoor is Yahoo’s SmushIT. Hier upload je de plaatjes of plak je de URLs van de plaatjes op je website om ze vervolgens ‘lossless’ te comprimeren. Lossless betekent hier dat er geen onnodige bandbreedte verloren gaat aan het verwerken van zinloze data.

Deze afbeeldingen kun je daarna direct downloaden via SmushIT en ten slotte weer uploaden naar de FTP-server om zo de afbeelding te vervangen met zijn ‘lossless’ versie. 

Ook de image optimizer Kraken is erg handig, deze gaat nog grondiger te werk dan SmushIT!

smush it

Wil jij weten hoe je jouw website nog sneller maakt? 

Wij helpen je graag met een technische analyse en plan van aanpak hoe je jouw website sneller maakt. Je kunt hiermee zelf aan de slag of dit plan van aanpak aan je eigen webbouwer geven. De kosten bedragen € 450,- excl. 21% BTW. Stuur ons een e-mail en we nemen contact met je op of bel met Daan op 015 256 82 62.

Geschreven door Daan Weustenraad

SEO/SEA consultant

SEO is een prachtig vakgebied. Het ontdekken, analyseren en uitwerken van de informatiebehoefte van een doelgroep is een mooie uitdaging die ik graag iedere dag weer aanga. De combinatie van Adwords, Analytics, SEO en Conversieoptimalisatie zorgt voor de optimale bezoekerservaring en maakt dat er steeds meer bezoekers naar je website willen en kunnen komen.

Blijf up-to-date en ontvang updates in je mailbox

Lees ook deze interessante blogs

Totaalpakket: grondig renoveren website, inclusief teksten en beelden

Het besluit is genomen: je wilt een nieuwe website voor je bedrijf. Dit besluit is meteen de startpunt van een reeks volgende beslissingen. Wat te doen met de content – foto’s en teksten – op de huidige site? Passen deze nog bij de nieuwe weg die je in wilt slaan? Of doen deze juist afbreuk aan de nieuwe website en de communicatieboodschap die je wilt uitdragen? En wat als nieuwe teksten nodig zijn: zelf schrijven of iemand anders? En zo ja, wie dan? Oftewel: keuzes,...

SEO mythes

SEO mythes: wat is waarheid en wat is fictie?

SEO is een vakgebied waarin veel verhalen rondgaan over wat wel en niet werkt. SEO is dan ook een vakgebied met een continu veranderend landschap. De technologie achter websites wordt continue verbeterd, zoekmachines worden steeds slimmer en zoekmachinegebruikers worden steeds beter bediend. In dit artikel zullen we een aantal SEO-misverstanden behandelen.

Long tail SEO

Long Tail SEO: proces van de lange adem

Long Tail, een SEO-strategie die vaak wordt vergeten of niet wordt toegepast. Een gemiste kans! Long Tail is perfect ter aanvulling van je huidige Short Tail SEO-strategie. In dit artikel leg ik uit wat Long Tail zoekwoorden zijn, wat het je kan opleveren en beschrijf ik het proces van een Long Tail SEO-strategie.