Najważniejsze w 30 sekund
- Obraz maks. 2× szerszy niż miejsce wyświetlania – dla wpisu 1600 px.
- WebP zamiast JPEG i PNG, AVIF jeśli serwer go obsługuje.
- Istniejącą bibliotekę skompresuj wtyczką – na LiteSpeed modułem w LiteSpeed Cache.
- Lazy loading wszędzie poza pierwszym, największym obrazem.
Wolisz, żebym zrobił to za Ciebie? Zoptymalizuję bibliotekę mediów →
4–6 MB
waży zdjęcie z telefonu
150 KB
wystarczy we wpisie
25–35%
mniej waży WebP niż JPEG
2560 px
od tej szerokości WordPress sam skaluje
Plan w 6 krokach
1
Właściwy rozmiar przed wgraniem
Największa oszczędność – zanim obraz trafi do WordPressa.
2
Nowoczesny format
WebP lub AVIF zamiast JPEG i PNG.
3
Kompresja istniejącej biblioteki
Wtyczka przetworzy wszystkie wgrane obrazy i miniatury.
4
Leniwe ładowanie z wyjątkiem
Bez lazy loadingu dla obrazu LCP.
5
Wymiary i responsywność
width, height i srcset – bez skaczącego układu.
6
Nazwy plików i teksty alternatywne
SEO obrazów i dostępność.
Krok 1: Właściwy rozmiar przed wgraniem
Najwięcej oszczędzasz, zanim obraz trafi do WordPressa. Zasada: obraz nie powinien być szerszy niż dwukrotność miejsca, w którym się wyświetla. Dla treści wpisu (ok. 800 px) wystarczy 1600 px, dla zdjęcia na całą szerokość ekranu – 2000–2400 px.
Ilustracja: to samo zdjęcie przed i po zmniejszeniu i konwersji do WebP. Na ekranie różnicy nie widać, w czasie ładowania – ogromną.
WordPress sam zmniejsza pliki szersze niż 2560 px, zapisując oryginał obok. To zabezpieczenie, a nie optymalizacja – nadal lepiej wgrywać pliki w docelowym rozmiarze. WordPress odrzuca pliki przy wgrywaniu? Zobacz Nie można wgrać zdjęć i plików w WordPress.
Krok 2: Który format do czego
Format
Do czego
Uwagi
WebP
✓ zdjęcia i grafiki
✓ 25–35% lżejszy niż JPEG
AVIF
✓ zdjęcia
! wolniej się koduje, wymaga serwera
PNG
! przezroczystość, zrzuty
! gdy WebP daje gorszy efekt
SVG
✓ logo i ikony
✕ tylko własne pliki – może zawierać kod
JPEG z aparatu
✕ nie wgrywaj wprost
✕ zmniejsz i przekonwertuj
Czy Twój serwer obsługuje WebP i AVIF? Sprawdzisz w Narzędzia → Zdrowie witryny → Informacje → Media. WordPress przyjmie te formaty bez wtyczek, o ile biblioteka graficzna (Imagick lub GD) je zna.
Krok 3: Kompresja istniejącej biblioteki
Do obrazów, które już są na stronie, użyj wtyczki. Na serwerach LiteSpeed, takich jak w Zenbox, najwygodniej użyć modułu optymalizacji obrazów w LiteSpeed Cache. Inne popularne: Converter for Media, EWWW Image Optimizer, ShortPixel i Smush (poleca ją Zenbox w artykule Mój WordPress pracuje wolno). Dobra wtyczka:
- kompresuje wszystkie rozmiary miniatur, nie tylko oryginał,
- tworzy wersje WebP/AVIF i podaje je przeglądarkom, które je obsługują,
- zachowuje oryginały albo pozwala cofnąć zmiany.
Przed masową optymalizacją zrób kopię wp-content/uploads. W Zenbox w razie problemów przywrócisz sam ten katalog z automatycznej kopii (Panel Klienta → Kopie zapasowe → Przywróć pliki lub bazy). Konfiguracja: LiteSpeed Cache.
Biblioteka ma tysiące zdjęć?
Zoptymalizuję całą bibliotekę mediów, ustawię nowoczesne formaty i sprawdzę wynik w PageSpeed Insights przed i po.
Przyspiesz stronę →Krok 4: Leniwe ładowanie – ale nie dla wszystkiego
WordPress automatycznie dodaje obrazom atrybut loading="lazy" – obrazy poniżej ekranu ładują się dopiero przy przewijaniu.
Pierwszy, największy obraz na stronie ma ładować się od razu. Zwykle to zdjęcie w nagłówku. Jeśli wtyczka lub page builder doda mu lazy loading, pogorszysz wskaźnik LCP. Więcej: Core Web Vitals w WordPress.
Krok 5: Wymiary i responsywność
width i height
Każdy obraz powinien mieć wymiary – inaczej układ skacze podczas ładowania (CLS).
srcset
WordPress generuje kilka rozmiarów każdego obrazu, żeby telefon pobrał mniejszą wersję. Nie wyłączaj tego.
Rozmiary miniatur
Przejrzyj Ustawienia → Media i rozmiary dodawane przez motyw – nieużywane to tylko zajęte miejsce na dysku.
Krok 6: Nazwy plików i teksty alternatywne
Opisowa nazwa pliku
Nazwij plik przed wgraniem: kopia-zapasowa-wordpress-panel.webp zamiast IMG_4021.jpg.
Tekst alternatywny
Krótki opis tego, co jest na obrazie. Pomaga osobom z czytnikami ekranu i daje szansę na ruch z Google Grafika.
Szybka lista kontrolna
- Rozmiar dopasowany do miejsca wyświetlania.
- WebP (lub AVIF) zamiast JPEG/PNG.
- Kompresja całej biblioteki wtyczką.
- Lazy loading wszędzie poza obrazem LCP.
- Wymiary, opisowe nazwy plików i teksty alternatywne.
Obrazy to jeden z kroków szerszego planu: Jak przyspieszyć WordPress.
Lżejsza strona
Zoptymalizuję obrazy na Twojej stronie
Cała biblioteka, bez utraty jakości:
- Kompresja wszystkich obrazów i miniatur
- WebP / AVIF z bezpiecznym powrotem do oryginałów
- Lazy loading ustawiony bez szkody dla LCP
- Raport z PageSpeed Insights przed i po
Wycena jest bezpłatna i do niczego nie zobowiązuje.