icono tipos de imagenes

Consejos para la optimización de imágenes

Escrito por Arianna Silva el . Posteado en SEO

Consejos para la optimización de imágenes
3.9 (77.14%) 7 votes

conejos-optimizar-imagenes

En Posicionamiento Web Salamanca hoy hemos querido traerles algunos consejos para la optimización de imágenes para su Web, éstos archivos comúnmente suman la mayor cantidad de bytes de descarga en un sitio, y también constantemente ocupan una cantidad significativa de espacio visual. Entonces, la optimización es necesaria, porque podría ahorrarte espacio y mejorar el desempeño de tu Web, los tiempos de carga, ya que mientras menos tenga que bajar el navegador, menos competencia habrá en el ancho de banda del que te visita y podrá ver tu contenido sin problemas. Sigue leyendo y aprende más sobre este tema.

La importancia de comprimir las imágenes

Con respecto a la optimización no hay una regla de oro, es de algún modo un arte por eso mismo, pero también tiene su componente científico, ya que hay técnicas y algoritmos que se pueden aplicar a las imágenes para reducir su tamaño y que funcionen mejor.

Al colocar una imagen en una página de tu Web debes pensar si realmente la necesitas, si aporta algo, si es buena para tu estrategia. Es importante recordar, que una buena imagen, bien colocada, puede decir más de mil palabras, entonces, depende de cada redactor, diseñador y webmaster decidir qué es lo mejor para su Web.

Las imágenes son se tratan solo de fotografías o gráficos, también hay efectos CSS como gradientes, sombras, animaciones, etc. que pueden ser producidas con cierta resolución, para que se vea bien en cada resolución y zoom. También están las tipografías o fuentes, pero estas no deben ser imágenes en códigos, ya que no se pueden seleccionar buscar, no son accesibles.

Qué tipo de imágenes

Escoger entre imágenes de vectoriales o de bits (raster), debe ser una de las primeras cuestiones a decidir, los gráficos de vectores usan líneas, puntos y polígonos para representar la imagen, mientras que las de bits la representan codificando los valores individuales de cada pixel en una cuadrícula rectangular

Las imágenes vectoriales son ideales para aquellas imágenes de formas geométricas (logos, iconos, etc.) simples, éstas tienen buena resolución y zoom independiente, es un formato ideal para pantallas de alta resolución y si necesitan ser usadas en diferentes tamaños. Mientras que las de bits se recomiendan para escenas con formas irregulares y detalles (fotos). Cada uno tiene cosas positivas y negativas, los formatos de esta son GIF, PNG y JPEG, entre otros.

Noticia relacionada  Consejos de optimización SEO para búsquedas por voz

Las imágenes con bits no tienen tan buen desempeño en distintas resoluciones, por lo que deberías guardar diferentes versiones de tamaños.

Escoger el formato adecuado

Los diferentes formatos, soportan diferentes características, como animaciones y transparencias, por lo que elegir el formato adecuado para una imagen debe ser una combinación de lo que necesites visualemente y los requerimientos funcionales.

Estos son los formatos más populares:

  • GIF: acepta transparencias, animaciones y sirve en todos los navegadores.
  • PNG: acepta transparencias, animaciones y sirve en todos los navegadores.
  • JPEG: no acepta transparencias ni animaciones, sirve en todos los navegadores.
  • JPEG XR: acepta transparencias, animaciones, pero solo sirve en Internet Explorer.
  • WebP: acepta transparencias, animaciones, solo funciona con Chrome, Opera y Android.

Podemos que ver que hay tres formatos que son universales, GIF, PNG y JPEG; los últimos dos son formatos son más nuevos, y su limitante es que no son soportados por todos los navegadores, pero ofrecen buenas opciones de compresión.

¿Cómo escoger? Pregúntate:

  • ¿Necesito animación? Si la respuesta es sí, entonces escoge GIF.
  • Si no es animación, pero ¿necesito preservar detalles con alta resolución? Si es sí, lo mejor es PGN- o PNG-24 (grande, paleta de más de 254 colores), porque produce las imágenes de mayor calidad. Si la respuesta es no, entonces ve por JPEG, sirve para fotos y capturas de pantalla por igual.

