Help en documentatie
Snelheid Gemiddelde impact Makkelijk 20–40 minuten
Moderne beeldformaten (WebP/AVIF)
WebP en AVIF zijn 25-50% kleiner dan JPEG/PNG.
Wat het is
WebP en AVIF zijn moderne beeldformaten met aanzienlijk betere compressie dan JPEG/PNG bij dezelfde kwaliteit. Alle huidige browsers ondersteunen ze.
Waarom het belangrijk is
Afbeeldingen vormen doorgaans het grootste deel van het gewicht van een pagina. Door over te schakelen naar WebP/AVIF worden tientallen procenten aan gegevens bespaard zonder zichtbaar kwaliteitsverlies: een directe versnelling.
Hoe je het doet
- 1Converteer afbeeldingen naar WebP (universeel) of AVIF (nog kleiner).
- 2Gebruik <picture> met een terugval om veilig te zijn.
- 3Automatiseer de conversie in de build / via een CDN met beeldtransformatie.
- 4Wijzig tegelijkertijd het formaat naar de werkelijk benodigde afmetingen.
Voorbeeld
Goed
<picture>
<source srcset="photo.avif" type="image/avif">
<source srcset="photo.webp" type="image/webp">
<img src="photo.jpg" alt="..." width="800" height="600">
</picture>Conclusie
Moderne formaten zijn een van de meest effectieve manieren om het paginagewicht te verminderen. Automatiseer bij voorkeur de conversie, zodat het niet voor elke afbeelding handmatig werk is. Combineer dit met compressie, correcte afmetingen en lazyloading.
Gerelateerde onderwerpen