Optymalizacja obrazków w WordPress – jak przyspieszyć stronę

Fotograf sprawdzający zdjęcia na aparacie obok laptopa

Zdjęcia i grafiki to zwykle największa część wagi strony internetowej, często ponad połowa całego rozmiaru wpisu czy podstrony. Dlatego kiedy ktoś pyta, od czego zacząć optymalizację WordPressa, odpowiedź prawie zawsze zaczyna się od obrazków. Dobra wiadomość jest taka, że to jeden z łatwiejszych tematów do ogarnięcia, bo większość pracy da się zautomatyzować.

Dlaczego to w ogóle ma znaczenie

Telefony i aparaty robią dziś zdjęcia w rozdzielczości, która często kilkukrotnie przewyższa to, co faktycznie potrzebne jest na stronie. Plik 5–8 MB wrzucony bezpośrednio do wpisu blogowego, wyświetlany w kolumnie szerokiej na 800 pikseli, to marnowanie transferu i czasu użytkownika. Google od dawna bierze szybkość ładowania pod uwagę przy ustalaniu pozycji w wynikach wyszukiwania, a obrazy są tu jednym z głównych podejrzanych.

Kompresja – podstawowy krok

Kompresja zmniejsza wagę pliku, zachowując przy rozsądnych ustawieniach jakość niezauważalną gołym okiem. Format WebP, a coraz częściej też AVIF, potrafi zmniejszyć rozmiar pliku o 30–50% w porównaniu do klasycznego JPG, przy podobnej jakości wizualnej. Wtyczki takie jak Smush, ShortPixel czy Imagify robią to automatycznie przy każdym uploadzie do biblioteki mediów, więc nie trzeba nic robić ręcznie po pierwszej konfiguracji.

Właściwy rozmiar, nie tylko waga pliku

Kompresja to jedno, ale równie ważny jest sam rozmiar w pikselach. Zdjęcie 4000×3000 skompresowane do 500 KB wciąż jest za duże, jeśli wyświetla się w miniaturze 400×300. WordPress sam generuje kilka rozmiarów przy każdym uploadzie, miniaturę, rozmiar średni i duży, ale warto sprawdzić w Ustawieniach → Media, czy te wartości pasują do faktycznego układu strony.

Lazy loading – ładuj to, co widać

Lazy loading, czyli leniwe ładowanie, sprawia, że obrazy poniżej widocznego obszaru strony wczytują się dopiero, gdy użytkownik do nich przewinie. WordPress ma tę funkcję wbudowaną od wersji 5.5, więc w wielu przypadkach nie trzeba nic instalować, działa od razu. Warto tylko sprawdzić, czy nie jest wyłączona przez któryś z pluginów optymalizacyjnych, bo czasem się nawzajem wykluczają.

Alt text to też optymalizacja

Tekst alternatywny przy obrazku to nie tylko kwestia dostępności dla osób korzystających z czytników ekranu, to także miejsce, które Google bierze pod uwagę przy indeksowaniu grafik w wyszukiwarce obrazów. Krótki, opisowy alt, na przykład „serwerownia z rzędami szaf serwerowych” zamiast „obrazek1.jpg”, potrafi przyciągnąć dodatkowy ruch z Google Grafika, o którym łatwo zapomnieć przy planowaniu SEO.

CDN dla obrazów

Jeśli strona ma dużo grafik i odwiedzają ją użytkownicy z różnych regionów, warto rozważyć CDN dedykowany obrazom, na przykład w ramach Cloudflare albo wtyczek typu Jetpack z modułem przyspieszającym. Pliki serwowane są wtedy z serwera najbliższego geograficznie odwiedzającemu, co skraca czas ładowania niezależnie od tego, gdzie fizycznie stoi główny serwer strony.

Co zrobić z biblioteką mediów pełną starych, dużych plików

Jeśli strona działa od lat, w bibliotece mediów zwykle zalega sporo nieskompresowanych, zbyt dużych zdjęć wgranych zanim ktokolwiek pomyślał o optymalizacji. Wtyczki takie jak Smush czy ShortPixel mają opcję zbiorczej optymalizacji całej biblioteki wstecz. Pierwsze uruchomienie bywa czasochłonne przy większej liczbie plików, ale robi się to raz, a efekt widać od razu w wynikach testów szybkości.

Sama optymalizacja obrazów, bez ruszania niczego innego na stronie, potrafi skrócić czas ładowania o kilkadziesiąt procent. To jeden z tych rzadkich przypadków, gdzie stosunkowo mały wysiłek daje duży i łatwo mierzalny efekt.