Herramientas y parámetros para la optimización de imágenes

Como ya te hemos dicho antes, en todo lo que se refiere a la Web no hay una fórmula infalible o secreta, no hay un formato perfecto, así como tampoco hay parámetros únicos o una herramienta que sea perfecta. Para conseguir el mejor resultado lo mejor es escoger el formato y sus características de acuerdo al contenido y contexto de la imagen, así como de los requerimientos visuales.

Nombraremos algunas herramientas útiles, disponibles en la Web, sin necesidad de instalar ningún software en su ordenador:

  • Shortpixel: permite optimizar las imágenes sin comprometer la calidad.
  • gifscicle: para crear y optimizar GIFs.
  • jpegtran: para optimiza imágenes jpeg.
  • optipng: optimización de PNG lossless (misma calidad de imagen).
  • pngquant: optimización de PNG lossy (reducción de la calidad de imagen).
  • Tiny PNG: comprime archivos jpeg y png. Subes las imágenes a la Web y las descargs o guardas en Dropbox.
  • Compressor.io: permite escoger entre compresión lossy y losselss, solo para JPG y PNG.
  • JPEG Optimizer: baja el tamaño de la imagen pero se pierde la calidad.
  • Optimizilla: es muy útil y sencillo para imágenes JPEG y PNG. Permite comprimir hasta 20 imágenes all mismo tiempo.
  • Kraken.io: es una herramienta útil, puedes escoger entre compresión lossy y lossless, puedes subir imágenes hasta de 1MG de peso.

No tengas miedo de probar distintas opciones, de experimentar con los parámetros de cada uno. Baja la calidad y ve cómo se ve la imagen, luego súbela, y así irás consiguiendo la calidad de imagen que consideras la que necesitas, la que es ideal para tu Web.

Noticia relacionada  Checklist SEO para tu negocio – Parte II #infografía

No asumas que todas las imágenes deben comprimirse con las mismas características y configuraciones, por ejemplo una imagen principal de un post no podrá tener nunca el mismo tamaño que una infografía, mucho menos que un ícono, de ahí la importancia de probar qué es lo mejor para tu Web.

Qué revisar al optimizar

Algunos últimos consejos sobre la optimización de imágenes, desde su Empresa de Posicionamiento Web, consideramos que debes irte por el formato vectorial, porque en esta la resolución y la escala son independientes, son ideales para distintos dispositivos y para la alta resolución. También puedes experimentar con configuraciones de calidad para formatos raster, y podrías ahorrar un poco de espacio.

Elimina los meta datos de las imágenes bits, como geoinformación, detalles de la cámara, entre otros; usa herramientas apropiadas para eliminar esta data. Es importante escalar las imagenes, cambiarles el tamaño en el servidor para asegurarse que el tamaño sea lo más cercano a lo natural.

Últimos consejos de optimización

  • Nombra tus imágenes en perfecto español, usa palabras clave en los nombres de archivo.
  • Optimiza los textos ALT o texto alternativo, este le añade valor a tu SEO, en estos textos describe las imágenes e incluye palabras clave.
  • Reduce el tamaño de las imágenes cuando sea necesario.
  • Escoge el formato adecuado.

Ya te hemos dado algunos consejos para que optimices las imágenes que subas a tu Web, estas tienen un peso importante en los tiempos de carga, lo cual a su vez influye de manera significativa en tu posicionamiento Web, si quieres ubicarte entre los primeros resultados de Google deberás seguir nuestros consejos para optimizar tu Web.

¿Qué herramienta de optimización prefieres? ¿Qué tipo de archivo escoges generalmente para subir imágenes a tu Web? Coméntanos tu opinión sobre este tema.

Arianna Silva

Arianna Silva

Licenciada en Comunicación Social. Redactora. Jefa del departamento redacción y contenidos y SEO Junior en Posicionamiento web Systems S.L de JesusLopezSEO®
Leer entrada anterior
instagram ads
Guía completa sobre la publicidad en Instagram #infografía

En Posicionamiento Web Salamanca hoy te traemos la guía completa sobre la publicidad en Instagram, esta red social ha subido...

Cerrar