Zacznijmy od tego czy optymalizacja grafik na stronie internetowej w ogóle czemukolwiek służy. W swojej pracy spotykam wiele osób, które mówią, że dla nich optymalizacja jest kompletnie nie istotna. Ale gdy zadaję pytanie, czy zależy im na tym, aby za pośrednictwem swojej strony pozyskiwać większą ilość klientów i więcej sprzedawać, w przytłaczającej większości odpowiadają bez zastanowienia TAK.

Spis treści

Co daje optymalizacja grafik na stronie?

Jeśli zależy ci na tym aby Twoja strona efektywniej przyciągała ruch i skuteczniej konwertowała osoby, które na nią trafią w Klientów, pod żadnym pozorem nie ignoruj tematu optymalizacji grafik.

Ma ona realny wpływ na to jak szybko twoja strona lub sklep internetowy będzie uruchamiał się w ich przeglądarkach. To z kolei, idąc krok dalej, przekłada się na współczynnik konwersji, odrzuceń i w końcu jest również jednym z czynników mający wpływ na pozycje w wynikach wyszukiwania.

Na ten temat sporo mówimy na kursach, ale pomimo tego w pewnym momencie cześć świadomych osób z różnych powodów zaczyna po macoszemu traktować ten temat.

Nie zawracaj sobie nią głowy

Problemem jest zazwyczaj czas, którego niestety mamy zbyt mało. Z drugiej strony prowadzenie strony wymaga od nas wielu działań i po prostu w pewnym momencie zaczynamy się w tym wszystkim gubić.

Dlatego tam gdzie to możliwe, staraj się wdrażać procesy automatyzacji. Tego typu działania dotyczą nie tylko tak oczywistych zagadnień jak przetwarzanie zamówień w sklepie internetowym czy automatyzacja procesów związanych chociażby z email marketingiem, ale także możemy sporo zrobić na tym polu optymalizacji zdjęć i grafik, którymi okraszamy naszą witrynę, a które są jakże istotnym jej elementem.

Czym automatyzować procesy optymalizacji grafik?

Popularne dodatki do WordPressa, to między innymi:

Z powyższej listy najlepiej, przynajmniej w moim wypadku, sprawdza się ShortPixel. I to właśnie z tego serwisu zintegrowanego z większością moich witryn korzystam.

Jak to jednak w życiu bywa, co jakiś czas pojawiają się alternatywy, którym warto się przyglądać. Jedną z nich jest usługa GUMLET, która z początku wydawała mi się mało interesująca, ale jak się okazało w praktyce sprawdza się lepiej niż wiele innych podobnych rozszerzeń z ShortPixel włącznie.

Gumlet

Twórcy tego projektu wyszli z założenia, że produkt który udostępnią swoim klientom ma być maksymalnie prosty w obsłudze. I w rzeczy samej tak jest. Jeśli przyjrzymy się procesowi integracji Gumlet z naszą stroną działającą na WordPressie, zajmuje ona dosłownie nie więcej niż kilkadziesiąt sekund, a efekty widoczne są natychmiast.

ShotPixel vs Gumlet

To co odróżnia Gumlet np. od ShortPixel, to fakt że zoptymalizowane i przetworzone grafiki, ładowane są z wydajnej sieci cloudfront należącej do Amazona.

Short Pixel może jednak działać w dwojaki sposób. Z jednej strony może optymalizować grafiki i zapisywać je bezpośrednio na naszym koncie hostingowym, skąd dalej pobierane są w momencie, gdy ktoś stronę odwiedza. Z drugiej zaś, istnieje także możliwość wykorzystania wtyczki ShortPixel AI i skonfigurowania całości w taki sposób, aby grafiki ładowały się z sieci CDN. Jest to jednak ich własna sieć, która mimo wszystko jest mniej wydajna i skromniej rozbudowana od pajęczyny Amazona.

Czy Gumlet dobrze radzi sobie z optymalizacją?

Jak możecie zaobserwować chociażby na filmie, który dostępny jest na początku tego artykułu (zachęcam do obejrzenia i subskrypcji kanału YT), Gamet w bardzo przyzwoity sposób poradził sobie z optymalizacją grafik, podnosząc tym samym istotne z punktu widzenia wydajności metryki na GTMetrix. Jeśli wykonacie testy przy wykorzystaniu innych narzędzi analitycznych z pewnością także zaobserwujecie poprawę. Czy to będzie spektakularna zmiana czy nie, to oczywiście zależy od wielu czynników.

Interesujące w przypadku Gumet jest także to, że jest w stanie optymalizować pliki GIF, a także pliki SVG. Poza tym zapowiadają  optymalizację plików wideo, co może być dla części z Was także interesujące.

Nie zauważyłem także problemów na stronach wykorzystujących Elementora czy sklep WooCommerce.

Jak zintegrować Gumlet ze stroną WordPress

Poniżej krótki przewodnik, zresztą nie może być długi, ponieważ tak jak wspomniałem Gumlet celuje w maksymalną prostotę 🙂

Koszty wykorzystania Gumlet

Pierwsze od czego musimy zacząć do rejestracja konta na stronie projektu https://www.gumlet.com. Możecie aktywować usługę na rok bezpłatnie, gdzie limit transferu danych z sieci CDN będzie na poziomie 1 GB miesięcznie.

