¿Cómo Optimizar las Imágenes para Web?

¿JPG? ¿JPEG? ¿PNG? ¿GIF? ¿SVG? ¿Te suenan estos formatos de imágenes para web?

Hay multitud de formatos de imágenes para web adoptados por los navegadores, cada uno con sus propias características y sus ventajas y desventajas en cuanto al rendimiento se refiere. Resumiendo, no hay una “talla única” para el formato web (en la actualidad).

Lo primero que “choca” en este tema es que hay existen diferentes tipos de archivos de imágenes que cumplen el mismo objetivo: mostrar una foto o imagen. Pero nada más lejos de la realidad, ya que cada uno cumple un cometido (mejor o peor) y es imprescindible saber cuál es el adecuado para tus necesidades y las de tu sitio web. Los archivos JPG (o JPEG), PNG y GIF suelen ser los más habituales en diseño web y los que encontrarás más a menudo.

Sin Perdida: Es un tipo de compresión de imágenes que reduce el tamaño de un archivo sin perdida de calidad (no importa las veces que guardes u optimices la imagen, que la imagen se verá exactamente igual).

Con Perdida: Es un tipo de compresión de imágenes que reduce el tamaño de un archivo con perdida de calidad (si guardas una imagen en un formato con perdida una y otra vez, la calidad de la imagen empeora progresivamente).

Consejos para optimizar imágenes para web

Atributo Alt

El nombre de Alt viene de alternate text o texto alternativo, y es lo que utilizan los buscadores para saber qué es lo que muestra una imagen. También es el texto que se utiliza en lugar de la imagen cuando ésta no se puede cargar junto con el resto del contenido de la página.

• Nombrar correctamente la imagen
• Describir fielmente el contenido de la imagen
• Incluir la palabra clave principal en la imagen

Nombre del archivo (corto y descriptivo)

El nombre del archivo es un indicador del contenido de la imagen. Para optimizar el nombre debes intentar ser corto y descriptivo, y no es necesario que incluyas tanta información como en la etiqueta Alt.

Tamaño del archivo (lo más pequeño posible)

Lo ideal es que el tamaño del archivo, de las imágenes para web sean lo más pequeño posible. De esta forma las imágenes cargan rápido, y eso es algo que premian los buscadores. Pero el tamaño del archivo depende de 2 cosas:

• Las dimensiones de la imagen.
• La calidad de la imagen.

Existen numerosas herramientas con las cuales se puede reducir el tamaño de la imagen:

• Compressnow
• TinyPNG
• TinyJPG
• Fileminimizer
• etc…