Sekcja Możliwości w raporcie Lighthouse zawiera listę wszystkich obrazów w starszych formatach, co pokazuje potencjalne oszczędności wynikające z wyświetlania wersji AVIF:
Po co wyświetlać obrazy w formacie AVIF lub WebP?
AVIF i WebP to formaty obrazów o większej kompresji i jakości w porównaniu ze starszymi odpowiednikami JPEG i PNG. Kodowanie zdjęć w tych formatach zamiast JPEG lub PNG oznacza, że będą się one szybciej ładować i zużywać mniej komórkowej transmisji danych.
Format AVIF jest obsługiwany w przeglądarkach Chrome, Firefox i Opera i zapewnia mniejsze rozmiary plików w porównaniu z innymi formatami o takich samych ustawieniach jakości. Więcej informacji na temat formatu AVIF znajdziesz w artykule Udostępnianie obrazów w formacie AVIF.
WebP jest obsługiwany w najnowszych wersjach przeglądarek Chrome, Firefox, Safari, Edge i Opera oraz zapewnia lepszą stratną i bezstratną kompresję obrazów w internecie. Więcej informacji na temat WebP znajdziesz w artykule Nowy format graficzny w internecie.
Jak Lighthouse oblicza potencjalne oszczędności
Lighthouse gromadzi wszystkie obrazy w formacie BMP, JPEG i PNG na stronie, konwertuje je do formatu WebP i oszacowuje rozmiar pliku AVIF, raportując potencjalne oszczędności na podstawie liczby konwersji.
Zgodność z przeglądarką
WebP jest obsługiwany przez najnowsze wersje przeglądarek Chrome, Firefox, Safari, Edge i Opera, natomiast obsługa formatu AVIF jest ograniczona. Musisz przesłać zastępczy obraz PNG lub JPEG na potrzeby obsługi starszych przeglądarek. W artykule Jak mogę wykryć obsługę WebP w przeglądarce? znajdziesz omówienie technik zastępczych, a poniższa lista obsługi formatów obrazów w przeglądarkach.
Aby sprawdzić, jakie formaty są obecnie obsługiwane przez przeglądarki, zapoznaj się z poniższymi artykułami:
Wskazówki dotyczące stosu
AMP
Rozważ wyświetlenie wszystkich komponentów amp-img
w formatach WebP oraz określenie odpowiedniej wartości zastępczej dla innych przeglądarek.
Drupal
Rozważ zainstalowanie i skonfigurowanie w swojej witrynie modułu, który będzie wykorzystywać formaty obrazów WebP. Takie moduły automatycznie generują wersję WebP przesłanych obrazów, aby zoptymalizować czas wczytywania.
Joomla
Możesz skorzystać z plugin lub usługi, która będzie automatycznie konwertować przesłane obrazy do optymalnych formatów.
Magento
Rozważ wyszukanie w Magento Marketplace rozszerzeń innych firm umożliwiających korzystanie z nowszych formatów graficznych.
iPhone
Pamiętaj, że pliki webp, avif i webm nie będą działać na iPhone'ach z systemem iOS 16.
WordPress
Możesz skorzystać z plugin lub usługi, która będzie automatycznie konwertować przesłane obrazy do optymalnych formatów.