Infografía sobre los Formatos de Imagen: Comparativa y Usos

Una de las muchas dudas que tenemos que tener en cuenta, cuando comenzamos con nuestra web o blog, es determinar que formato de imagen es el óptimo para nosotros. El jpg lo conocemos más que de sobra, pues nos ha acompañado en las imágenes de nuestra vida, pero cuando comenzamos a trabajar en el diseño, ya sea web o gráfico, vemos que las opciones se amplían y aparecen nuevos formatos.

Aunque hay algunos más, los más conocidos son el jpg el png y el gif. Son los más usados y también los principales en los que se exporta en los programas de edición. Cada uno tiene unas características especificas, aunque en muchos casos son complementarios, es decir, es normal incluir en un mismo proyecto más de un formato de imagen. Esto es así, porque no debemos escoger un formato de imagen especifico para un proyecto concreto, sino que dependerá de cada una de las imágenes del mismo.

A nadie le gusta entrar en una web y que las imágenes tarden en cargar tanto que nos cansemos y cerremos la pestaña. Tampoco, que aparezca una imagen con fondo cuando este no tenía que aparecer. Son «pequeños» detalles pero que van a mejorar la experiencia de usuario, y van a hacer que tu web tenga una estructura más dinámica.

Recordar también, que estamos hablando de formato de imágenes y no de gráficos, pues si hablamos de estos últimos habría que contemplar otras opciones distintas, pero bastante efectivas como es el .svg (pero eso lo veremos en otra ocasión)

Así, aunque haré un pequeño resumen escrito de cada uno de los formatos, al final del artículo podéis ver una infografía en la que se relacionan cada uno de los tres formatos, con sus semejanzas y diferencias. Como veréis cada uno funciona mejor dependiendo de lo que contenga esa imagen, y estará en nuestra mano decidir cuál es el mejor para ella. 🙂

JPEG

Es quizá el formato más usado y también el más conocido de la lista. Esto es porque es el formato en el que suelen salir las imágenes de las cámaras de fotos, al ser el que más colores puede captar.

Además, es muy usado en internet puesto que es capaz de reducir el tamaño de la imagen sin disminuir su calidad. Esto es, porque a veces el ojo no es capaz de captar todos los colores que un jpg puede mostrar, por lo que aun reduciendo la imagen nosotros la vamos a ver con todo lujo de detalles.

De esta manera, es un formato muy usado para imágenes, pero nada recomendado para ilustraciones o gráficos, puesto que al comprimirlos perderían calidad.

Conviene hacer hincapié en su compresión sin pérdida de calidad, lo que quiere decir, que no necesitamos subir las imágenes según salen de la cámara, sino que podemos redimensionarlas hacia un tamaño que nos venga bien para nuestra web y que no pierda calidad.

GIF

La característica principal de los GIFs es que permite las transparencias y las animaciones, por lo que lo hace un formato muy popular, sobre todo para la realización de estas últimas.

Otras de las características a destacar de este formato, es que hace una carga progresiva, de manera que primero se carga una versión de baja calidad y luego aparecen los detalles. De esta forma, sabemos que aunque la conexión sea más baja, la imagen se va a cargar y por lo tanto nuestro usuario la va a ver.

De todas maneras, al tener menos colores que el jpg la hace más adecuada para el uso de ilustraciones y gráficos pero no para imágenes de alta calidad.

PNG

Nació como una alternativa al GIF, pues realiza las transparencias y los gráficos con una mejor calidad, una más similar al JPG.

Al tener transparencia lo convierte en un formato muy usado en web, para aquellos trabajos que no tengan fondos y también para el uso de ilustraciones y gráficos. Dando lugar a imágenes menos pesadas y que funcionan con una alta calidad.

Realmente, si no vamos a hacer una animación, y necesitamos una imagen con transparencia, es más conveniente escoger este formato antes que el GIF puesto que la calidad es mayor.

formato-imagenes-usos-comparativa

 

Comentarios (2)

  1. Una consulta …. para reducir el peso de una imagen sin perder calidad, que software es recomendable usar o como hago para vectorizar una fotogragía en mi página….gracias

    1. Hola Klaus,

      Muchas gracias por comentar. Normalmente con cualquier editor de imágenes vas a poder reducir el tamaño de las mismas. El más conocido es quizá Photoshop o alguno de esta lista: http://www.silocreativo.com/5-programas-de-retoque-fotografico-para-dar-un-nuevo-toque-a-tus-imagenes/

      También puedes usar algún programa en linea como de los que hablamos en este artículo: http://www.silocreativo.com/5-programas-de-retoque-fotografico-en-linea-mi-favorito-el-4/

      Espero que te sea de ayuda!

      Un saludo!

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *