Afbeeldingen zijn meestal de zwaarste bytes op een pagina, dus ze optimaliseren is de grootste LCP-winst. Drie hefbomen: moderne formaten, responsieve dimensionering, en laadprioriteit.
AVIF en WebP comprimeren veel kleiner dan JPEG/PNG bij dezelfde kwaliteit (AVIF vaak 50% kleiner dan JPEG). Serveer ze met een fallback zodat oude browsers blijven werken:
Stuur geen 2000px-afbeelding naar een 400px-telefoon. srcset laat de browser de juiste grootte voor het apparaat kiezen:
<img
srcset="/p-400.jpg 400w, /p-800.jpg 800w, /p-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 800px"
src="/p-800.jpg" width="800" height="600" alt="...">
sizes vertelt de browser hoe breed de afbeelding wordt weergegeven zodat hij de kleinste toereikende bron kan kiezen.
fetchpriority="high", loading="eager", en overweeg een preload.loading="lazy" zodat hij pas wordt opgehaald wanneer nodig.Houd altijd width/height aan om CLS te voorkomen.
Een trage LCP is meestal gewoon een te grote hero-afbeelding. Formaten kennen (AVIF/WebP), srcset voor de juiste resolutie, en correcte prioriteit — plus de LCP-afbeelding niet lazy-loaden — is de praktische toolkit die interviewers verwachten, en het is meestal de meest impactvolle enkele wijziging op een echte site.
Een bibliotheek met IT-sollicitatievragen met gedetailleerde antwoorden — van Junior tot Senior.
Doneren