Jeśli kiedykolwiek nałożyłeś logo na kolorowe tło i zobaczyłeś wokół niego brzydki biały prostokąt, winny był format pliku. PNG powstał między innymi po to, żeby rozwiązać ten problem. To domyślny wybór dla każdej grafiki, która potrzebuje przezroczystego tła albo nie może stracić jakości przy zapisie.
Co oznacza skrót PNG?
PNG to skrót od Portable Network Graphics , czyli „przenośna grafika sieciowa”. Format powstał w 1995 roku jako otwarta i wolna od opłat licencyjnych alternatywa dla GIF-a i szybko stał się jednym z najpopularniejszych formatów w sieci. W przeciwieństwie do JPG korzysta z kompresji bezstratnej (lossless), co oznacza, że przy zapisie pliku żadna informacja o pikselach nie jest odrzucana.
Jak działa PNG?
PNG korzysta z algorytmu kompresji o nazwie DEFLATE — tego samego, który napędza archiwa ZIP — w połączeniu z filtrami predykcji pikseli. Algorytm szuka w obrazie powtarzających się wzorców i zapisuje je oszczędniej, nie usuwając przy tym żadnych oryginalnych danych.
Dzięki temu PNG zapisany i otwarty dziesięć razy jest identyczny z oryginałem, piksel po pikselu. To czyni go idealnym wszędzie tam, gdzie wierność obrazu ma znaczenie: przy zrzutach ekranu, logo i grafikach edytowanych wielokrotnie.
PNG obsługuje też specjalny kanał zwany kanałem alfa, który steruje przezroczystością każdego piksela z osobna. Piksel może być całkowicie kryjący, całkowicie przezroczysty albo półprzezroczysty w dowolnym stopniu — stąd wygładzone krawędzie i cienie z prawdziwą przezroczystością.
Jakie są zalety PNG?
- Przezroczystość z kanałem alfa: pełna obsługa przezroczystości, łącznie z półprzezroczystością i wygładzonymi krawędziami. To jedyny powszechnie obsługiwany format, który pozwala położyć grafikę na dowolnym tle bez białego prostokąta.
- Kompresja bezstratna: pierwotna jakość zostaje w całości zachowana, niezależnie od tego, ile razy plik zapiszesz i otworzysz.
- Idealny do tekstu i ostrej grafiki: proste krawędzie, litery i jednolite płaszczyzny koloru wychodzą w PNG idealnie ostro, bez artefaktów kompresji znanych z JPG.
- Pełna zgodność: obsługiwany przez wszystkie przeglądarki, systemy operacyjne i programy graficzne.
- Duża głębia kolorów: PNG obsługuje obrazy 8-bitowe (256 kolorów), 24-bitowe (16,7 miliona kolorów), a w zastosowaniach profesjonalnych nawet 48-bitowe.
Jakie są ograniczenia PNG?
- Ciężkie pliki przy zdjęciach: kompresja bezstratna radzi sobie z fotografią gorzej niż stratna kompresja JPG. Zdjęcie w PNG bywa 5–10 razy cięższe niż to samo zdjęcie w JPG o porównywalnej jakości wizualnej.
- Brak animacji: PNG to format statyczny. Do animacji z przezroczystością można sięgnąć po WebP lub APNG (animowany PNG), ale ich obsługa jest bardziej ograniczona.
- Kiepski do zdjęć na stronach: używanie PNG do fotografii na stronie potrafi mocno spowolnić jej ładowanie. Do zdjęć zawsze lepszy będzie JPG albo WebP.
💡 Zasada w praktyce: wybieraj PNG, gdy grafika ma przezroczyste tło oraz przy logo, ikonach, zrzutach ekranu i wszystkim, co zawiera tekst i ostre krawędzie. Do zdjęć na stronie sięgaj po JPG lub WebP — są dużo lżejsze, a różnicy i tak nie widać.
PNG-8 a PNG-24 — czym się różnią?
| Cecha | PNG-8 | PNG-24 |
|---|---|---|
| Liczba kolorów | Do 256 kolorów | Do 16,7 miliona kolorów |
| Przezroczystość | Binarna (piksel jest albo nie jest widoczny) | Pełny kanał alfa (256 poziomów) |
| Wielkość pliku | Mniejsza | Większa |
| Idealny do | prostych ikon i grafik o niewielu kolorach | logo i grafik z półprzezroczystością |
W większości dzisiejszych zastosowań — zwłaszcza przy logo i grafikach z wygładzonymi krawędziami — najlepiej sprawdza się PNG-24 , bo zapewnia pełną przezroczystość na dowolnym poziomie krycia.
Kiedy używać PNG?
Sięgnij po PNG w tych sytuacjach:
- Logo i identyfikacja wizualna: gdy logo ma trafiać na tła w różnych kolorach bez białego prostokąta wokół.
- Zrzuty ekranu: interfejsy, pulpity i ekrany systemowe zachowują w PNG idealnie czytelny tekst.
- Ikony i elementy interfejsu: przyciski, ilustracje i elementy UI, które potrzebują czystych krawędzi.
- Grafiki do dalszej edycji: gdy plik będzie wielokrotnie otwierany, poprawiany i zapisywany, PNG chroni przed narastającą utratą jakości typową dla JPG.
- Infografiki z tekstem: wykresy i grafiki łączące tekst z elementami wizualnymi są w PNG znacznie ostrzejsze.
PNG, JPG i WebP — pełne porównanie
| Cecha | PNG | JPG | WebP |
|---|---|---|---|
| Kompresja | Bezstratna (lossless) | Stratna (lossy) | Obie |
| Przezroczystość | Tak (kanał alfa) | Nie | Tak |
| Idealny do zdjęć | Nie | Tak | Tak |
| Idealny do logo i ikon | Tak | Nie | Tak |
| Waga przy zdjęciach | Bardzo duża | Mała | Bardzo mała |
| Waga przy logo | Mała lub średnia | Średnia (z artefaktami) | Mała |
| Powszechna obsługa | Tak | Tak | Nowoczesne przeglądarki |
Jak zmniejszyć wagę plików PNG?
Choć PNG jest formatem bezstratnym, jego wagę da się wyraźnie zmniejszyć. Pomaga obniżenie głębi kolorów (z PNG-24 na PNG-8, gdy obraz używa niewielu barw), usunięcie zbędnych metadanych i zastosowanie wydajniejszych algorytmów kompresji, takich jak te w narzędziu Kompresja obrazu. W wielu przypadkach pozwala to zejść z wagą pliku o 30–50% bez żadnej widocznej straty.
Skompresuj pliki PNG bez utraty jakości
Zmniejsz wagę plików PNG, zachowując przezroczystość i pierwotną ostrość. Za darmo, prosto w przeglądarce.
Skompresuj obrazy PNG