Outline
Met de recente introductie van Lighthouse versie 3 wordt laadtijd voor mobiele telefoons meegenomen in de rankingscore van Google.
In het onderstaande leest u wat het betekent en wat u er aan kunt doen.
Wat is Lighthouse?
Wat is Lighthouse?
Lighthouse is een gratis audit-tool die standaard aanwezig in enkele browsers zoals Chrome en Opera. De tool geeft inzicht hoe uw site presteert en komt met een lijst aan verbeterpunten om verder op koers te raken voor een snelle en efficiënte mobiele website. Verlagen van de laadtijd is van belang voor zowel bezoekers als zoekmachines en een belangrijke reden om te optimaliseren. Nu nog relevanter door de Speed Update van Google.
Een goed presterende mobiele site levert u bonuspunten op
Lighthouse is van oorsprong bedoeld voor het testen van mobiele sites voor smartphone en tablet. Vier van de vijf testcategorieën geven echter ook een goede aanwijzing over de desktopversie. Er zijn meerdere factoren die effect hebben op de site-prestatie in de Google ranking. Sinds zomer 2018 geldt dat een goed presterende mobiele site bonuspunten oplevert voor de ranking. Ook wel bekend als de Google Speed Update .
Vijf categorieën in de schijnwerpers
Vijf categorieën in de schijnwerpers
Voor een audit hanteert Lighthouse een checklist puttend uit diverse gezaghebbende bronnen. Het resultaat wordt weergegeven als een score-overzicht met bijbehorende tips. Lighthouse laat zijn licht laat schijnen over vijf categorieën: Performance, PWA, Accesibility, Best practices en SEO.
In de interactieve infographic vind u een toelichting: de oplichtende punten geven u meer info. Voor elke categorie is een score van 0 tot 100% mogelijk die met een extra kleurindicator voor u wordt inschaald: groen, oranje of rood.
Een rapportage uitvoeren met Lighthouse
Stap 1: selecteer audit
- Ga in rechterdeel van uw scherm naar ‘Audits’.
Er verschijnt een afbeelding met de Lighthouse vuurtoren met daaronder de knop ‘Perform an audit’
Stap 2: kies de categorieën
- Klik op de knop ‘Perform an audit’
Er verschijnt nu een keuzemenu waar u de gewenste categorieën kunt aanvinken.
Stap 3: voer audit uit
- Klik op de knop ‘Run audit’. De audit wordt uitgevoerd en toont de voortgang.
Mobile Speed als ranking factor
Tijdens het wachten op de rapportage presenteert Google u enkele citaten afkomstig van eigen onderzoeksafdelingen. Ze benadrukken waarom een goed presterende site van belang is voor u en uw bezoeker. Hoewel de quotes zijn afkomstig uit onderzoeken die door Google zelf zijn uitgevoerd is het echter niet alleen preken voor eigen parochie. Voorop staat om de mobiele gebruiker de best mogelijke gebruikerservaring te geven.
Speed Update – zomer 2018
Speed Update is een puntensysteem dat al langer gold voor langzame desktopversies. De nadruk ligt met name op het belang van de laadtijd. Bij een erg trage site gaat de ranking omlaag, de ervaring van gebruikers staat immers voorop voor Google. Nu doen ze er een schepje bovenop en worden ook mobiele sites de maat genomen. De prestatiefactor (‘Performance’) is daarom nóg belangrijker geworden.
Ervaring van de gemiddelde gebruiker voorop
Voordat we ingaan op het rapport met resultaten eerst even waarom de gebruikerservaring zo zwaar weegt. Bij tests is de gemiddelde bezoeker die als uitgangspunt genomen. Men kiest bewust voor een minimale benadering: een gebruiker die in bezit is van een wat oudere mobiele telefoon en verbinding (Nexus 5 en 3G). Hiermee zijn de belangen afgedekt van een zo breed mogelijk publiek als doelgroep. Kernpunten hierbij zijn: wat is van belang voor de gebruiker en hoe voorkomen we dat deze niet afhaakt. Vrij vertaald komt het neer op de volgende vier vragen:
- Zien we iets gebeuren op het scherm? “Is it happening?”
- Zien we info waarvoor we zijn gekomen? “Is it useful?”
- Kunnen we het getoonde direct gebruiken? “Is it usable?”
- Verloopt de wisselwerking fijn en vlotjes? “Is it delightful?”
Bron: Google Developer – User centric performance metrics
De rapportage – prestatie laadtijd
Het rapport toont u een overzicht verdeeld over 5 categorieën. Als u in het rapport een categorie aanklikt krijgt u naast de score ook aanwijzingen hoe de score is opgebouwd en waar de verbeterpunten liggen.
Voor de categorie ‘Performance’ stippen we de betekenis aan van de zes graadmeters die samen de score vormen in onderstaande interactieve infographic. De oplichtende punten tonen een toelichting per graadmeter.
Speed Index op het podium
In de inleiding stipten we al aan dat er sinds versie 2 van Lighthouse andere wegingsfactoren zijn toegekend aan de diverse onderdelen voor het berekenen van de totaalscore. De nieuwe rolverdeling sinds zomer 2018 kunt u aflzen in de tabel.
Nieuwkomers ‘First contentful paint’ en ‘Speed index’ spelen een belangrijke rol. Speed index werd in versie 2 nog niet meegenomen in de berekening maar staat nu op het tweede treetje op het podium net onder ‘Time to Interactive’.
| Audit Naam | gewicht in versie 2 | gewicht in versie 3 |
|---|---|---|
| First Contentful Paint (nieuw in versie 3) | N/A | 3 |
| First Meaningful Paint | 5 | 1 |
| First CPU Idle (versie 2: First Interactive) | 5 | 3 |
| Time To Interactive (versie 2: Consistently Interactive) | 5 | 5 |
| Perceptual Speed Index | 1 | N/A |
| Speed Index | N/A | 4 |
| Estimated Input Latency | 1 | 0 |
Hoe nu verder? Verbeterpunten
Na een eerste scan en uitleg over de indicatoren (Metrics) geeft het rapport onder het kopje ‘Opportunities’ een aantal tips hoe we eventuele verbeterpunten kunnen tacklen. In de uitklapschermen krijgt u een inkijk over wat mogelijk is en wat het aan winst oplevert voor het Performance-onderdeel. De aanbevelingen zijn gericht op een betere gemiddelde gebruikerservaring. Denk bijvoorbeeld aan het op maat bedienen van afbeeldingen voor verschillende schermgroottes. Bijvoorbeeld voor diverse soorten mobiele telefoons en tablets (met 7”, 9” en 10”-schermen).
Een andere veelgebruikte optimalisatie is het minimaliseren van CSS en JS. Dit gebeurt door het verkleinen van code. Hierbij wordt alle code op 1 regel geplaatst met zo min mogelijk spaties en geen opmaak. Nagenoeg onleesbaar voor een ontwikkelaar maar wel een kortere laadtijd en tijdwinst voor de eindgebruiker. En daar draait het per slot van rekening om.
Conclusie
Met Lighthouse beschikt u over een gratis tool waarmee u de prestaties van uw website in het oog kunt houden. Een audit geeft meerdere aanknopingspunten om tegemoet te komen aan de eisen die zoekmachines en consumenten stellen aan sites.
Om in scheepvaarttermen te blijven: zit u opgescheept met een trage site, raakt de totaalscore van streek en vangt u bot bij de zoekmachine? Verzet dan de bakens met Lighthouse om weer op koers te raken.
