El artículo de hoy es un poco largo, denso y completo, pero es que aquí encontraréis toda la información que podáis necesitar sobre los diferentes tipos de archivos y formatos que se utilizan en el diseño gráfico.
Siempre que usamos un editor de imágenes, no sólo Photoshop, cualquiera nos vale, nos da diferentes opciones a la hora de guardar nuestros archivos. Incluso los editores más sencillos como el Paint de Microsoft nos permitirán escoger entre varios tipos de imagen al pulsar la opción “guardar como”.
¿De dónde salen todos estos tipos de archivo?¿Cuál es mejor o nos conviene más?¿Tiene sentido usar una opción que no sea “JPEG”? Trataré de responder a estas preguntas realizando un recorrido por los principales tipos de imagen y los usos para los que fueron creados.
Mapa de bits frente a imagen vectorial.
Existen dos tipos de imágenes digitales: las imágenes basadas en mapas de bits y las imágenes vectoriales. La mayoría de las imágenes digitales que encontraremos cotidianamente, entre ellas todas las fotografías, dibujos e ilustraciones que vemos en las páginas web, pertenecen al primer grupo, el basado en mapas de bits. El nombre les viene debido a que sus archivos contienen datos que establecen una distribución de puntos de color (píxeles) en una rejilla rectangular (cuyo tamaño también determinan) a la manera de un mapa. Un ordenador (con su software por defecto, sin instalar nada especial) es capaz de leer estos datos devolviendo al usuario una imagen en pantalla.
Las imágenes vectoriales están basadas en relaciones geométricas (vectores, polígonos y curvas), y los ordenadores comunes no son capaces de devolver una imagen con estos datos (con la excepción del formato SVG, del que hablaremos más tarde). Necesitaremos un software especial para poder verlas y editarlas (Adobe Illustrator, Freehand, etc…): son los conocidos como programas vectoriales. Otra opción consiste en rasterizar esa imagen con algún programa de edición gráfica como el Photoshop, pero entonces la habremos convertido en un mapa de bits, perdiendo las ventajas del formato vectorial. Estas ventajas consisten fundamentalmente en que, como sus archivos establecen relaciones entre formas geométricas, a la hora de imprimir podemos usar las medidas que queramos (incluso kilómetros si disponemos de papel suficiente). Las imágenes de mapas de bits tienen un tamaño concreto, que si ampliamos será a costa de perder resolución y calidad en la imagen. Si ampliamos demasiado se harán incluso visibles los puntos de color que la conforman, creándose el típico efecto de pixelado.
Por contra las imágenes vectoriales no pueden contener el nivel de detalle de un mapa de bits al estar formadas por geometrías (menos calidad en degradados, sombras, texturas complejas, etc…). Así pues los usos de cada tipo serán los siguientes:
Mapas de bits
Es el formato usado por todas las fotografías, así como los dibujos naturalistas, sombreados, etc… Las imágenes que muestran las páginas web y los programas más comunes son todas de este tipo. Se usan en cualquier trabajo gráfico, pero no puede excederse el tamaño que establezca su resolución. Si queremos una imagen de este tipo más grande, hará falta un archivo más grande en kbs., llegando incluso a cientos de megas en carteles de gran formato.
Imágenes vectoriales
se usan en diseño gráfico para grandes soportes (carteles publicitarios, etc…) debido a que la medida en que las vayamos a imprimir no influye en el tamaño de sus archivos (que meramente recogen relaciones de tamaño entre los objetos que contienen). También son muy útiles para el diseño de logotipos y en el dibujo técnico, pues los programas vectoriales incluyen herramientas para dibujar, trazar y editar formas geométricas de forma sencilla o incluso manual (como es el caso de los manejadores que incluyen las curvas Bézier).
Cada tipo de imagen posee a su vez diferentes formatos de archivo que han ido desarrollándose con el tiempo, cada uno con diferentes funcionalidades.
Tipos o formatos de archivo de imagen.
A la hora de guardar un archivo de imagen desde un programa editor podremos elegir entre muchos formatos, veamos a continuación los más comunes y sus usos:
JPEG
(Joint Photographic Experts Group)
Archivo de mapa de bits. Con diferencia es el más común de los formatos de imagen, y presenta la ventaja de que puede comprimirse bastante (aunque a costa de la calidad de la imagen). Puede elegirse entre muchas calidades diferentes, con archivos más grandes a mayor calidad. Es el formato que tienen la mayoría de las imágenes que encontramos en Internet (dado su pequeño tamaño), y también es un formato habitual de cara a la impresión. Sin embargo hay que tener cuidado pues cada vez que editamos y volvamos a guardar un JPEG iremos perdiendo calidad en la imagen (debido a que la iremos comprimiendo más y más). Es el formato indicado para usar en Internet (a 72 píxeles/pulgada de resolución).
TIFF
(Tagged Image File Format)
Archivo de mapa de bits. Es un formato también muy habitual, especialmente en el mundo de la impresión de calidad (carteles, periódicos, revistas, etc…). Está indicado para ello debido a que el TIFF no pierde calidad aunque editemos y volvamos a guardar la imagen, pues no realiza compresión (aunque contamos con la opción de hacerlo, pues posee un formato de compresión propio llamado LZW, que no pierde calidad). Así pues con el TIFF no estropeamos la imagen al trabajarla, pero los archivos son bastante más grandes. Además de ello, el TIFF es un formato que admite canal alfa (ya veremos lo qué es eso).
BMP
(Windows Bitmap)
Archivo de mapa de bits. Es el formato propio del programa Paint de Microsoft (viene de serie en los equipos con este sistema operativo, en inicio/todos los programas/accesorios). Sus prestaciones son similares a las del TIFF, ofrece buena calidad en las imágenes pero ocupando mucho espacio en disco (archivos grandes). Es decir, que tampoco es muy útil para internet. Es menos popular que el TIFF.
GIF
(Graphics Interchange Format)
Archivo de mapa de bits. Este formato es antiguo y presenta bastantes limitaciones, aunque sigue usándose para la función que se creó: Internet. Sólo soporta 256 colores, con lo que las imágenes muy ricas en color sufren mucha pérdida de calidad con este formato. Sin embargo admite animación (los famosos GIF animados). Es algo que sigue en uso debido a que la mayoría de los navegadores son capaces de mostrar las animaciones sin instalar software adicional (gran ventaja frente a otras técnicas). Además de ello admite transparencias en las imágenes (muy usado en las siluetas de objetos, que de otra forma aparecen en un recuadro blanco). Otra característica es que también usa la compresión sin pérdida LZW, igual que el TIFF, con lo que ofrece buena calidad (en imágenes con poco colorido, pues como decimos sólo admite 256 colores).
Otra de las desventajas del GIF es que emplea un modo de color denominado indexado, que no admite las posibilidades de edición por canales (RGB o CMYK) de otros formatos de imagen.
Los archivos GIF son sin embargo muy adecuados para colocarlos en páginas web, si la imagen no tiene degradados o demasiada riqueza de color –o no nos importa perderla-. Esto es debido a que son archivos pequeños, ocupando normalmente la mitad de espacio en disco que un PNG.
PNG
(Portable Network Graphics)
Archivo de mapa de bits. El PNG surgió en buena medida para suplir las carencias del GIF, cosa que hace con nota. Es capaz de usar modos de color por canales (como el RGB), con lo que puede ser editado de forma integral. Además de ello no usa la compresión LZW, que tiene derechos de patente. Y admite también fondos transparentes. De esta forma se está convirtiendo en el formato más usado en internet para siluetas y objetos con transparencias. Tiene mucha más calidad que el GIF, que sólo soporta 256 colores, no teniendo el PNG limitación en este sentido. Se comporta en cuanto al color como un JPEG, pero a diferencia de éste no sufre pérdida de calidad en la compresión.
Esto es fundamental para las imágenes que contengan textos, que en formato PNG se leen con mucha más claridad. El texto que pongamos en un JPEG para internet se verá difuminado, sobre todo si es pequeño, debido a la pérdida de calidad en la compresión (las imágenes de las páginas web tienen una resolución muy baja –sólo 72 píxeles/pulgada- y acusan por ello más todavía la pérdida). Con el PNG solucionamos este problema. Es por tanto el formato que hay que usar en las imágenes con textos o transparencias en Internet.
La única pega del PNG radica en el tamaño de sus archivos. Aunque usan también un sistema de compresión, los archivos PNG suelen ser el doble de grandes que los GIF. No extraña debido a que contienen mucha más información (canales, colores, etc…). Habrá por tanto que elegir entre calidad y peso del archivo (PNG o GIF).
TARGA (TGA)
(Truevision TGA)
Este formato se usa habitualmente en imágenes con transparencias que serán incluidas en vídeo. El formato TGA, igual que el TIFF, permite añadir un canal alfa a las imágenes, que será el que indique el grado de transparencia de los restantes canales. En el canal alfa, lo negro determinará las partes transparentes de la imagen, lo blanco las opacas, y lo gris grados de translucidez en la misma. Es un poco complicado, pero necesario para la transparencia en vídeo. Os enlazo a un sencillo tutorial en el que puede verse cómo hacer un canal alfa.
Por lo demás el TGA es un formato de imagen creado por Truevision Inc. para sus tarjetas gráficas TARGA, de las primeras en soportar millones de colores (Truecolor o color verdadero). También posee un sistema de compresión sin pérdida, con lo que ofrece buena calidad. Sin embargo como decimos se usa hoy en día sobre todo en vídeo.
RAW
Archivo de mapa de bits. Este formato también es conocido como “en bruto”, debido a que es el archivo de imagen original de la cámara fotográfica sin ningún tipo de compresión o modificación. Debido a ello tiene un tamaño enorme, con las limitaciones que esto supone. Sin embargo es el formato que contiene más información (de hecho, contiene toda la información que capturó la cámara fotográfica). Así pues es ideal para iniciar el trabajo de edición de nuestra fotografía, y conviene conservarlo. Eso sí, no todas las cámaras guardan las imágenes en formato RAW (muchas las comprimen directamente a JPEG). Si guardamos en formato RAW estaremos conservando absolutamente toda la información que contenga nuestra fotografía o imagen.
EPS
(Encapsulated PostScript)
Archivo vectorial. Este formato es usado por las imágenes que realizamos con programas como Illustrator o Freehand. Contiene información vectorial y se usa para impresión. No puede por tanto visualizarse en los equipos que no cuenten con un software específico para ello (aunque algunos archivos EPS cuentan con un pequeño TIFF de 8 bits para previsualizar su contenido). Al ser una imagen vectorial no tiene problemas de resolución y puede ser impresa a cualquier tamaño, aunque sólo contendrá geometrías (por muy complicadas que sean, nunca serán fotografías). Esto no quita que el EPS pueda contener a su vez imágenes de mapa de bits incrustadas en él, pero éstas ya no son vectoriales y por tanto su resolución será limitada. Además de ello, estos archivos pueden abrirse con editores de imagen como Photoshop, realizándose un proceso de rasterización. Al hacer esto convertimos el archivo vectorial en un mapa de bits, con una resolución concreta (que le decimos al programa en ese momento). A partir de aquí será una imagen ordinaria como cualquier fotografía.
SVG
(Scalable Vector Graphics)
Archivo vectorial. SVG es el único formato vectorial capaz de ser interpretado por los navegadores web. Ha sido creado para ello, y poco a poco se está implementando su uso en internet (cuenta con el apoyo del W3C). Navegadores como Firefox, Chrome u Opera, en sus versiones actuales, son capaces de mostrarlo (Internet Explorer precisa de un plug-in para ello). Es por tanto la actual apuesta del diseño web por la ilustración vectorial.
Una gran ventaja de la implementación de estos archivos es que nos permitirá tomar aquellos gráficos SVG que cuenten con licencia de uso libre (Creative Commons, etc…) presentes en las páginas web y usarlos en nuestros proyectos. Al ser un formato vectorial podremos reutilizarlo a cualquier tamaño (frente a las imágenes en formato mapa de bits de internet, normalmente muy pequeñas).
PSD
(PhotoShop Adobe)
Es el formato de los archivos del programa Photoshop de Adobe, y puede contener diversas capas y todo tipo de efectos. No puede visualizarse sin este programa y se usa para futuras ediciones del contenido.
Y esto ha sido todo. Espero que hayas conseguido llegar hasta aquí abajo ya que si lo has hecho podrás decir que sabes todo lo necesario para trabajar con los archivos adecuados a cada situación.
Muchas gracias por leerme y recordad que podéis encontrarme en las siguientes redes sociales:
Todo el que quiera recibir mis post en su correo, tiene a su disposición un sistema de suscripción completamente gratuito en el home del blog.
Y por favor, si te gustó este artículo y te fue útil, compártelo.
Gracias!