Gumlet wersja darmowa

W przypadku testów lub w sytuacji gdy mamy stronę z małym ruchem, ten poziom transferu może być w zupełności wystarczający, a więc może się okazać, że nie będziecie musieli przez rok nic płacić.

Pytanie więc jakie są koszty w przypadku kiedy przekroczymy wspomniany 1 GB transferu? I tu także dobra wiadomość, ponieważ opłaty są naprawdę symboliczne. Za pakiet 10 GB zapłacicie raptem jednego dolara. Nie jest to opłata miesięczna.

Gumlet koszt pakietu transferu danych z CDN

O ile dobrze pamiętam, to gdybyście chcieli korzystać z sieci CDN cloudfront, wówczas 1 GB transferu kosztuje 0,08 centa, czyli za 10 GB byłoby to 0,80 dolara. Biorąc to pod uwagę i fakt że wykorzystując Gumlet wasze dane ładowane są właśnie z sieci Amazona, a do tego jeszcze są optymalizowane, to koszty tej usługi są naprawdę rewelacyjnie niskie.

Gumlet LifeTime Deal 🔥

Sprawdźcie też czy przypadkiem oferty Gumlet nie ma wciąż na AppSumo. Na filmie o tym mówię i w momencie kiedy piszę ten artykuł oferta nadal jest dostępna. Możecie to zweryfikować pod tym adresem https://appsumo.com/r/xufnk7c/

Deal polega na tym, że płacąc jednorazowo np. 39 dolarów macie dożywotnio transfer miesięczny na poziomie 100 GB, jest to więc łakomy kąsek.

Aktywacja i konfiguracja

Gdy usługę macie aktywną, to bez względu na to czy zdecydujecie się na wersję płatną, wersję darmową czy uda wam się ustrzelić lifetime na AppSumo, pierwszym krokiem będzie utworzenie kontenera dla naszych grafik.

Aby to zrobić po zalogowaniu się kliknij w przycisk dodawania nowego źródła.

dodawanie nowego źródła

Uzupełnij prosty formularz konfiguracyjny. W przypadku integracji z WordPressem w zasadzie jedyne co musisz zrobić, to wprowadzić adres swojej strony i wpisać dowolną nazwę subdomeny czyli adresu, z którego ładowane będą twoje grafiki.

Konfiguracja źródła Gumlet

W kolejnym kroku w zasadzie niczego nie musisz modyfikować. Zostaw domyślne ustawienia, czyli aktywną opcję konwersji do formatu WebP i optymalizację. Na dobrą sprawę wystarczy kliknąć przycisk zakończ (Finish) i źródło mamy przygotowane do pracy.

Konfiguracja wtyczki WordPress dla Gumlet

Kolejnym krokiem będzie doinstalowanie do naszej strony działającej na WordPressie i wtyczki Gumlet. Oczywiście znajdziesz ją w repozytorium.

Po instalacji przejdź do ustawień i wprowadź nazwę subdomeny, którą utworzyłeś wcześniej konfigurując źródło w panelu zarządzania Gumlet.

Gumlet i konfiguracja wtyczki WordPress

Dodatkowo możesz zdecydować o tym czy chcesz aktywować “leniwe” ładowanie obrazków, automatycznie formatować grafiki i czy chcesz je kompresować oraz to w jakim stopniu. Tu poeksperymentuj i dostosuj stopień kompresji do swoich potrzeb. Ilość ustawień jak widać na powyższym zrzucie jest minimalna.

Zapisujesz zmianę i to w zasadzie koniec konfiguracji. Od tego momentu twoja strona powinna działać wydajniej, grafiki będą odchudzone, a metryki w takich narzędziach analitycznych jak GTMetrix, Google Page Speed Insights powinny też się poprawić.

Czy warto przesiąść się na Gumlet jeśli korzystasz z ShortPixel?

Testy, które przeprowadziłem wskazują na to, że takie przejście może przynieść odczuwalne korzyści, ale zawsze jednak trzeba uwzględnić specyfikę konkretnej strony i konkretnego projektu.

Dlatego zanim zdecydujesz się na zmianę sugeruję uruchomić darmową wersję Gumlet wyłączyć ShortPixel lub inną wtyczkę z której korzystasz, aktywować Gumlet i sprawdzić czy wydajność uległa poprawie. To najprostszy sposób na zweryfikowanie tego czy zastosowanie nowego rozszerzenia w twoim konkretnym przypadku będzie miało uzasadnienie.

Jeśli masz już jakieś doświadczenia z tym rozszerzeniem i chciałbyś się nimi podzielić, zapraszam do zostawienia komentarza. Z kolei jeśli jesteś uczestnikiem moich kursów, to o wtyczce możemy także porozmawiać na https://hellowp.pl

Zapraszam !

Udostępnij

Zobacz również

Publikacje prosto na Twój email!

Zapisz się i obserwuj co dzieje się na Wooj, Uczymyjak i PoznajWP

W każdej chwili możesz zrezygnować z subskrypcji. Twój adres jest bezpieczny.

Polecane Oferty LifeTime!

WooLentor Lifetime Deal

WooLentor

Builder dla WooCommerce. Zaprojektujesz strony koszyka, zamówienia, konta klienta, produktów itd… Do tego ogrom innych funkcji, pozwalających zwiększyć konwersję.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *