Skip to content

Wszystko o WordPressie, tworzeniu stron — i nie tylko

⚡ Jak zoptymalizować obrazy w WordPress za pomocą EWWW Image Optimizer

⚡ Jak zoptymalizować obrazy w WordPress za pomocą EWWW Image Optimizer

Powolna strona irytuje. Ale jeszcze bardziej frustrujące jest to, gdy przyczyną spowolnienia nie jest kod ani hosting, a po prostu obrazy, których nikt nie skompresował. Google PageSpeed Insights przy każdym audycie podświetla „optymalizuj obrazy" na czerwono, a Pan traci pozycje w wynikach wyszukiwania i cierpliwość odwiedzających.

Od 2015 roku Google wykorzystuje szybkość jako czynnik rankingowy. Obrazy zajmują ponad połowę wagi przeciętnej strony, a ich kompresja daje najszybszy i najbardziej zauważalny wzrost wydajności. Jedna wtyczka zamyka to zadanie całkowicie.

EWWW Image Optimizer, bezpłatne narzędzie z ponad 1 milionem aktywnych instalacji, które kompresuje JPG, PNG, GIF i WebP bezpośrednio na Pana serwerze, bez zewnętrznych API i limitów. W tym poradniku: konfiguracja krok po kroku od instalacji po masową optymalizację i weryfikację rezultatu.

💡 Szybki przegląd:

  • Proszę zainstalować EWWW Image Optimizer i sprawdzić kompatybilność serwera, wtyczka sama pokaże, czego brakuje
  • Proszę skonfigurować poziomy kompresji: bezstratna dla PNG/GIF, jakość JPG 80, PageSpeed przestanie narzekać na obrazy
  • Proszę włączyć konwersję do WebP i dopisać reguły przepisywania, format Google zmniejsza rozmiar o 60% bez utraty jakości
  • Proszę uruchomić Bulk Optimizer dla wszystkich istniejących obrazów i sprawdzić wynik w PageSpeed Insights

1. Instalacja i sprawdzenie kompatybilności serwera

Proszę zainstalować wtyczkę przez panel administracyjny WordPress lub pobierając ZIP z wordpress.org. Zaraz po aktywacji proszę wejść w Ustawienia → EWWW Image Optimizer.

Status wtyczki EWWW, sprawdzanie zgodności serwera

Pierwszą rzeczą, którą Pan zobaczy, jest blok „Status wtyczki". Zielone znaczniki oznaczają, że wszystko, co niezbędne, jest zainstalowane. Na czerwono podświetlone są brakujące moduły: jpegtran do kompresji JPG, optipng do PNG, gifsicle do GIF i cwebp do konwersji do WebP. Większość hostingów włącza je domyślnie, ale jeśli czegoś nie ma, proszę skontaktować się z pomocą techniczną hostingu. Wtyczka oferuje również optymalizację w chmurze przez Compress API, gdy lokalne narzędzia są niedostępne.

Strona główna wtyczki EWWW Image Optimizer

Na tym etapie nie zaszkodzi zajrzeć do sekcji szybkości ładowania WordPress, optymalizacja obrazów to tylko jedna z 21 technik, które w sumie dają zieloną strefę w PageSpeed.

2. Podstawowa konfiguracja wtyczki

Zakładka „Ustawienia podstawowe", tutaj definiujemy fundament działania wtyczki.

Podstawowe ustawienia kompresji EWWW Image Optimizer

Klucz API do optymalizacji w chmurze. Nie jest obowiązkowy. Twórca udostępnia bezpłatne kredyty na testowanie trybu chmurowego w zamian za zgodę na wysyłanie anonimowych statystyk użytkowania. Ale lokalne narzędzia radzą sobie nie gorzej i bez ograniczeń, dla większości stron w zupełności wystarczą.

Usuwanie metadanych. Warto zaznaczyć to pole. Smartfony i aparaty zapisują w plikach tagi EXIF/IPTC, współrzędne zdjęcia, model urządzenia, datę. To zbędny balast i potencjalny wyciek prywatności. Klienci często nie podejrzewają, że ich zdjęcia przechowują współrzędne GPS.

Poziomy kompresji. Dla JPG, PNG i GIF proszę wybrać „Bezstratną" (Lossless). Według danych dewelopera średnia oszczędność na kompresji bezstratnej wynosi 8% pierwotnego rozmiaru. Pliki PDF proszę pozostawić bez kompresji: po pierwsze, jest to funkcja premium, po drugie, PDF zazwyczaj udostępnia się do pobrania, a ich rozmiar nie wpływa na szybkość ładowania strony.

3. Ustawienia zaawansowane i jakość JPG

Zakładka „Ustawienia zaawansowane" zawiera parametry, które bezpośrednio wpływają na wyniki PageSpeed Insights.

Ustawienia zaawansowane, jakość JPG i optymalizacja równoległa

Jakość JPG. WordPress domyślnie kompresuje JPG na poziomie 82. Zalecam ustawienie 80, różnica dla oka jest niezauważalna, a PageSpeed przestaje zgłaszać „niezoptymalizowane obrazy". Na dziesiątkach stron to ustawienie ani razu nie dało fałszywego alarmu.

Optymalizacja równoległa i planowana. Jeśli mają Państwo stronę firmową z rzadkim dodawaniem obrazów, tych opcji można nie ruszać. Ręczne uruchomienie Bulk Optimizer w razie potrzeby to wystarczający scenariusz. Na wydajnym serwerze z częstymi publikacjami proszę włączyć optymalizację planowaną (scheduled optimization).

Foldery do optymalizacji. Podczas masowego przetwarzania wtyczka skanuje dwa ostatnie foldery biblioteki mediów. To prawie zawsze wystarcza. Jeśli znajdą Państwo pominięte katalogi, proszę dodać je ręcznie, ale zaraz potem kliknąć „Zapisz". Przejście na inną zakładkę przed zapisaniem resetuje wprowadzone ścieżki, to znana cecha wtyczki.

Opcje „Włącz pomoc wbudowaną" i „Zezwól na śledzenie użycia" pozostawiam do Państwa uznania.

4. Zmiana rozmiarów obrazów

Ustawienia zmiany rozmiarów w EWWW Image Optimizer

Najważniejsze, co warto włączyć, to „Zezwól na zmianę rozmiaru istniejących obrazów". Jeśli obrazek o szerokości 2000 pikseli jest wstawiony w kolumnę 480 pikseli, CSS skaluje go wizualnie, ale przeglądarka i tak ładuje pełnowymiarowy plik. To ustawienie przycina rzeczywisty rozmiar do wymaganego.

Image Detective, przydatna funkcja do audytu. Gdy jest włączona, widzą Państwo na stronie (będąc zalogowanym) obrazy, które ładują się w większej rozdzielczości, niż są wyświetlane. Szybki sposób na znalezienie kandydatów do zmiany rozmiaru bez ręcznego przeglądania biblioteki mediów.

5. Konwersja do WebP

WebP, format od Google, który przy porównywalnej jakości waży o 25-35% mniej niż JPG i o 60% mniej niż PNG. Wszystkie nowoczesne przeglądarki go obsługują. EWWW potrafi automatycznie generować wersje WebP dla każdego przesyłanego obrazu.

Ustawienia konwersji WebP w EWWW Image Optimizer

Proszę włączyć opcję „JPG/PNG do WebP". Pola Force WebP, WebP URLs oraz Alternative WebP Rewriting proszę pozostawić puste, standardowy mechanizm jest wystarczający dla większości konfiguracji.

Kluczowy krok: kliknąć przycisk „Wstaw reguły przepisywania". Wtyczka doda dyrektywy w .htaccess, które serwują przeglądarce wersję WebP pliku, gdy ją obsługuje. Po pomyślnym wstawieniu wskaźnik zmieni się z czerwonego „PNG" na zielony „WEBP".

Ustawienia konwersji formatów obrazów w EWWW

Na zakładce „Konwersja" radzę zaznaczyć „Zachowaj obrazy źródłowe". Wtyczka zastąpi plik zoptymalizowaną wersją tylko wtedy, gdy jest ona mniejsza od oryginału. Kilkadziesiąt megabajtów na kopie zapasowe to rozsądne zabezpieczenie przed błędem.

6. Optymalizacja masowa przez Bulk Optimizer

Wszystkie ustawienia są już skonfigurowane, teraz kompresujemy istniejącą bibliotekę mediów.

Strona optymalizacji zbiorczej Bulk Optimizer w EWWW

Proszę przejść do Media → Bulk Optimizer. Przy pierwszym uruchomieniu znaczniki wymuszonej ponownej optymalizacji i pauzy między obrazami nie są potrzebne. Proszę kliknąć „Skanuj niezoptymalizowane obrazy", pojawi się pasek postępu.

Wtyczka przeszukuje bibliotekę mediów, folder motywu i wstępnie skonfigurowane katalogi. Dla strony z kilkuset obrazami proces trwa kilka minut. Widzą Państwo oszczędność dla każdego pliku i łączne podsumowanie.

Jeśli po zakończeniu PageSpeed nadal oznacza pojedyncze pliki, proszę skopiować ścieżkę do folderu i dodać ją do listy optymalizowanych katalogów, a następnie ponownie uruchomić skanowanie.

