Website analyseren met Google Lighthouse

Google Lighthouse is een gratis open-source tool van Google waarmee je de kwaliteit van een webpagina kunt testen op verschillende belangrijke gebieden. Het wordt vooral gebruikt door webontwikkelaars, SEO-specialisten en website-eigenaren om websites te verbeteren.

Lighthouse is een open-source, geautomatiseerd hulpmiddel om de kwaliteit van webpagina’s te verbeteren. Je kunt het op elke webpagina uitvoeren, publiek of waarvoor authenticatie nodig is. Het heeft audits voor:

• prestaties
• toegankelijkheid en accessibility
• progressieve webapps
• SEO

Je kunt Lighthouse uitvoeren in Chrome DevToolsof met de Chrome extentie. Dit laatste is het makkelijkst. Leg ik hieronder uit.

Je geeft Lighthouse een URL om te controleren, het voert een reeks controles uit op de pagina, en genereert vervolgens een rapport over hoe goed je pagina het deed. Van daaruit kun je de falende audits gebruiken als indicatoren hoe je de pagina kunt verbeteren. Elke audit heeft een referentie document dat uitlegt waarom de audit belangrijk is, en hoe deze te verhelpen.

Wat meet Google Lighthouse?

Google Lighthouse analyseert een webpagina en geeft scores op vijf hoofdgebieden:

1. Performance (snelheid)
   Hoe snel laadt de pagina? Hoe snel is hij interactief?Denk aan metingen zoals:
   • First Contentful Paint (FCP)
   • Time to Interactive (TTI)
   • Largest Contentful Paint (LCP)
2. Accessibility (toegankelijkheid)
   Is de website bruikbaar voor mensen met een beperking?Bijvoorbeeld: voldoende kleurcontrast, alternatieve teksten bij afbeeldingen, juiste gebruik van HTML-koppen.
3. Best Practices (technische kwaliteit)
   Zijn er veiligheidsproblemen? Wordt moderne technologie goed toegepast?Bijvoorbeeld: HTTPS gebruik, geen verouderde JavaScript-methodes.
4. SEO (zoekmachineoptimalisatie)
   Is de pagina goed vindbaar en indexeerbaar?Denk aan goede meta-tags, correcte heading-structuur en mobielvriendelijkheid.
5. Progressive Web App (PWA) (optioneel)
   Is de site geschikt om als app te functioneren? Dit is vooral relevant voor webapplicaties.

Lighthouse uitvoeren met Chrome-extensie

Als je Lighthouse vaak wil gebruiken, kan het handig zijn om de extensie voor Google Chrome te installeren. Op deze manier kunt u gemakkelijk rechtstreeks vanuit uw browserbalk controleren.
Download gratis Lighthouse Chrome-extensie

Na de installatie zou er een Lighthouse-pictogram in de rechterbovenhoek naast de adresbalk moeten staan.

Als je het pictogram niet ziet, moet de extensie nog handmatig worden geactiveerd. Klik hiervoor op het ‘menu‘-pictogram (drie puntjes onder elkaar) rechtsboven in Google Chrome.
Ga vervolgens naar ‘Meer hulpprogramma’s’ en vervolgens naar ‘Extensies’. Zoek de Lighthouse-extensie en zet het bolletje aan zodat het blauw wordt. Nu verschijnt het Lighthouse-pictogram rechts van de adresbalk.

Ga naar de pagina die je wilt controleren en klik op het Lighthouse icoon. Nu verschijnt het menu. Onder ‘Opties’ kun je kiezen welke soort rapport je wilt controleren, bijvoorbeeld desktop of mobiel en klik dan op ‘Genereer rapport’.

Tijdens de audit werkt Lighthouse aan de pagina die op dat moment geopend is. Doe in de tussentijd niets, dit kan het genereren van het rapport verstoren. Na ongeveer 20 seconden worden de resultaten in een nieuw venster weergegeven. Je ziet zoiets als dit:

Aan de slag met Lighthouse in Chrome DevTools

In Chrome DevTools. Controleer eenvoudig pagina’s waarvoor authenticatie is vereist, en lees uw rapporten in een gebruiksvriendelijk formaat. Dit is het handigst voor WordPress websites.

Lighthouse uitvoeren in Chrome DevTools

Lighthouse voedt het Audits paneel van Chrome DevTools. Om een rapport uit te voeren:

• Download Google Chrome voor Desktop.
• In Google Chrome, ga naar de URL die u wilt controleren. U kunt elke URL op het web controleren.
• Open Chrome DevTools.
• Klik op het tabblad Audits.

Het paneel Audits van Chrome DevTools

• Links zie je de weergave van de WordPress pagina die wordt geaudit. Rechts is het Audits paneel van Chrome DevTools, dat nu wordt aangestuurd door Lighthouse
• Klik op Een audit uitvoeren. DevTools toont je een lijst van audit categorieën. Laat ze allemaal ingeschakeld.
• Klik op Audit uitvoeren. Na 30 tot 60 seconden geeft Lighthouse je een rapport over de pagina.

Meer handleidingen over analyseren van WordPress en trage websites

Meer handleidingen over analyseren en optimaliseren van WordPress en trage websites: