In het gedeelte Mogelijkheden van uw Lighthouse-rapport worden alle niet-geoptimaliseerde afbeeldingen vermeld, met potentiële besparingen in kibibytes (KiB) . Optimaliseer deze afbeeldingen zodat de pagina sneller laadt en minder data verbruikt:
Hoe Lighthouse afbeeldingen markeert als optimaliseerbaar
Lighthouse verzamelt alle JPEG- of BMP-afbeeldingen op de pagina, stelt het compressieniveau van elke afbeelding in op 85 en vergelijkt vervolgens de originele versie met de gecomprimeerde versie. Als de potentiële besparing 4KiB of meer bedraagt, markeert Lighthouse de afbeelding als optimaliseerbaar.
Hoe afbeeldingen te optimaliseren
Er zijn veel stappen die u kunt nemen om uw afbeeldingen te optimaliseren, waaronder:
- Gebruik van image-CDN's
- Afbeeldingen comprimeren
- Geanimeerde GIF's vervangen door video
- Lui laden van afbeeldingen
- Responsieve afbeeldingen weergeven
- Afbeeldingen weergeven met de juiste afmetingen
- WebP-afbeeldingen gebruiken
Optimaliseer afbeeldingen met GUI-tools
Een andere benadering is om uw afbeeldingen door een optimalisatieprogramma te laten lopen dat u op uw computer installeert en als GUI uitvoert. Met ImageOptim sleept u bijvoorbeeld afbeeldingen naar de gebruikersinterface, waarna de afbeeldingen automatisch worden gecomprimeerd zonder dat de kwaliteit merkbaar in gevaar komt. Als u een kleine site heeft en alle afbeeldingen handmatig kunt optimaliseren, is deze optie waarschijnlijk goed genoeg.
Squoosh is een andere optie. Squoosh wordt onderhouden door het Google Web DevRel-team.
Stapelspecifieke begeleiding
Drupal
Overweeg het gebruik van een module die automatisch de grootte van afbeeldingen die via de site worden geüpload, optimaliseert en verkleint, terwijl de kwaliteit behouden blijft. Zorg er ook voor dat u de native Responsive Image Styles van Drupal
gebruikt voor alle afbeeldingen die op de site worden weergegeven.
Joomla
Overweeg het gebruik van een plug-in voor beeldoptimalisatie die uw afbeeldingen comprimeert met behoud van kwaliteit.
Magento
Overweeg het gebruik van een Magento-extensie van derden die afbeeldingen optimaliseert .
WordPress
Overweeg het gebruik van een WordPress-plug-in voor beeldoptimalisatie die uw afbeeldingen comprimeert met behoud van kwaliteit.