5 zasad wyboru formatu pliku dla ikony, zdjęcia i wykresu
Zacznij od powiększenia newralgicznych miejsc – np. w edytorze grafiki ustaw widok na 400–800%. Jeśli widzisz rozmyte, poszarpane lub „wyprane" kontury, to znak, że kompresja była za silna. W przypadku plików JPEG sprawdź, czy nie są zapisane z jakością poniżej 80. Dla grafiki z tekstem lub cienkimi liniami użyj formatów bezstratnych: PNG lub WebP w trybie bezstratnym. Jeśli musisz użyć JPEG, zapisz obraz z maksymalną jakością (95–100) i nie otwieraj go ponownie do edycji – pracuj na pliku źródłowym (np. PSD, TIFF) i eksportuj dopiero na końcu.<br>
<br>
<br>
<br>
Przy pracy z przezroczystością i krawędziami na jednolitym tle wybierz PNG lub format, który obsługuje kanał alfa bez kompresji stratnej. W GIF krawędzie mogą być ząbkowane z powodu ograniczonej palety, a w WebP jakość ustawia się podobnie jak w JPEG — sprawdź podgląd przed eksportem. Nie zakładaj, że nowszy format automatycznie rozwiązuje problem; liczy się ustawienie jakości i sposób próbkowania koloru. Zawsze porównuj fragment z krawędzią na neutralnym tle, najlepiej na powiększeniu, i dopiero wtedy decyduj o zapisie.<br>
<br>
<br>
<br>
Zasada praktyczna jest jedna: najpierw pytasz, czy dany fragment ma sens samodzielnie, poza kontekstem. Jeśli tak — to . Jeśli nie, a jedynie grupuje treść wokół wspólnego tematu — to . Kolejność zagnieżdżenia wynika z tej odpowiedzi, a nie z tego, który znacznik jest „ważniejszy".<br>
<br>
<br>
<br>
Pierwszy krok to ustalenie, czy artefakty powstały przy zapisie, czy przy ponownej kompresji. Otwórz plik w programie, który pokazuje mapę jakości, i sprawdź, czy problem występuje na całym obrazie, czy tylko wokół kontrastowych elementów. Jeśli wokół krawędzi pojawiają się kolorowe plamy, to typowy objaw próbkowania chromatyczności. W większości edytorów znajdziesz opcję „podpróbkowanie koloru" — ustaw ją na 4:4:4 zamiast 4:2:0. To zatrzymuje pełną informację o barwie i mocno ogranicza kolorowe obwódki.<br>
<br>
<br>
<br>
Bez znacznika meta viewport w sekcji head telefon zakłada, że strona ma szerokość około 980 pikseli. Efekt? Przeglądarka oddala całą witrynę, żeby zmieściła się na ekranie. Użytkownik widzi miniature, w którą musi celować palcem i powiększać, żeby cokolwiek przeczytać. Wystarczy jedna linia kodu, żeby to zmienić.<br>
<br>
<br>
<br>
Uważaj też na sytuację odwrotną: w . Jest poprawna, gdy tematy naprawdę się rozdzielają, ale gdy tworzysz kilka poziomów tylko po to, by dopasować się do wyglądu, lepszym rozwiązaniem jest . Pamiętaj, że znaczniki niosą informację dla czytników ekranu i robotów indeksujących; nadmiar sekcji bez nagłówków tę informację zaburza.<br>
<br>
<br>
<br>
Jak zmniejszyć widoczność artefaktów bez utraty jakości Regulacja jakości to nie jedyne pokrętło. Warto zwiększyć rozdzielczość zapisu, jeśli obraz i tak będzie wyświetlany mniejszy. Kompresja stratna działa na pikselach, więc zapisanie większej liczby pikseli przy tej samej jakości często daje lepszy wynik po zmniejszeniu. Drugi sposób to zapis w formacie bezstratnym, np. PNG, gdy obraz zawiera ostre krawędzie, tekst lub cienkie linie. Jeśli musisz użyć JPEG, ustaw jakość na 85–95 i sprawdź podgląd przy powiększeniu 200–400%. Nie kieruj się rozmiarem pliku jako jedynym kryterium — liczy się to, co widać na krawędziach.<br>
<br>
<br>
<br>
Typowe błędy to zapisywanie tego samego pliku wielokrotnie w JPEG oraz edycja i ponowny zapis bez potrzeby. Każdy cykl kompresji pogłębia artefakty, nawet jeśli za każdym razem ustawiasz wysoką jakość. Drugi częsty błąd to wyostrzanie obrazu po kompresji — maska wyostrzająca wzmacnia istniejące „schodki" i kolorowe obwódki. Jeśli musisz wyostrzyć, zrób to przed kompresją, delikatnie i na warstwie, a nie na gotowym pliku JPEG.<br>
<br>
<br>
<br>
Zacznij od pytania, czy obraz zawiera dużo kolorów przechodzących płynnie w siebie. Zdjęcia i fotorealistyczne renderowania niemal zawsze wymagają formatu z kompresją stratną, takiego jak JPEG. Ikony, schematy i wykresy składają się z ostrych krawędzi, jednolitych plam i cienkich linii — tu JPEG wypada źle, bo rozmywa kontury i tworzy szum wokół liter oraz osi. W takich przypadkach wybieraj formaty bezstratne: PNG dla grafiki z przezroczystością, a przy prostych ikonach jednokolorowych warto rozważyć SVG, czyli zapis wektorowy.<br>
<br>
<br>
<br>
Najczęstsze błędy to jeden format do wszystkiego, skalowanie rastrowego pliku w górę oraz zapominanie o przezroczystości i rozmiarze docelowym. Zanim zapiszesz plik, zadaj sobie trzy pytania: czy obraz ma być ostry przy powiększeniu, czy potrzebuje przezroczystego tła i czy zawiera dużo płynnych przejść tonalnych. Odpowiedzi wskażą format szybciej niż jakiekolwiek porównywanie parametrów w edytorze.<br>
<br>
<br>
<br>
Format pliku graficznego nie jest kwestią gustu, tylko funkcji, jaką obraz ma spełniać. Ikona w interfejsie, zdjęcie na stronie i wykres w raporcie mają inne wymagania: inaczej się je wyświetla, skalowaniu i kompresuje. Zły wybór kończy się rozmytymi krawędziami, ogromnym rozmiarem pliku albo nieczytelnymi opisami osi. Poniżej konkretne zasady, które pozwalają podjąć decyzję bez zgadywania.