Avui intentaré explicar-vos d'una manera senzilla el tema dels formats d'imatge. Hi ha una sèrie de conceptes que hem de tenir assumits prèviament per poder entendre el que significa decidir-se per emprar un format d'imatge i no pas un altre. Aquests conceptes són: píxel, bit, RGB i profunditat de color.
Comencem per explicar aquell que ens resultarà més fàcil comprendre, el píxel. Un píxel és la unitat mínima de color que un ordinador ens pot mostrar per pantalla. Hem de comprendre que es tracta d'un punt minúscul, d'un color concret que, juntament amb la resta de punts (píxels) de la pantalla formen la imatge.
Com determina l'ordinador quin color ha de tenir aquest píxel? Doncs ben senzill, l'arxiu que conté la imatge li proporciona tota la informació sobre els colors que ha de tenir cada punt de la imatge, així com la seva posició.
La informació sobre cada píxel es dóna en bits, i aquest és el següent concepte que hem de tenir en compte. Els ordinadors fan servir el llenguatge binari, on el bit representa la unitat mínima d'informació. Així un bit per sí sol només pot indicar una d'entre dues possibilitats, per exemple encès o apagat, 0 ó 1. Per tal de poder transmetre dades més complexes, els bits s'agrupen en grups de 8. Cada grup de 8 bits és el que coneixem per byte.
Veiem ara com afecta això al tractament de les imatges.
Per indicar de quin color ha de ser un determinat píxel, es fa servir una combinació de bits, per exemple un byte (en el cas que fem servir una combinació de 8 bits per senyalar de quin color es tracta). Així, si cada bit només pot indicar un valor d'entre dos possibles, quantes combinacions possibles ens poden proporcionar 8 bits.
Veiem-ho amb un exemple:
00000000
00000001
00000011
...
10010100
fins a
11111111
Com que cada posició, cada bit, d'aquest grup pot adoptar dos valors diferents, tenim 2⁸ possibles colors, és a dir que podrem representar un total de 256 colors per a cada píxel.
Quan parlem de profunditat de color, fem referència precisament a la quantitat de bits que podem fer servir per representar un color.
Així, existeix la possibilitat d'afegir més bits d'informació per poder representar encara més colors. Encara que us sembli difícil de creure, en el mòn hi ha més de 256 colors diferents.
Si volem una imatge que contingui més colors, necessitarem afegir-hi més bits i com que aquests "viatgen" en grups de 8 la imatge haurà de tenir una profunditat de 16 bits, el doble de bits que una imatge de profunditat inferior.
Quants colors podrem representar amb 16 bits? Doncs 2¹⁶, 65.536 possibles colors.
Encara existeixen més colors diferents i per tant podem afegir encara més bits d'informació per tal de representar-los. Una profunditat de 24 bits ens permet la possibilitat de representar fins a 16.777.216 colors diferents. Arribats a aquest punt hem de ser conscients que l'ésser humà no és capaç de diferenciar entre tantes tonalitats de color.
Tot i això, existeixen imatges que presenten una profunditat de color de 32 bits, en les quals, l'últim byte (o grup de 8 bits) ja no aporta informació sobre el color sinó que s'utilitza per aportar informació sobre les transparències. Aquest és el cas de les imatges en format PNG.
Ara farem una prova senzilla per veure com són els tres formats d'imatge que hem tractat a classe i com aquests afecten al pes i a la qualitat d'una imatge en concret. Per fer-ho utilitzarem un cop més l'editor d'imatges GIMP.
En primer lloc hem d'obtenir una imatge original. Podem fer una fotografia amb un dispositiu digital (càmera, mòbil o webcam), o bé escanejar-ne una que tinguem impresa. Una altra possibilitat és descarregar una imatge d'Internet (com he fet jo), però llavors heu de tenir cura amb els drets d'ús que tingui la imatge seleccionada.
La imatge que he triat és la següent:
 |
