Jobb képformátumok a webhelyéhez
A képek minden weboldal alapvető részét képezik. De a velük való együttműködés során figyelembe kell venni a minőség és a letöltési méret közötti szükséges egyensúlyt. A jó minőségű képekkel rendelkező webhely sok sávszélességet fog elfogyasztani, és lassan jelenik meg a böngészőkben, ami büntetheti a viselkedést: a felhasználók elhagyják a webhelyet, ha túl sokáig tart a megjelenítés.
Az interneten használt képformátumok
Ezért ismerni kell a weboldalon használható különféle képformátumokat, és tudni, hogy mikor válasszuk az egyiket vagy a másikat. A leggyakrabban használt formátumok három: JPG vagy JPEG, GIF Y PNG. Mindhárom a bitkép kép, vagyis egy képet úgy reprezentálnak, hogy az egyes pixelek színét és átlátszóságát kódolják, szemben a vektor formátumokkal (például SVG), amelyek vonalak, pontok és sokszögek tárolásával hozzák létre a képet.
A bitképformátumok nagy előnye, hogy lehetővé teszik az információk nagy tömörítését, ami könnyű fájlokat eredményez. Nagyítás közben azonban a kép torzulhat vagy elmosódhat, és megjelenítheti a képpontokat. Ezért gondot és tudást igénylő feladat annak ismerete, hogyan lehet optimalizálni a képeket úgy, hogy azok jó minőségűek és kis bájtúak legyenek.
A bittérképes kép nem más, mint a rács két pixelmérettel (magasság és szélesség). Például egy 200 x 200 képpontos képnek összesen 40 000 képpontja van, amelyek mindegyikének RGBA értéke lesz (piros, zöld, kék, alfa-csatorna vagy átlátszóság), és ezek az információk összesen 4 bájtot foglalnak el (32 bit) minden pixelre. Tehát egy 200 x 200 kép optimalizálás és tömörítés nélkül 160 000 bájt = 156 Kbyte méretű lesz. Könnyen beláthatja, hogy ez a méret túl nagy a webes szabványokhoz egy kis képen. Ezért képformátumokat használnak, amelyek tömörítik az információkat.
Ezután leírjuk a három képformátumot, majd sorozatot adunk arról, hogy mikor kell használni mindegyiket. Végül meglátjuk, hogyan optimalizálhatjuk a képeket olyan képszerkesztő szoftver segítségével, mint a Adobe photoshop vagy ZSINÓR.
JPG vagy JPEG (közös fényképészeti szakértői csoport)
A képek általában kiterjesztéssel rendelkeznek .jpg vagy .jpeg és manapság a leggyakrabban használt formátum. Veszteséges vagy veszteséges tömörítési algoritmus (amely nem teszi lehetővé az eredeti rekonstruálását a tömörített fájlból), amely azon a tényen alapul, hogy az emberi szem jobban megfogja a fényerő változását, mint a színváltozás, és hogy ezeket a változásokat jobban érzékeli homogén színű területek, mint a képen lévő objektumok szélein. Az alapjául szolgáló matematikai algoritmus eltávolít minden olyan információt, amely nem nélkülözhetetlen az emberi szem számára.
JPG Elvileg minden egyes pixelnek 24 bitet szán az információ tárolására, amellyel több mint 16 millió különböző színnel dolgozhat. De a megértés alkalmazásakor számos paramétert választhatunk az átalakítás vezérléséhez, mint például a kompresszió mértéke, százalékkal jelezve. Általános szabály, hogy 80% -a kiváló minőségű kép, 50% -a közepes és 10% -a alacsony minőségű. Az interneten általában 70 és 80% közötti értékekkel dolgozunk.
Ezenkívül a JPG lehetővé teszi képek mentését progresszív mód, más szóval, a kép több fázisban töltődik be, ami érdekes lehet lassú kapcsolatok esetén, bár valamivel nagyobb fájlokat állít elő. Az is lehetséges lágyítsa a képet a túl pixeles élek elkerülése érdekében, bár ez általában a teljes kép elmosódását okozza.
A JPG formátum Több ezer vagy millió színű képpel való munkához ajánlott: fényképek, színátmenetes képek. De nem alkalmas szöveges, egyszerű formájú vagy nagy egyszínű blokkokat tartalmazó képekhez, mert zajjal teli éleket generál. Ezenkívül egy JPEG-kép nem támogatja az átlátszóságot.
GIF (grafikus csereformátum)
Ez volt az első képformátum, amelyet az interneten használtak, mivel pontosan a számítógépes hálózatokon megosztandó képek tömörítésének módszerére gondolták. A képek kiterjesztéssel rendelkeznek .gif.
A JPEG-től eltérően a GIF a veszteségmentes tömörítési formátum, vagyis lehetővé teszi az eredeti rekonstrukcióját, mivel elmenti az egyes pixelek szín- és átlátszóságát, és nem torzítja a képet. Ez azonban csak 8 bittel működik minden egyes képpontnál, ami lehetővé teszi, hogy legyen csak 256 különböző színű. Ezzel a színkorlátozással szembesülve a GIF dithering módszerek sorozatát használja a GIF által elérhető korlátozott színpalettán belül nem létező színek szimulálására.
De a GIF rendelkezik olyan funkcióval, amely egyedivé teszi ezt a három képformátumot: lehet animálni. A GIF-nek több képe vagy képkocka lehet, amelyeket különböző időszakokban festenek, és szimulálnak egy videót. Ezért a weben jelenleg növekszik a használata. Lehetőség van előadásra is képek átlátszó háttérrel bár kissé korlátozott megvalósításban, mivel csak két értéke lehet: minden képpont átlátszó vagy átlátszatlan, mindegyikhez nem adhat meg átlátszósági értéket.