Como sacar el mayor partido a tus imágenes

imagen 1

Las imágenes se han convertido en un pilar fundamental de cualquier web:

  • El cerebro humano procesa la información visual 60.000 veces más rápido que la que sólo contiene texto.
  • Logran un 94% más de impacto que cualquier texto.
  • Los usuarios dedican el doble de tiempo a las páginas con contenido visual.
  • Las imágenes son un 42% más efectivas a la hora de que los usuarios recuerden o retengan la información.
  • Un 65% de los usuarios aprenden de forma visual.
  • Los contenidos con imágenes o vídeos atraen el triple de enlaces.
  • los usuarios que ven el vídeo de un producto son más proclives a comprarlo en un 85%.
  • Las infografías ayudan a aumentar el tráfico en un 12% de media.
  • Los tuits con imágenes reciben un 150% más de retuits.

Pero utilizar imágenes no es tan sencillo como parece.

Subir fotos de mala calidad,  ubicarlas en lugares de escasa visibilidad, no tener cuidado con la estética, no etiquetarlas correctamente… son algunos de los errores más comunes a la hora de utilizar imágenes en un sitio web.

Pero, ¿cuáles son las ventajas de optimizar las imágenes?

Existen 3 ventajas o beneficios fundamentales:

  • SEO: uno de los factores que contribuye al posicionamiento es la velocidad de carga de la página, una página cuya carga en el navegador sea rápida, tendrá más posibilidades de posicionar correctamente. Las imágenes pesadas (muchos KB o MB) hacen que la velocidad de carga de una página se vea ralentizada.
  • Conversión: una página cuya estructura y la combinación de imágenes y textos sea organizada, tendrá más posibilidades de atraer, retener y “convertir” las visitas en clientes.
  • Estética: el uso de imágenes de calidad proporciona una imagen seria y profesional de nuestro negocio.

imagen 2

 

Así, cuando vayas a subir imágenes a tu sitio web, hay una serie de factores sobre los que es conveniente trabajar:

1.- Calidad de las imágenes

Al hablar de calidad, son varios los aspectos que hay que tener en cuenta.

El tamaño:

Se trata de adecuar el tamaño de la imagen al del espacio donde la vamos a emplazar.

Si vas a colocar la imagen en la columna de un blog de 900 pixeles de ancho, no tiene ningún sentido utilizar una imagen de 3.000 o 4.000 pixeles.

Para ello lo recomendable es recortar o redimensionar las imágenes antes de subirlas a la web.

Existen herramientas online con las puedes recortar y ajustar el tamaño de tus imágenes de forma bastante rápida y sencilla. Entre ellas te recomiendo Pixlr, no requiere instalación ni registro, funciona por capas (de forma similar a Photoshop) y permite el uso de paletas, navegador, distintas posibilidades de edición y opciones de ajuste de fotografías, diferentes tipos de filtros, transformación o distorsión de imágenes y efectos especiales.

imagen 4

El formato:

Hay tres formatos principales que representan prácticamente la totalidad de los formatos usados en la web, son los formatos JPG, PNG y GIF. Pero cada uno de ellos presenta unas características que lo hacen más apto según el tipo de imagen y la aplicación que la queramos dar:

  • Conviene utilizar el formato GIF cuando:
    • La imagen es pequeña.
    • Se requiere una animación para ser utilizada en Internet.
    • Si la imagen contiene altos contrastes o grandes bloques de color.
  • El formato JPG es adecuado cuando:
    • Se requieren imágenes con 24 bits (16.7 millones de colores).
    • La imagen es una fotografía o contiene tonos continuos.
    • Serán usadas para su distribución en Internet, por lo que se requiere un peso mínimo de las mismas.
    • Se requieren fotografías con un reducido tamaño de archivo.
  • El formato PNG es el formato idóneo cuando:
    • Se quiere trabajar con niveles de transparencia.
    • Se necesita una compresión sin pérdida para imágenes de color de alta resolución y alto contraste.
    • Se requieren imágenes de alta calidad con compresión sin pérdida.

imagen 5

La resolución: 

Una óptima resolución de las imágenes te proporcionará una mayor calidad visual pero, si no las optimizas, puedes tener el inconveniente de que tu página sea muy pesada y, por lo tanto, tarde mucho en cargar.

Existen herramientas gratuitas que nos permiten optimizar las imágenes, reduciendo el espacio que ocupan pero manteniendo una calidad óptima.

Entre ellas se pueden destacar:

  • Compressor.io: permite comprimir y optimizar tus imágenes de forma sencilla desde la web. Soporta 4 tipos de formatos: JPEG, PNG, GIF, y SVG, y cuenta con dos tipos de compresión: Lossless y Lossy, la primera mantiene la fidelidad de la imagen lo más posible pero resulta en un archivo de mayor tamaño, y la segunda puede resultar en una reducción de hasta el 90% del tamaño de imagen pero la calidad de la imagen disminuye un poco más.

imagen 6

  • Image Optimizer:  es un servicio en linea con el que puedes redimensionar, comprimir, y optimizar imágenes. Solo necesitas subir el archivo, elegir el tamaño de salida, y escoger entre 6 tipos diferentes de compresión que varían de muy pequeño, a la mejor calidad.

imagen 7

  • Web resizer: servicio gratuito online que te permite, entre otras cosas, cambiar el tamaño de la imagen, manipular su calidad, convertirla en monocromática, rotarla…

imagen 8

2.- La ubicación dentro de la web

La trayectoria y las pautas que sigue el ojo dependen en gran medida de la página que se esté mirando:

  • En el caso de una página de inicio, la mirada sigue una trayectoria en zigzag que va de arriba a la izquierda hacia abajo a la derecha.
  • Para páginas de resultados de búsquedas o páginas con listas, se observa una lectura “en triangulo”, que favorece la parte superior izquierda de la página web.
  • En páginas con artículos de texto de gran interés, se mantiene la lectura de izquierda a derecha. Para la mayoría de los artículos, el ojo sigue una trayectoria de izquierda a derecha durante el primer párrafo, y después una trayectoria de arriba a abajo.

A través de los mapas de calor puedes obtener información acerca de cómo “lee” tu público tus páginas y, de esta forma, ubicar tus contenidos visuales para lograr tus objetivos.

mapas de calor 4

3.- Trabaja el SEO On Page

Uno de los factores que Google tiene en cuenta para posicionar una web es, precisamente, la optimización de las imágenes.

Así, es fundamental etiquetar las imágenes que quieres subir a la web, y para ello se recomienda utilizar las palabras clave por las que quieres posicionarte.

Estas Keywords deberías de utilizarlas en:

  • El nombre de fichero de la imagen.
  • El atributo “alt” de la imagen o “texto alternativo” en WordPress.
  • El atributo “title” de la imagen.
  • En la descripción de la imagen.

imagen

Trabaja tus imágenes para obtener grandes resultados

2 comentarios

  1. cece   •  

    Hi,
    Is there any sponsor mobile app review opportunity on blogueandoalos50.com?
    Regards,
    Cece Boyd.

    • Alicia Baró   •     Author

      No yet.
      Regards

Deja un comentario

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

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>