7. Weryfikacja wyniku

Proszę otworzyć Google PageSpeed Insights i wprowadzić URL kilku stron serwisu. Audyt „Serve images in next-gen formats" oraz „Efficiently encode images" powinien pokazać zielony status.

Wyniki testu PageSpeed Insights, optymalizacja obrazów zaliczona

Różnica w liczbach wygląda skromnie: oszczędność 16-30 KB na jednym obrazie. Proszę jednak pomnożyć to przez 50 obrazków na stronie i przez tysiące odsłon miesięcznie: łączny efekt mierzy się już w megabajtach transferu i sekundach ładowania. Dla odwiedzających mobilnych na wolnym połączeniu to różnica między „zostać" a „zamknąć kartę".

Jeśli chcą Państwo zgłębić temat, oto 21 sposobów na przyspieszenie WordPressa, które obejmują nie tylko obrazy, ale także buforowanie, skrypty, czcionki i bazę danych.

W poniższym filmie: instalacja i konfiguracja EWWW Image Optimizer krok po kroku w 8 minut.

⁉️🤔 Często zadawane pytania

Wtyczka kompresuje oryginały czy tworzy kopie?

Domyślnie EWWW zastępuje plik źródłowy zoptymalizowaną wersją, ale tylko wtedy, gdy jest ona MNIEJSZA od oryginału. Wtyczka nigdy nie zwiększy wagi obrazu. Na karcie „Konwersja" można włączyć zapisywanie kopii zapasowych, oryginały pozostaną w osobnym folderze wp-content/ewww/backup/.

Co zrobić, jeśli serwer nie obsługuje lokalnych narzędzi kompresji?

Proszę włączyć chmurowy Compress API. Jest on bezpłatny dla kompresji bezstratnej JPG i konwersji do WebP. Wystarczy zezwolić na anonimowe statystyki użytkowania w ustawieniach. Jeśli i ta opcja nie odpowiada, proszę rozważyć alternatywy, takie jak ShortPixel lub Smush.

Jak sprawdzić, czy WebP jest serwowany do przeglądarki?

Proszę otworzyć DevTools (F12) → zakładka Network → przefiltrować według typu Img. W kolumnie Type dla obrazów z Pana/Pani strony powinno widnieć webp. Alternatywny sposób: w pasku adresu przeglądarki proszę otworzyć bezpośredni link do obrazu ze strony, Chrome i Firefox pokażą wersję WebP, jeśli jest dostępna.

Bulk Optimizer zawiesił się w połowie, co robić?

Proszę odświeżyć stronę i uruchomić go ponownie. Wtyczka zapamiętuje postęp i będzie kontynuować od tego samego miejsca. Jeśli problem się powtarza, proszę zwiększyć wartość pauzy między obrazami w ustawieniach i spróbować usunąć szczególnie ciężkie pliki z kolejki za pomocą filtra ewww_image_optimizer_timeout.

Czy EWWW jest potrzebny, jeśli hosting już kompresuje obrazy?

Kompresja na hostingu zwykle działa w locie i nie zmienia pliku źródłowego, serwuje wersję z pamięci podręcznej przez swój CDN. EWWW optymalizuje same pliki w bibliotece mediów. Najlepiej działają razem: EWWW zmniejsza oryginały, a cache hostingu szybko je dystrybuuje. Proszę wyłączyć dublujące się funkcje (na przykład podwójną konwersję do WebP), jeśli się pokrywają.

Co zmieniło się w EWWW do 2026 roku?

Wtyczka jest aktywnie rozwijana. W wersjach 8.x pojawiła się natywna obsługa AVIF, formatu nowej generacji, który według testów twórców AVIF daje oszczędność do 50% rozmiaru pliku w porównaniu z WebP przy tej samej jakości. Co prawda konwersja do AVIF jest na razie dostępna w subskrypcji premium przez Easy IO CDN.

Lazy Load z automatycznym skalowaniem jest teraz wbudowany w darmową wersję i prawidłowo rezerwuje miejsce pod obraz, co eliminuje Cumulative Layout Shift, za który PageSpeed również nakłada kary.

Jeśli potrzebują Państwo prostego, gotowego do użycia „od razu po wyjęciu z pudełka" rozwiązania do optymalizacji obrazów, EWWW Image Optimizer pozostaje jedną z najlepszych bezpłatnych opcji. Proszę skonfigurować go raz, zgodnie z krokami z tego poradnika, i zapomnieć o czerwonych ostrzeżeniach w PageSpeed.

🔗 EWWW Image Optimizer na WordPress.org