¿Qué formatos de imagen para web debo elegir?

Las imágenes son una parte importante de los contenidos que existen hoy en día. Más aún cuando se trata de páginas web, pero escoger el formato indicado no es una tarea fácil. Aquí te damos la información necesaria para decidir los mejores formatos de imagen para web. 

Vectores vs. mapa de mits

Antes de pasar a los formatos de imagen para web, es importante entender la diferencia entre una imagen de vectores y un mapa de bits. 

Mapa de bits

Las imágenes en mapa de bits están compuestas por píxeles o cuadrículas que forman una imagen. Cada uno de estos píxeles tiene la información de color por un espacio predeterminado de la imagen.

Los formatos más conocidos son JPEG, GIF y PNG; la mayoría de fotos que puedes ver digitales en línea suelen tener alguna de estas extensiones. En las imágenes rasterizadas debes saber que, al ampliarlas, vas a comprometer la calidad de la imagen; cuanto más la modifiques, menos calidad tendrá y más visibles serán los píxeles.

Vectores

Los gráficos de vectores usan líneas, puntos y polígonos para representar una imagen. Son flexibles en cuanto a modificaciones y son muy útiles para logos o gráficos que tengan que ajustarse frecuentemente. Algunos formatos son EPS, PDF, SVG y AI.

Es importante tener siempre una imagen vectorial de tu logo, pues podrás usarlo para cualquier campaña sin importar su tamaño. 

Formatos de imagen para web

Como no pierden calidad aunque se modifiquen, podrías pensar que los mejores formatos serían los vectoriales, pero es un poco más complicado. Para escoger un formato debes pensar qué tipo de imagen tienes y para qué la usarás.

En los formatos de imagen para web, la optimización de las páginas es un aspecto fundamental del diseño web y, si las imágenes son muy pesadas, la página tardará más en cargar.

Si quieres probar cómo cargan las imágenes en tu web puedes usar la calculadora online.

¿Cuáles son los mejores formatos de imagen para web?

JPEG

JPEG, por su nombre en inglés Joint Photographic Experts Group, es uno de los formatos más comunes, no solo en web, sino también en otros medios. Existe una confusión entre JPG y JPEG, pero estos son el mismo formato. 

El JPG es uno de los formatos de imagen para web estándar. Un contra de este es la forma de compresión de pérdida, lo que significa que, cada vez que se baja la imagen, se pierde un poco de la calidad. Tienen que guardarse con la resolución y el tamaño precisos, por esto muchas redes sociales tienen sus propias medidas para que no se dañe la imagen. 

PNG

Portable Network Graphic o PNG es otro de los formatos de imagen para web estándar. Son muy similares al JPG; las imágenes deben estar en el tamaño indicado antes de exportarlo porque al modificarlo se perderá la calidad. 

Los PNG, a diferencia de los JPG, tienen una calidad más alta de imagen y se pueden usar con un fondo transparente. En el caso de que no puedas tener una imagen vectorial para un logo, la siguiente opción sería una imagen de muy buena calidad en png. 

WebP

No es muy conocido. Google lo creó en 2010 para prevenir la pérdida de calidad de las imágenes. Es un buen formato de compresión, mejor que PNG y JPG, y reduce la pérdida de calidad comparado con las dos anteriores. Esto hace que puedas tener imágenes de calidad con menor espacio, lo que agiliza las web. 

El único problema es que este formato no es compatible con muchas plataformas y, usualmente, se necesitan aplicaciones externas para poder usarlo. Por eso no se utiliza mucho. 

SVG

Dentro de los formatos de imagen para web, el SVG o Scalable Vector Graphic es el formato predeterminado para los gráficos vectoriales. Es compatible con los editores de imágenes y también funciona con fondo transparente. 

Es el mejor formato para logos, iconos e ilustraciones, pero no es el mejor formato si se tienen imágenes muy complejas. 

GIF

Este formato es muy popular y sirve para imágenes en movimiento. Gif cuenta con solo 256 colores, por lo que no es el mejor formato para fotografías. Sin embargo, tiene la posibilidad de tener el fondo transparente y puede comprimirse mucho, lo que le da una ventaja al ser muy liviano.

Este es uno de los únicos formatos compatibles universalmente, las otras opciones de imagen animada suelen no serlo. 

Sigue aprendiendo

Si quieres saber más sobre este y muchos temas más relacionados, te invitamos a formar parte de nuestro Bootcamp de Marketing Digital y Análisis de Datos. ¡Inscríbete ahora y conviértete en un profesional en pocos meses!