| Imatge extreta de la Wikipèdia: https://es.wikipedia.org/wiki/Stormtroopers |
Un cop ja tenim la imatge hem d'obrir-la amb l'editor d'imatges. El nostre objectiu serà realitzar un canvi, retallant una figura d'aquesta imatge. Abans hem d'estar segurs que la nostra imatge conté transparència, ja que si no és així tot allò que suprimim a la imatge es tornarà del color de fons assignat per defecte (que acostuma a ser el blanc). Anem al menú "Capes" i triem la opció "Afegeix canal alfa" que apareix quan ens posem a sobre de "Transparència".
A continuació podem seleccionar la part de la imatge que volem conservar amb l'eina que més s'adeqüi a la nostra situació. Com que la silueta que vull preservar és molt irregular triaré l'eina de "selecció lliure".
Un cop hem seleccionat la figura, hem de tenir present que volem retallar allò que l'envolta, per tant haurem d'invertir la selecció- Des del menú "Selecciona" triem la opció "Inverteix". En acabat, premem la tecla suprimir i el resultat serà semblant a aquest:
Ara la zona que envolta la nostra figura està composta per petits quadres blancs i grisos. Es tracta de la senyalització típica que indica que aquesta zona és transparent.
Desarem la imatge com a fitxer propi de Gimp amb l'extensió .xcf. Ja sabeu com es fa, anem al menú "Fitxer" i triem la opció "anomena i desa". Posem nom al document (recordeu que és molt recomanable que això sigui el primer que feu) i escollim un espai entre els nostres fitxers per desar-lo.
Tot seguit desarem la imatge en els tres formats que hem après a classe. Comencem pel PNG, que és un format de compressió sense pèrdua. A més admet una profunditat de color que inclou de milions de colors i transparències (canal alfa). Per tant admet profunditats de color de 24 i 32 bits.
Pel tipus de compressió que realitza és un format ideal per a imatges amb colors plans o amb poca variació. No admet el mode de color CMYK, que és el propi de les impressores, és per això que no resulta adequat per a imatges que hagin de ser impreses.
Anem al menú "Fitxer" i aquest cop triem la opció "Exporta com a..." (o "Export As..."). S'obrirà el corresponent quadre de diàleg on , fent clic a l'apartat "Seleccioneu el tipus de fitxer (per extensió)", apareixeran tots els formats d'imatge amb els que Gimp pot treballar. Només cal triar PNG, que normalment bé marcada per defecte, i exportar.
 |
| Quadre de diàleg Exporta la imatge. |
La imatge resultat és aquesta:
 |
| Imatge en format PNG |
La segona imatge la desarem en format GIF, per tant tornarem a fer el mateix però aquesta vegada triarem el format GIF en el quadre de diàleg "Exporta la imatge".
Després d'acceptar fent clic als corresponents apartats, obtindrem una imatge com aquesta:
 |
| Imatge en format GIF. |
Com podeu apreciar, en tractar-se d'una imatge que conté relativament pocs colors, no es veu gaire diferent que l'anterior. No obstant, si ens fixem amb cura en el contorn veurem que no és tan perfecte i molts dels píxels sembla com si haguessin desaparegut.
La principal diferència entre el format anterior i aquest és la profunditat de color, que només pot ser de 8 bits i per tant fa que la nostra imatge només pugui contenir 256 colors com a màxim. D'altra banda es tracta d'un tipus de fitxer que tampoc té compressió amb pèrdua.
Per tot això, esdevé un format perfecte per a logotips i dibuixos però una mala elecció per desar una fotografia.
Només vull afegir que l'última versió d'aquest format admet transparències i animacions.
Recordeu que quan fem referència a la quantitat de bits per píxel, estem parlant de profunditat de color.
Finalment, desarem la nostra imatge en format JPG. A diferència dels altres dos formats, el JPG presenta compressió amb pèrdua. És a dir que la qualitat de la imatge es veurà afectada, tot i que ens permet ajustar el grau de compressió.
Admet una profunditat de color de 24 bits (8 bits per color, seguint el sistema RGB). Això fa que no deixi cap bit per a realitzar transparències.
Resulta el format més adient per a les fotografies, en especial per aquelles destinades a Internet, especialment per la seva elevada qualitat (en termes de profunditat de color) malgrat que la pèrdua de la compressió que torni les imatges molt lleugeres (ocupen menys espai a la memòria).
El resultat és aquest:
 |
| Imatge en format JPG. |
La qualitat de la imatge s'apropa més a la del format PNG, però hem perdut la transparència.
Compressió vol dir que es redueix el nombre de bits del fitxer original i en obrir-lo es torna a reconstruir tot afegint aquells que s'havien extret. Això es fa mitjançant algorismes. En el cas dels fitxers amb format JPG es produeix una pèrdua dels valors originals, ja que el procés de compressió i posterior reconstrucció no permet que totes les dades es recuperin.
Cal assenyalar al seu temps que la pèrdua de qualitat és acumulativa i si la nostra imatge original ja estaba en format JPG tornarà a perdre qualitat. Per tant és millor treballar sobre la imatge original i no anar modificant les imatges prèviament modificades en aquest format.
Arribat a aquest punt comprovarem l'espai que ocupa cadascuna de les imatges que hem creat. Ens situem a la carpeta o directori on es troben i, fent servir el menú contextual (clic amb el botó dret del ratolí a sobre de la icona del fitxer), triem la opció "propietats". Un cop tenim les tres finestres, podem comparar les seves mides a l'apartat "Mida" de la pestanya "General".
Podem observar com la imatge en format GIF (a la dreta) és la més lleugera de totes (296,2 KB), mentre que la més pesada és la de format PNG (4,1 MB, és a dir 4100 KB!!!). Per la seva banda, la imatge en fitxer JPG té una mida més propera a la de l'arxiu GIF (només 305,3 KB).
Espero que us sigui útil. Ens veiem a classe!
Aquesta setmana felicitem al nostre company Pedro per superar amb èxit la prova d'ACTIC. Ara cap al següent nivell!
Font de la imatge original: pics-about-space.com
