To samo "kompresja WebP" wcale nie oznacza tego samego dla różnych osób:
niektórzy chcą przekonwertować całą grupę JPG, PNG na WebP; inni mają już WebP i chcą go lekko skompresować; jeszcze inni muszą obsłużyć animowane WebP.
Nie ma idealnych narzędzi, tylko te odpowiednie dla Twoich potrzeb. W tym artykule przedstawiamy rekomendacje dla różnych scenariuszy, dla każdego scenariusza podając tylko te najbardziej wygodne.
Zanim zaczniemy: dwie minuty o WebP
WebP w rzeczywistości występuje w trzech formach:
- Zniekształcony WebP (Lossy): podobny do JPEG, odrzuca detale zgodnie z parametrem jakości, mniejszy rozmiar, odpowiedni do zdjęć, banerów.
- Bezstratny WebP (Lossless): podobny do PNG, piksele są w pełni zachowane, odpowiedni do zrzutów ekranu, materiałów UI.
- Animowany WebP (Animated): wieloklatkowe animacje, może być zniekształcony lub bezstratny, powszechnie spotykany w memach i animacjach demonstracyjnych przekonwertowanych z GIF.
Nie jesteś pewien, jaki typ masz, użyj oficjalnego narzędzia Google webpinfo:
bash
brew install webp
webpinfo image.webp
W wyniku VP8 oznacza zniekształcony, VP8L bezstratny, obecność ANIM / ANMF oznacza animację.
Warto wiedzieć jeszcze jedną rzecz: dla zniekształconego WebP ponowne kodowanie o wyższym parametrze jakości powiększy rozmiar pliku, a jakość się nie poprawi – odrzucone detale nie wracają. Dlatego dobre narzędzie do kompresji dla już istniejących obrazów WebP powinno rozpoznać "nie da się skompresować" i nie próbować.
Scenariusz 1: Przekonwertuj JPG / PNG na WebP
To najczęstsze zadanie przy pierwszym kontakcie z WebP.
Dla graficznego interfejsu wybierz XnConvert. Darmowy, wieloplatformowy, możesz włożyć jednocześnie grupę obrazów, ustawić jakość lub tryb bezstratny WebP, a także zmienić rozmiar, nazwę pliku. Do zmiany formatu jest najwygodniejsze.
Dla zintegrowania w procesie budowania wybierz cwebp lub sharp. W projektach stron internetowych lepiej automatycznie obsłużyć to przy spakowywaniu lub przesyłaniu do CDN niż ręcznie:
bash
cwebp: jakość 75, najwolniejsza metoda kodowania, zachowanie profilu kolorów
cwebp -q 75 -m 6 -metadata icc input.jpg -o output.webp
js
// sharp (Node.js)
await sharp('input.jpg').webp({ quality: 75, effort: 6 }).toFile('output.webp')
Nie wiesz, jak ustawić parametry? Najpierw spróbuj Squoosh. Google'owe narzędzie online, obsługuje pojedyncze pliki, ale możesz podzielić ekran, przesuwać suwaki jakości w czasie rzeczywistym. Zrozum, "jaka jakość jest odpowiednia dla tego typu obrazów", a następnie wypełnij parametry w narzędziu do masowej konwersji.
Scenariusz 2: Masz już WebP, chcesz go lekko skompresować
Strona już używa WebP, ale Lighthouse nadal sugeruje, że "obrazy można dalszo skompresować"; albo w folderze materiałów jest dużo WebP, zajmuje miejsce. Wtedy nie potrzebujesz zmiany formatu, ale mniejszego pliku na miejscu.
Użytkownicy Mac: ImgZilla
ImgZilla to nasze narzędzie do kompresji obrazów dla macOS, idealne do tego scenariusza:
- Kompresja na miejscu, ścieżka bez zmian.
banner.webppo kompresji nadalbanner.webp, odwołania w kodzie, dokumentacji nie trzeba zmieniać. - Cały folder włożony naraz. Rekursywnie skanuje podfoldery, automatycznie pomija pliki ukryte i
node_modules; WebP, JPG, PNG, GIF, AVIF, HEIC, SVG przetwarza razem. - Nie trzeba ustawiać parametrów. Używa kodera Google libwebp, jakość 75, poziom wysiłku 4, zgodnie z domyślnymi wartościami Squoosh; kanał przezroczystości zachowany na najwyższej jakości, tło nie będzie rozmazane.
- Nie "wymusza" kompresji. Po ponownym kodowaniu, jeśli plik nie zmniejszył się (współczynnik kompresji < 0.4%), jest oznaczony jako "maksymalnie skompresowany" i zachowany w pierwotnej formie, nie przesyłasz większego pliku i nie tracisz limitu darmowego.
- Można cofnąć. Oryginał domyślnie trafia do kosza, kliknij prawym przyciskiem myszy "przywróć" dla wybranego pliku.
- Pełna lokalna obsługa, pliki nie są wysyłane na żaden serwer.
👉 Pobierz ImgZilla w Mac App Store
Inne platformy: Caesium lub TinyPNG
- Caesium Image Compressor: darmowy i otwarty, działa na Windows, macOS, Linux, obsługuje masową kompresję WebP, można ustawić jakość i zachowanie metadanych.
- TinyPNG: narzędzie online, również obsługuje WebP. Po prostu wypuszczaj pliki, ale darmowa wersja ma ograniczenia liczby i rozmiaru, obrazy są przesyłane na ich serwer.
Scenariusz 3: Animowany WebP
Dwa typy potrzeb:
Przekonwertuj GIF na animowany WebP: użyj oficjalnego Google gif2webp (dostępne w pakiecie narzędzi libwebp, na Mac brew install webp). Taka sama animacja, animowany WebP zazwyczaj jest znacznie mniejszy niż GIF.
bash
gif2webp -q 75 -m 6 input.gif -o output.webp
Masz już animowany WebP i chcesz go lekko skompresować: wiele narzędzi w przypadku animacji zgłasza błąd lub zachowuje tylko pierwszą klatkę. ImgZilla obsługuje ponowną kompresję animowanego WebP – ponownie koduje klatka po klatce, zachowując liczbę klatek, czas trwania, liczbę pętli, rozmiar płótna, animacja pozostaje taka sama, plik tylko mniejszy. Jak z obrazami statycznymi, jeśli nie da się skompresować, jest oznaczony jako "maksymalnie skompresowany" i zachowany.
Scenariusz 4: Konieczne zachowanie pikseli
UI, zrzuty ekranu, materiały do dalszego edytowania – w takich przypadkach potrzebujesz trybu bezstratnego.
Użyj cwebp:
bash
Czysto bezstratny
cwebp -lossless -z 9 input.png -o output.webp
Prawie bezstratny: minimalne zmiany pikseli, znacznie mniejszy rozmiar niż czysty bezstratny, odpowiedni do zrzutów ekranu i UI
cwebp -near_lossless 60 input.png -o output.webp
Uwaga: ImgZilla dla WebP używa kodowania zniekształconego, nawet jeśli plik był bezstratny. Rozmiar zazwyczaj drastycznie się zmniejsza, piksele nie są już dokładnie takie same. Ponadto usuwa metadane (w tym profile kolorów) z WebP. Dla zwykłych obrazów sRGB nie ma wpływu, dla obrazów z szerokim gamutem (np. Display P3) kolory mogą się nieco różnić w oprogramowaniu do zarządzania kolorami. Jeśli masz rygorystyczne wymagania co do pikseli i kolorów, użyj cwebp lub wydziel te pliki przed kompresją.
Podsumowanie w tabeli
| Co chcesz zrobić | Rekomendacja | Alternatywa |
|---|---|---|
| Przekonwertuj JPG / PNG na WebP | XnConvert | cwebp, sharp (proces budowania) |
| Sprawdź parametry, pojedyncze pliki | Squoosh | — |
| Skompresuj już istniejący WebP (Mac) | ImgZilla | Caesium |
| Skompresuj już istniejący WebP (Windows / Linux) | Caesium | TinyPNG |
| GIF na animowany WebP | gif2webp | — |
| Skompresuj już istniejący animowany WebP | ImgZilla | własne skrypty używające libwebp |
| Konieczne zachowanie pikseli | cwebp -lossless / -near_lossless |
— |
Linki do pobrania
| Narzędzie | Platforma | Cena | Pobierz |
|---|---|---|---|
| ImgZilla | macOS 12.3+ | Darmowy: 10 plików dziennie | Mac App Store |
| XnConvert | Windows / macOS / Linux | Osobisty darmowy | xnview.com |
| Caesium Image Compressor | Windows / macOS / Linux | Darmowy i otwarty | saerasoft.com |
| cwebp / gif2webp / webpinfo | Wiersz poleceń | Darmowy i otwarty | Google oficjalny pobierz, Mac: brew install webp |
| sharp | Node.js | Darmowy i otwarty | sharp.pixelplumbing.com, npm install sharp |
| Squoosh | Web | Darmowy | squoosh.app |
| TinyPNG | Web | Darmowy z limitem | tinypng.com |
Na koniec
WebP sam w sobie jest już bardzo wydajnym formatem. Jeśli Twój WebP został wygenerowany przez CDN lub narzędzie budowania z rozsądnymi parametrami, dalsza kompresja może nie przynieść dużych oszczędności, oznaczenie jako "maksymalnie skompresowany" jest normalne; największe oszczędności zazwyczaj dają pliki wyeksportowane z wysoką jakością, przekonwertowane bezstratnie z PNG lub bez dodatkowej obróbki z GIF.
Najpierw użyj webpinfo, aby zobaczyć, jaki typ masz, a następnie wybierz narzędzie na podstawie scenariusza – będzie znacznie szybciej niż próbowanie wielu narzędzi.
ImgZilla obecnie wspiera tylko macOS (12.3 i nowsze), dostępne w Mac App Store. Darmowa wersja dziennie pozwala skompresować 10 plików, limit liczy się tylko przy sukcesie – wypuszczaj pełne foldery WebP i zobacz, ile możesz oszczędzić.