Denně si většina z nás prohlíží velkou spoustu elektronických obrázků, aniž bychom si to uvědomovali. Různá pozadí či loga na webových stránkách, ikony v operačním systému nebo dokonce reklamní bannery. To vše jsou obrázky, které mají upoutat naši pozornost, ale už jsou pro nás takovou samozřejmostí, že je jen letmo přecházíme.

Avšak každý z těchto obrázků, ať je malý, velký, barevný, černobílý, ať se vám líbí nebo ne, je složen pouze z digitálních jedniček a nul, které jsou za sebou poskládány tak, aby je prohlížeče dokázali vykreslit do finální podoby, v jaké je vidíme my. Ale ne všechny obrázky mají uspořádání jednotlivých bitů dáno stejně. Od toho jsou tady formáty obrázků, které udávají, která jednička či nula co znamená, co udává a na kterém místě v souboru bude zapsána.

Počítačové obrázky se dají rozdělit do dvou tříd. První z nich je rastrová, kdy je obrázek poskládán z jednotlivých pixelů. Druhá je vektorová, kdy je obrázek poskládán z grafických primitiv, jaké jsou body, křivky nebo tvary, které jsou zadány pomocí matematických rovnic. V tomto článku se budeme zabývat především tou první, rastrovou.

 <p> </p>

Rozdíl mezi vektorovou a rastrovou grafikou po přiblížení. Nahoře vektorová a dole rastrová.

Pixel

Každý obrázek je poskládán z jednotlivých pixelů. Pixel je jeden malý většinou čtvereček, který má určitou pozici a barvu, popřípadě ještě průhlednost. Jednotlivé pixely jsou poskládány do 2D mřížky, která reprezentuje obrázek.

Pomocí počtu pixelů se často udává velikost obrázku, například 1024x768 znamená, že obrázek má 1024 pixelů na šířku a 768 pixelů na výšku. Pokud byste se snažili tento obrázek zobrazit třeba jako pozadí ve Windows, když je vaše rozlišení menší než velikost obrázku, pak je vše v pořádku. Pokud byste však měli rozlišení větší, pak by se musel jeden pixel vejít na více bodů na obrazovce (roztáhnout se) a to už vypadá jako čtverečkované pozadí, což nevypadá zrovna nejlíp.

 <p> </p>

Ukázka přiblížení a zobrazení jednotlivých pixelů (čtverečků) v obrázku.

Barvy a průhlednost

Jedním z hlavních rozdílů, které udávají kvalitu a využití daného formátu, je počet barevných bitů, které může každý pixel mít. Když si vezmeme, že by jeden pixel měl třeba jen jeden bit na vyjádření barvy, jaká na něm je, pak může být buďto například černá a bílá nebo červená a modrá nebo jakákoliv jiná kombinace dvou barev. Jeden bit může vyjádřit totiž jen jednu jedničku nebo nulu, což znamená dva stavy, čili dvě barvy. Pokud by měl dva bity, pak jsou možné 4 barvy (nebo 4 odstíny jedné barvy). Pokud má 8 bitů, pak je to dva na osmou, což je 256 barev. Pokud má 24 bitů, pak je to přes 16 miliónů barev, neboli 256 úrovní každé základní barevné složky - RGB (red, green, blue = červená, zelená, modrá).

A právě pomocí RGB se většinou udává barevnost každého pixelu (dalším známým barevným modelem je například CMYK). Avšak u některých formátů může být zastoupen ještě tak zvaný alfa kanál, což je průhlednost. Jeho rozsah je nejčastěji buď to jednobitový (pixel je průhledný zcela nebo vůbec) nebo má 256 úrovní průhlednosti (8 bitů).

 <p> </p>

RGB barevný model, kdy 0% od každé složky znamená černou barvu, a 100% každé složky dohromady tvoří bílou.

GIF

Jeden z nejznámějších obrázkových formátů. Zřejmě jeho největší předností je možnost zobrazovat animace, které jsou poskládány z více obrázků jdoucích za sebou. Dále také dokáže ukládat jednobitovou průhlednost, což se často používá pro loga, jež musí mít průhledné okolí.

Tento formát má však pouze 8bitové zastoupení barev, což znamená 256 možných barev. To je v dnešní době velmi málo. Proto se také nehodí například pro fotografie, kde je většinou spousta nejrůznějších barev, ale používá se především pro loga, diagramy a grafy, které mají menší počet barev, ale využívají zase jeho průhlednosti a toho, že formát není kompresní a proto zachová spolehlivě každý detail.

 <p> </p>

Ukázka animace v GIF obrázku.

JPG/JPEG

Tento formát již podporuje 24bitové barvy, což znamená 8 bitů (256 odstínů) pro každou základní barvu. Toto množství barev se označuje jako TrueColor. JPEG je navíc velmi malý formát díky kompresi, která však na druhou stranu způsobuje ztrátu kvality, která se už nedá nikdy vrátit zpět. Pokud tedy chcete nějaký obrázek vícekrát upravovat a ukládat, pak doporučuji nepoužívat tento formát.

