PNG czy JPG? Zasada sprzed dekady, którą decyduję

PNG i JPG są dwiema domyślnymi odpowiedziami na „zapisz ten obraz” od ponad dwudziestu lat, a większość ludzi wybiera między nimi przypadkiem — zależnie od tego, co podpowiedziało okno eksportu. Działa to do dnia, w którym wyślesz komuś mailem zrzut ekranu na 9 MB albo wypuścisz logo z brzydką szarą obwódką, i nagle wybór zaczyna mieć znaczenie.

Rzecz w tym, że ta decyzja jest naprawdę prosta. Sprowadza się do jednego pytania, które zadaję od jakichś dziesięciu lat, i ani razu mnie nie zawiodło.

To jedno pytanie

Czy ten obraz jest zrobiony z krawędzi, czy ze światła?

Tyle. Tekst, logotypy, ikony, zrzuty ekranu, diagramy, grafika liniowa, cokolwiek z twardymi granicami i płaskimi obszarami koloru — to krawędzie. Fotografie, gradienty, cokolwiek z gładkim ciągłym tonem i tysiącami subtelnych przejść koloru — to światło.

Krawędzie chcą PNG. Światło chce JPG. Prawie wszystko wynika stąd samo.

Dlaczego krawędzie chcą PNG

PNG jest bezstratny. Każdy zapisany piksel wraca dokładnie taki sam, na zawsze, niezależnie od tego, ile razy plik otworzysz na nowo. Kompresuje, wyszukując ciągi identycznego koloru, a właśnie tego obrazy krawędziowe są pełne — jednolity przycisk, białe tło, czarna linia. PNG pochłania to bez trudu i pozostaje ostry jak brzytwa.

Ma też kanał alfa, więc potrafi być naprawdę przezroczysty. Dlatego każde logo, które chcesz położyć na kolorowym tle, powinno być PNG. JPG nie ma przezroczystości w ogóle — wypełnia takie obszary bielą, i stąd bierze się brzydka obwódka.

Trybem porażki są fotografie. Zapisz zdjęcie jako PNG, a on posłusznie odnotuje każde ziarno szumu matrycy i każdy mikrogradient z pełną wiernością, a plik puchnie. PNG nie jest rozrzutny dlatego, że jest zły. Jest rozrzutny, bo jest uczciwy wobec detali, które oko chętnie by wybaczyło.

Dlaczego światło chce JPG

JPG jest stratny. Wyrzuca informacje, które oku trudno zauważyć — drobne wariacje koloru, detal o wysokiej częstotliwości — i robi to na fotografiach zadziwiająco dobrze. Bo właśnie tego zdjęcie ma w nadmiarze. Wynikiem jest plik ułamka rozmiaru, a nie widać, czego brakuje.

Wyceluj JPG w krawędzie, a rozsypuje się. Rozmazuje mętne artefakty wokół twardych granic — szczególnie wokół tekstu — bo ostre krawędzie to dokładnie ten detal o wysokiej częstotliwości, który ma odrzucać. Zrzut ekranu z kodem zapisany jako JPG wygląda lekko brudno wokół każdej litery. To nie Twój monitor. To format działający zgodnie z projektem na złym wejściu.

Tabela rozmiarów, która to rozstrzyga

Te same dwa obrazy źródłowe, zapisane na oba sposoby przy rozsądnych ustawieniach:

Czytaj to w obie strony. Zdjęcie jest jako JPG prawie 5x mniejsze, bez widocznej straty. Ale zrzut i logo są jako JPG większe — i wyglądałyby gorzej, z obwódkami i mętnością. To, który format jest mniejszy, odwraca się całkowicie w zależności od tego, co jest na obrazie. Cała lekcja w trzech wierszach.

Przypadki brzegowe (są tylko dwa warte znajomości)

Przezroczystość wymusza PNG. Jeśli jakakolwiek część obrazu ma być prześwitująca, JPG odpada niezależnie od treści, bo fizycznie nie potrafi przechować kanału alfa. Nawet zdjęcie wycięte na przezroczystym tle musi być PNG (albo WebP).

Tekst na zdjęciu to kwestia oceny. Zdjęcie z wtopionym podpisem jest po części światłem, po części krawędzią. Idę w JPG, jeśli to głównie zdjęcie, i godzę się na lekko miękki tekst, albo w PNG, jeśli tekst musi zostać ostry, a stać mnie na rozmiar. Nie ma czystego zwycięzcy; wybierasz, którą wadę wolisz mieć.

Kiedy już masz ten niewłaściwy

Przez większość czasu nie wybierasz przy eksporcie — utknąłeś z plikiem, który ktoś już zapisał źle. Fotograf wręczył Ci PNG-i na 14 MB. Projektant przysłał logo jako JPG z obwódką. To po prostu konwersja.

Pójście w mądrą stronę — PNG na JPG dla zdjęcia zapisanego zbyt ciężko — to jasna wygrana, i działa tu wprost w Twojej przeglądarce, więc plik nie opuszcza urządzenia. Pójście w drugą stronę — JPG na PNG — jest uczciwe, ale ograniczone: robi plik bezstratnym od tej chwili, czego chcesz przed edycją, ale nie rozmaże z powrotem artefaktów, które JPG już wpiekł. Stratność to drzwi w jedną stronę. Konwersja na PNG nie przeprowadza Cię przez nie z powrotem; jedynie powstrzymuje dalszą stratę.

Zadaj to jedno pytanie — krawędzie czy światło — a trafisz praktycznie za każdym razem. Sam zadaję je przy każdym eksporcie. Zajmuje pół sekundy i uratowało mnie przed niejedną szarą obwódką.