Konwersja obrazów z JPG na WebP za pomocą wtyczki do WordPressa. WARTO!

author
Konwersja obrazów z JPG na WebP

Konwersja obrazów z JPG na WebP – dlaczego warto i jak to zrobić?

Aktualizacja PageSpeed Insights od Google przyniosła kilka nowości. Połączenie z narzędziem Lighthouse znacznie zwiększyło ilość zaawansowanych danych, które możemy otrzymać. Jedną ze zmian jest raport dotyczący formatów plików graficznych używanych na stronie. Warto się bliżej przyjrzeć, czym są i jak wykorzystać „formaty nowej generacji” na przykładzie jednego z nich – formatu WebP. 

Czym jest format WebP?

WebP to format plików graficznych dedykowany stronom internetowym. Charakterystyczną cechą, jaka wyróżnia WebP od swoich starszych poprzedników, a więc JPG i PNG, jest wyższy stopień kompresji obrazu. Mówiąc najprościej – tej samej jakości grafika zajmuje mniej miejsca na serwerze, a więc wczytuje się szybciej.

WebP nie jest już nowością. Światło dzienne ujrzał w 2010 roku, a szeroko zaczęto o nim mówić 3 lata później, kiedy format plików graficznych został wdrożony w Google Play. Kolejny raz o WebP zrobiło się głośno wraz z niedawną aktualizacją narzędzia PageSpeed Insights, w którym to Google zaznaczył, jak istotnym jest stosowanie na stronie internetowej obrazów w formatach nowej generacji.

konwersja jpg na webp

Dlaczego warto zwrócić uwagę na format WebP? Chociażby dlatego, że Google jest jego właścicielem, a jak wielokrotnie obserwowaliśmy w przeszłości, gigant z Mountain View faworyzuje technologie, które zakupił. Podobnie było chociażby z Google Analytics.

Pomimo swojego wieku WebP przyjmowany jest jednak w środowisku programistycznym nieco opornie. Objawia się to tym, że wciąż nie wszystkie przeglądarki go obsługują, co utrudnia implementację.  Tym samym przy konwertowaniu grafik musimy się odpowiednio zabezpieczyć.

Co daje konwersja obrazów z jpg na WebP w PageSpeed Insights?

Oczywiście poprawia wyniki! Optymalizacja grafik na stronie internetowej to jedna z najważniejszych (a także najłatwiejszych) czynności, które można wykonać w celu jej przyspieszenia. Konwersja JPG na WebP nie powinna więc stwarzać trudności. Możemy tego dokonać na kilka sposobów – w zależności od CMSa i stopnia dostępu, jaki posiadamy.

Konwersja obrazów z JPG na WebP

Możemy ręcznie przekonwertować obrazy za pomocą zewnętrznego programu, a następnie wgrać je na hosting. Jeśli nie chcemy jednak modyfikować ręcznie plików, a nasza strona zbudowana jest na popularnym WordPressie, najłatwiej będzie użyć wtyczki.

Prosta wtyczka WordPress do konwersji plików JPG i PNG na WebP

Wtyczek oferujących konwersję z JPG, PNG czy GIF na WebP jest wiele. Taką możliwość daje chociażby ShortPixel Image Optimizer.

Konwersja obrazów z JPG na WebP 2

ShortPixel Image Optimizer w wersji darmowej umożliwia konwersję ze starszych formatów na WebP do 100 zdjęć miesięcznie. Dodatkowo mamy do wyboru wykupienie opcji abonamentowej lub jednorazowe zasilenie konta.

Dla oszczędnych przewidziano opcje polecenia programu, dzięki któremu zarówno osoba polecająca, jak i rejestrującą się, otrzyma dodatkową możliwość jednorazowej kompresji dodatkowych 100 zdjęć.

Konwersja JPG na WebP krok po kroku

Wtyczkę ShortPixel Image Optimizer pobieramy jak wszystkie inne. Po jej włączeniu w panelu WordPressa zostaniemy poproszeni o wpisanie klucza API. Wystarczy zarejestrować się na stronie, podając dowolny e-mail, do którego mamy dostęp. W kilka sekund otrzymamy wiadomość z kluczem.

Podstawową funkcją wtyczki jest kompresja zdjęć w ramach tego samego formatu. Nas interesuje zamiana formatu z JPG, PNG czy GIF na WebP. W tym celu udajemy się do zakładki ADVANCE i zaznaczamy następujące opcje:

Konwersja obrazów z JPG na WebP 3

Jak już wspominaliśmy, format WebP nie jest obsługiwany przez wszystkie wyszukiwarki. Zaznaczenie powyższych opcji sprawi jednak, że zdjęcia wyświetlą się prawidłowo i w takim przypadku. Wtyczka automatycznie tworzy w pliku .htaccess funkcję, której celem będzie wyświetlenie nowego formatu zdjęć kompatybilnym przeglądarką, a starego tym, które WebP nie obsługują.

Konwersja obrazów na WebP page speed

Po zaznaczeniu opcji klikamy button i przechodzimy do ostatniej zakładki, w której widzimy, ile zdjęć może ulec konwersji na nowszy format. Posiadany darmowy limit 100 zdjęć powinien wystarczyć na mała wizytówkową stronę, jeśli jednak posiadamy więcej grafik lub chcemy również przekonwertować miniatury, będzie nam potrzeba kilku wiernych znajomych lub nieco gotówki.

page speed insights konwertowanie

Po naciśnięciu button nextprzechodzimy do procesu. W podglądzie widzimy każdy obraz, który wtyczka obecnie konwertuje oraz w jakim stopniu jej rozmiar zostanie zredukowany.

przekonwertowane fotki

Po zakończonym procesie nie pozostaje nam już nic innego, jak wrócić do narzędzia PageSpeed Insights i ponownie przeskanować stronę. W tym przypadku narzędzie pokazało wzrost szybkości o 7 oczek. Piękny początek udanego pozycjonowania. 🙂 

wynik page speed insights

Verseo  Darmowa Wycena

Powiązane wpisy

Dodaj komentarz

2 comments

  1. Boleń tropikalny

    Hmmm, Panie Jacku a czy zna Pan może podobne narzędzie na Joomli? Mam stronkę z odżywkami dla rybek akwariowych i ze względu na dużą liczbę obrazków także bym chciał we własnym zakresie zoptymalizować opublikowane grafiki. Dodam od razu, że nie zamierzam przenosić strony na WordPress co sugerował mi inny pozycjoner, ze względu na to że mamy rodzinny biznes, który prowadzą rodzice i trudno byłoby mi teraz ich nauczyć obsługi nowego cms-a. Będę wdzięczny za wskazówki 🙂

    • Maciej Popiołek

      Maciej Popiołek

      Odpowiedź od Jacka:
      „W przypadku Joomli można skorzystać z zewnętrznych narzędzi (np. bezpłatne smush it do optymalizacji obrazów). Można też skorzystać z dodatku JCHOptimize. Jest to dodatek, który w wersji bezpłatnej może przyspieszyć cachowanie, włączyć minifikację plików HTML, usprawnić kompresję plików CSS i JS. Wersja Premium dodatkowo pozwala włączyć wsparcie CDN czy optymalizować obrazy.”
      Mamy nadzieję, że to pomoże. 🙂

      -1

Copyright © 2018 Agencja Interaktywna Verseo - wszelkie prawa zastrzeżone

Polityka prywatności | Witryna wykorzystuje pliki cookies