Im Bereich „Empfehlungen“ Ihres Lighthouse-Berichts werden alle nicht optimierten Bilder mit möglichen Einsparungen in Kibibyte (KiB) aufgeführt. Optimieren Sie diese Bilder, damit die Seite schneller geladen wird und weniger Daten verbraucht:
So markiert Lighthouse Bilder als optimierbar
Lighthouse erfasst alle JPEG- oder BMP-Bilder auf der Seite, legt die Komprimierungsstufe für jedes Bild auf 85 fest und vergleicht dann die Originalversion mit der komprimierten Version. Wenn die potenziellen Einsparungen 4 KiB oder mehr betragen, markiert Lighthouse das Bild als optimierbar.
Bilder optimieren
Es gibt viele Möglichkeiten, Ihre Bilder zu optimieren:
- Bild-CDNs verwenden
- Bilder komprimieren
- Animierte GIFs durch Videos ersetzen
- Bilder mit Lazy Loading
- Responsive Bilder bereitstellen
- Bilder mit den richtigen Abmessungen bereitstellen
- WebP-Bilder verwenden
Bilder mit GUI-Tools optimieren
Ein weiterer Ansatz besteht darin, Ihre Images über ein Optimierer auszuführen, das Sie auf Ihrem Computer installieren und als GUI ausführen. Mit ImageOptim ziehen Sie Bilder beispielsweise per Drag-and-drop in die Benutzeroberfläche. Diese werden dann automatisch komprimiert, ohne die Qualität merklich zu beeinträchtigen. Wenn du eine kleine Website hast und alle Bilder manuell optimieren kannst, ist diese Option wahrscheinlich ausreichend.
Squoosh ist eine weitere Option. Squoosh wird vom Google Web DevRel-Team gepflegt.
Stackspezifische Anleitung
Drupal
Verwenden Sie gegebenenfalls ein Modul, das die über die Website hochgeladenen Bilder automatisch optimiert und reduziert, ohne die Qualität zu beeinträchtigen. Achten Sie außerdem darauf, dass Sie für alle auf der Website gerenderten Bilder die in Drupal integrierten responsiven Bildstile (verfügbar ab Drupal 8) verwenden.
Joomla
Sie können ein Plug-in für die Bildoptimierung verwenden, mit dem Ihre Bilder komprimiert werden, die Qualität jedoch erhalten bleibt.
Magento
Ziehen Sie die Verwendung einer Magento-Erweiterung eines Drittanbieters zur Optimierung von Bildern in Betracht.
WordPress
Sie können ein WordPress-Plug-in zur Bildoptimierung verwenden, mit dem Ihre Bilder komprimiert werden, die Qualität jedoch erhalten bleibt.