De vindbaarheid van jouw website verbeteren? Met alleen content en linkbuilding ben je er niet. Ook techniek is belangrijk en dan vooral de ervaring op de website. Maak kennis met de nieuwe Core Web Vitals van Google.
Als het gaat om een positieve gebruikerservaring op een website, dan zijn er zeven signalen die Google monitort. Is de website veilig? Wordt er gebruik gemaakt van HTTPS? Zijn er geen storende pop-ups (m.u.v. cookiemelding) die voor de content worden geladen? En is een website mobielvriendelijk (bijv. responsive design of een aparte mobiele website).
Dan blijven er nog drie signalen over. Dit zijn de gloednieuwe Core Web Vitals die Google eerder deze maand aankondigde, namelijk:
– Largest Contentful Paint (LCP) of in het Nederlands: grootste weergave met content
– First Input Delay (FID) of in het Nederlands: eerste invoervertraging
– Cumulative Layout Shift (CLS) of in het Nederlands: cumulatieve indelingsverschuiving
In dit artikel ga ik dieper in op deze drie Core Web Vitals. Wat betekenen ze? En wanneer zit je aan de goede kant van de streep?
Wat zijn Core Web Vitals?
Een goede gebruikerservaring is lastig te meten, want iedere gebruiker en iedere website is anders. Daarom heeft Google een aantal metrics gedefinieerd die de gebruikerservaring kwantificeren. Deze metrics houden rekening met interactiviteit, laadtijd en stabiliteit van content (zodat je niet per ongeluk op een verkeerde knop klikt die – tijdens het laden – in beeld schuift).
Wat is Largest Contentful Paint?
Nadat je op een Google-resultaat klikt, verschijnt een webpagina vaak niet direct in beeld. De pagina wordt waarschijnlijk stapsgewijs ingeladen: eerst zie je de menubalk, dan de titel, dan de foto’s en als laatste de advertenties. Largest Contentful Paint houdt bij wanneer het grootste item in het scherm is ingeladen. Dat is bijvoorbeeld een grote afbeelding bovenaan een artikel.
Hieronder zie je hoe een website – CNN – wordt ingeladen. Terwijl de website wordt geladen, bepaalt Google wat het grootste blok is. In eerste instantie is dit het blokje ‘Visual stories’, maar even later is dit de titel en uiteindelijk blijkt de foto van de drie politici het grootste fragment boven de vouw (oftewel op het scherm) te zijn. Stel, tussen de klik in Google en laden van de foto van de drie politici zit drie seconden, dan is de Largest Contentful Paint dus drie seconden.
Wat betekent dit voor jou? Heel simpel: zorg dat de grootste items in het scherm zo snel mogelijk worden ingeladen, namelijk binnen 2,5 seconden. Dus wellicht eerst de grote coverfoto inladen en dan pas later het hoofdmenu.
Wat is First Input Delay?
First Input Delay meet de tijd tussen de eerste interactie van een gebruiker (bijv. klikken op een link of knop) en de tijd dat het duurt voordat de browser reageert. Scrollen en zoomen tellen niet mee. Des te langer dat het duurt voordat jouw website reageert op een klik, des te negatiever is deze score. Een goede FID is minder dan 100 milliseconden.
Het is belangrijk om de website zo clean mogelijk te houden met zo min mogelijk zware JavaScript. Zo werkt de website ook prettig en snel op goedkope mobiele apparaten of oude tablets en desktopcomputers.
Wat is Cumulative Layout Shift?
Zorg ervoor dat content niet beweegt op de website. Soms verspringen knoppen op websites, omdat er bijvoorbeeld een afbeelding boven de knop wordt ingeladen. Hierdoor verschuift de hele pagina, waardoor een bezoeker wellicht op de verkeerde knop klikt. De video hieronder laat zien wat er gebeurt.
Dit blok verschuift tijdens het laden plotseling naar het midden. Dit betekent dat in totaal 75% van de viewport (de rode stippellijn) is beïnvloed door dit onstabiele element. Het blok is 25% van de viewport naar beneden geschoven. De rekensom wordt: 0,75 * 0,25 = 0,1875. Stel, dit gebeurt drie keer op de pagina, dan is de totale Cumulative Layout Shift 0,1875 * 3 = 0,5625.
Maar is een CLS van 0,5625 slecht? Jazeker, kijk maar eens naar de schaal die Google hanteert:
Zelf testen?
Gebruik PageSpeed Insights om te testen hoe goed jouw website scoort. Heb je een lage score? Google vertelt je wat je kunt doen om een betere score te krijgen. Of schakel ons in voor optimalisatiewerkzaamheden!
