Software house Grupa Improve Sp. z o.o. - ul. Marcelińska 94B/181 Poznań

WebP

Popularny format obrazów wpływa pozytywnie na szybkość ładowania stron www, a to ma bardzo duże znaczenie dla komfortu korzystania z sieci na urządzeniach mobilnych. WebP jest produktem Google, firma regularnie go rozwija od września 2010 roku.

Co to jest WebP?

Format obrazów, który został opracowany w 2010 roku przez Google, zastąpił popularne formaty JPG i PNG. WebP łączy w sobie ich najlepsze cechy, zapewniając doskonałą jakość obrazu, jak i mniejszy rozmiar pliku. Wykazuje się bardzo dużą skutecznością w kompresji obrazów. Gwarantuje to szybsze ładowanie się stron internetowych, a tym samym korzystniejsze doświadczenia użytkownika.

Jak działa WebP?

Format zmniejsza rozmiar plików przy zachowaniu wysokiej jakości grafiki. Pliki PNG są zmniejszane o 26%, a JPG o 34%. Aby z niego skorzystać, należy zastosować przeglądarkę Chrome, Opera, Mozilla Firefox, Microsoft Edge, Apple Safari.

Google opracowało dla programistów gotowe rozwiązania pod adresem: https://developers.google.com/speed/webp/download. Dostępne są również pluginy kompatybilne z popularnymi programami graficznymi.

Najprostszym sposobem konwersji pliku JPEG lub PNG do WebP jest skorzystanie z dostępnych w internecie konwerterów, a wybór jest bardzo duży.

Gdy plik zostanie przekonwertowany, należy zmodyfikować kod strony internetowej, aby mógł odwoływać się do nowych plików. Można to zrobić na dwa sposoby:

  • zmieniając nazwy plików graficznych w kodzie HTML,
  • używając specjalnego kodu JavaScript, który automatycznie wczytuje odpowiedni plik graficzny.

Które przeglądarki obsługują WebP?

WebP dostępny jest już od ponad 10 lat. Początkowo obsługiwały go wyłącznie Google Chrome i Opera. Teraz większość przeglądarek zapewnia częściowe lub pełne wsparcie dla tego formatu. Wyjątkiem jest Internet Explorer, który utracił wsparcie w 2021 roku i nie jest rozwijany.

Co zrobić, gdy przeglądarka nie obsługuje WebP?

Starsze wersje przeglądarek nie są kompatybilne z funkcjonalnościami oferowanymi przez ten format obrazów. Użytkownicy, którzy nie zdecydowali się na aktualizację oprogramowania, mogą skorzystać z wyjścia awaryjnego.

Najprostsze rozwiązanie to:

< picture >

< source srcset=”zdjecie.webp” type=”image/webp” >

< source srcset=”zdjecie.jpg” type=”image/jpeg” >

< img src=”zdjecie.jpg” >

< /picture >

Starsze przeglądarki bez wsparcia dla omawianego formatu wyświetlą zdjecie.jpg ze znacznika < source >. Natomiast przeglądarki bez wsparcia dla znacznika < picture > (np. Internet Explorer) wyświetlą zdjecie.jpg ze znacznika < img >

Jakie zalety ma WebP?

  • Zwiększenie wydajności strony, co widać po szybszym jej ładowaniu.
  • Ograniczone zużycie transferu danych, ze względu na mniejszy rozmiar plików. Jest to szczególnie ważne w przypadku osób korzystających z urządzeń mobilnych.
  • Ulepszona optymalizacja wyszukiwarek – Google Core Web Vitals zaleca używanie nowoczesnych formatów graficznych, takich jak WEBP, w celu osiągania lepszych rezultatów SEO.
  • Obsługa przezroczystości i animacji.

Jakie wady ma WebP?

  • Format nie jest obsługiwany przez starsze przeglądarki, m.in. Edge 12-17 i Firefox 2-64.
  • W niektórych przypadkach utrata jakości po konwersji jest nieunikniona. Najczęściej ma to miejsce przy obrazach o najwyższej możliwej rozdzielczości, w których konieczne jest zachowanie wysokiego poziomu szczegółów.

 

Nasza oferta

Umów się
na darmową konsultację