Při kompresi totiž dochází k zásahům do jednotlivých barevných složek pixelů. Tím pádem můžete přijít o nejrůznější detaily v obrázku, které jsou tak malé, že se při kompresi ztratí. Také dochází k rozostřování barevných přechodů, takže ztrácíte i ostrost přechodu z jedné barvy do druhé. To znamená, že pokud máte například černé pozadí a na něm něco napsáno ostře bílým písmem, pak dochází k postupnému prolínání černé a bílé při každém novém uložení a na krajích písmen se tak objevují šedé oblasti, které v prvotní verzi nebyly.

Samozřejmě, že kvalita se nezhoršuje jen každým uložením, ale můžete si úroveň komprese u většiny obrázkových editorů nastavit i sami. Čím menší kvalita, tím také menší velikost výsledného obrázku, což se mnohdy hodí pro úspory místa na disku, pokud se jedná o velké množství obrázků, které chcete uložit. Také proto se většinou využívá pro fotografie. Druhý důvod je pak široké rozmezí barev.

 <p> </p><p> </p><p> </p>

Ukázka ztrátové komprese JPEG formátu pro (zleva) 100% kvality, 10% kvality a 1% kvality.

PNG

Byl vytvořen jako náhrada za formát GIF v letech, kdy byl GIF licencován (zpoplatněn). PNG tedy stejně jako GIF umožňuje používat průhlednost, avšak oproti jeho předchůdci dokáže zastupovat až 256 úrovní průhlednosti. Při překrytí jiné barvy pak dochází k míchání barev a spodní barva je zabarvena do barvy průhledné horní vrstvy.

Navíc se jedná opět o kompresní formát, který tedy zmenšuje velikost souboru, ale oproti JPEG zachovává veškeré detaily - není ztrátový.

Jeho barevný rozsah je různý. Dokáže totiž ukládat barvy v rozsahu 1-24 bitů na pixel. To znamená, že obrázek může být různě velký podle počtu barev, které se na něm vyskytují.

 <p> </p>

Průhlednost PNG formátu (zde nasimulováno pozadí šachovnice). Všimněte si i průhlednosti jednotlivých kostek.

MNG

Jedná se více méně o rozšíření PNG formátu, kdy MNG podporuje také animace, které si PNG z GIFu nepřevzal. Později se však animace začínaly používat víc a víc a proto byl vytvořen nový formát s podporou animací - MNG.


TIF/TIFF

Opět se jedná o kompresní formát, který umožňuje kompresi jak ztrátovou tak také bezeztrátovou. Pro jeden barevný kanál (červený, zelený a modrý) používá buďto 8 nebo 16 bitů, což ve výsledku dává 24 nebo dokonce 48 bitů celkem pro barvu jednoho pixelu.

Navíc může TIFF sloužit jako kontejner, do kterého lze uložit například JPEG obrázek s kompresí nebo dokonce vektorovou grafiku.

A proč se tedy tak skvělý formát nepoužívá všude? Protože po jeho uveřejnění bylo umožněno vytvářet nové tagy pro tento formát komukoliv, kdy při uložení byl do souboru zapsán i onen nový tag. Avšak je zřejmé, že žádný prohlížeč nemohl zvládnout každý nový tag a tak se TIFF neujal díky jeho nekompatibilitě a nemožnosti zobrazit jakýkoliv obrázek uložený v tomto formátu.

 

BMP

V tomto případě se jedná o formát, který je podporován pouze u operačních systémů Microsoft Windows a OS/2.

Velkou nevýhodou tohoto formátu je však nulová komprese a proto také zbytečná velikost souboru.

BMP umožňuje ukládat barvy v pixelu do 1-32 bitového rozsahu, kdy 32 bitů znamená, že obrázek má 8 bitů pro každý kanál RGB a 8 bitů pro průhlednost, což je tedy 256 stupňů průhlednosti. V jiném případě může být v jednom pixelu uloženo 24 bitů pro barvy a v druhém souboru je pak stejná mřížka pixelů, která obsahuje 8 bitové údaje o průhlednosti.

 <p> </p>

Pouhá vizuální představa BMP a TIFF formátů.

Závěr

Jistě každý formát si najde své uplatnění a své zastánce. Ale rozhodně nemá cenu ukládat fotky do GIFu a černobílá schémata zase do JPEG, kdy potřebujeme zachovat přesné detaily čar a symbolů.

Avšak ani zde popsané formáty nejsou kompletním seznamem dnes používaných. Existují jich stovky. Také vektorová grafika se začíná pomalu rozšiřovat a zabírat své místo jak na internetu, tak také na pevných discích mnoha uživatelů.

Zdroj některých obrázků: Wikipedia.org