Informatyka · Grafika komputerowa

Format i kompresja — mniej bajtów, ale jakim kosztem?

Obraz na stronie ma się szybko wczytać, ale mały napis nadal musi być czytelny. Sprawdzimy realne pliki, zamiast zgadywać po suwaku jakości.

  • Zobacz mechanizm
  • Wykonaj w programie
  • Sprawdź własny wynik

Po tej lekcji: Porównasz wymiary, jakość i wielkość eksportu oraz rozróżnisz kompresję stratną i bezstratną.

Zakres podstawowy · materiał otwarty

Co wolno wyrzucić?

Kompresja bezstratna pozwala odtworzyć zapisane dane bez zmian. Stratna poświęca część informacji, aby ograniczyć rozmiar. To nie to samo co zmniejszenie wymiarów: mniejszy obraz ma mniej pikseli niezależnie od sposobu kompresji. Format i ustawienia eksportu dobieramy do odbiorcy.

Sprawdź w działaniu

Porównaj prawdziwe kodowanie obrazu

Najpierw zostaw szerokość bez zmian i obniż jakość. Potem przy tej samej jakości zmniejsz wymiary. Odczytaj wielkości rzeczywistych plików.

Ta interakcja wymaga włączonego JavaScriptu.

Format to zestaw możliwości

ZapisZastosowanieOgraniczenie
PNGOstre linie, tekst, alfa, kompresja bezstratnaZdjęcie może zajmować dużo miejsca
JPEGFotografie, regulowana kompresja stratnaArtefakty wokół krawędzi; brak standardowej alfy
WebPObrazy dla WWW, tryb stratny lub bezstratny, alfaSprawdź obsługę w docelowym programie
SVGKształty i krzyweTo nie format kompresji fotografii
ZIPArchiwum plikówJPEG jest już skompresowany, więc ZIP może niewiele pomóc

Zrób uczciwe porównanie

  1. Otwórz własną fotografię w GIMP. Zachowaj kopię źródła.
    Oczekiwany wynikWszystkie warianty zaczną od tych samych danych.
  2. Wyeksportuj PNG oraz dwa JPEG o tych samych wymiarach, np. jakość 90 i 30.
    Oczekiwany wynikPorównujesz kompresję bez zmiany liczby pikseli.
  3. Otwórz każdy wynik ponownie. Obejrzyj ten sam detal przy powiększeniu 100% i większym.
    Oczekiwany wynikWidać różnice w krawędziach, gładkich przejściach i napisach.
  4. W systemowym oknie właściwości odczytaj rozmiar w bajtach i wymiary w pikselach. Zapisz tabelę porównawczą.
    Oczekiwany wynikNie porównuj wyłącznie wielkości wyświetlanych jako zaokrąglone MB.
  5. Wybierz wariant do strony i uzasadnij decyzję. Nie nadpisuj oryginału kolejnymi JPEG.
    Oczekiwany wynikKażdy kolejny stratny zapis może dokładać zniekształcenia.

To dotyczy także dźwięku i filmu

WAV często przechowuje nieskompresowane próbki PCM, MP3 używa kompresji stratnej. FLAC kompresuje dźwięk bezstratnie. Wideo ma osobno kontener (np. MP4) oraz kodek obrazu (np. H.264). Nie wnioskuj o wszystkich parametrach pliku tylko z rozszerzenia. Kompresja dynamiki audio zmienia relacje głośności — to inne znaczenie słowa „kompresja”.

RLE — kompresja serii jednakowych znaków

W zadaniach biurka zakodujesz serie. Seria to kolejne wystąpienia tego samego znaku: AAABBBA ma trzy serie, nie dwie, bo ostatnie A nie sąsiaduje z pierwszymi. W przyjętym tu zapisie podajemy znak i licznik: A3B3A1. To bezstratny model: można odtworzyć dokładny tekst. Dla danych bez powtórzeń zapis może być dłuższy niż oryginał. Przy znakach będących cyframi trzeba osobno ustalić jednoznaczny format; zadania definiują własny alfabet.

Zamknij serię po zmianie znaku

PYTHONpython
tekst = "AAABBBA"
wynik = []
if tekst:
    znak = tekst[0]
    ile = 1
    for kolejny in tekst[1:]:
        if kolejny == znak:
            ile += 1
        else:
            wynik.append(znak + str(ile))
            znak = kolejny
            ile = 1
    wynik.append(znak + str(ile))
print("".join(wynik))
Wynik
A3B3A1
  1. Po pętli Dopisujemy ostatnią serię — nie pojawi się już kolejny znak, który ją zamknie.
  2. Sprawdź Dla pustego tekstu wynik jest pusty, dla A wynik to A1, dla AB wynik to A1B1.

Ćwiczenie z pomocą · samodzielna praca

Detal i masa

Wyeksportuj jeden obraz w trzech ustawieniach. Porównaj te same wymiary i fragment.

Oczekiwany rezultat
Tabela: format, ustawienie, wymiary, bajty, obserwacja.
Potrzebujesz pomocy? Rozwiązuj krok po kroku.
Krok 1 — pokaż podpowiedź

Zmieniaj jeden parametr naraz.

Krok 2 — pokaż podpowiedź

Porównuj ponownie otwarte wyniki, nie sam podgląd eksportu.

Otwórz tylko tyle podpowiedzi, ile potrzebujesz. Po każdym kroku wróć do zadania i sprawdź wynik.

Ćwiczenie z pomocą · samodzielna praca

Przezroczyste tło

Sprawdź zapis prostego znaku z przezroczystością w PNG i JPEG.

Oczekiwany rezultat
Wyjaśnij rezultat, nie tylko nazwę pliku.
Potrzebujesz pomocy? Rozwiązuj krok po kroku.
Krok 1 — pokaż podpowiedź

JPEG nie zachowa alfy.

Krok 2 — pokaż podpowiedź

Wyświetl oba pliki na kolorowym tle.

Otwórz tylko tyle podpowiedzi, ile potrzebujesz. Po każdym kroku wróć do zadania i sprawdź wynik.

Podsumowanie

Co warto zapamiętać

  1. Porównasz wymiary, jakość i wielkość eksportu oraz rozróżnisz kompresję stratną i bezstratną.
  2. Otwórz zapisany wynik w programie odbiorcy. Sprawdź, czy działa bez Twojej pomocy.
  3. Wskaż jedną decyzję w swojej pracy i wyjaśnij jej skutek.

Po zalogowaniu zobaczysz dodatkowe lekcje i materiały oznaczone jako rozszerzenie. Podstawowe quizy i zadania pozostają dostępne w biurku.

Dalej na swoim koncie

Rozgrzewki, quiz i zadania są w biurku ucznia.

Teoria jest otwarta dla wszystkich. Żeby rozwiązywać zadania, zapisywać szkice i widzieć swój postęp, zaloguj się.

Zaloguj się →
Źródła i dalsza nauka