Las imágenes de sitios web son ideales para complementar los textos y así facilitar su comprensión y hacer amena la lectura.
Hay sectores donde las imágenes encajan mejor que otros. Los aficionados y profesionales del marketing digital nos gusta leer tips, información y novedades sobre este amplio sector; en cambio, los lectores de blogs de lifestyle prefieren que predominen las imágenes.
Pero sea una imagen o varias, en cada una de ellas debes aplicar los tips que te paso a continuación.
7 Tips para Imágenes de Sitios Web Eficaces
1. Imágenes de Gente Real
¿No has visto a veces fotografías que resultan extremadamente artificiales? Fotografías exageradas de modelos con sonrisas y poses fuera de la realidad que dan la sensación de adornar más que aportar información visual.
Fíjate por ejemplo en esta fotografía de unos teleoperadores:
¿No resulta un tanto exagerada? Seguro que cualquier teleoperador se reiría al verla. Es una imagen que transmite indiferencia y no ayuda a situar un contexto real.
En cambio, en la siguiente fotografía al menos captamos un significado de buen ambiente en el trabajo o la gracia de trabajar en equipo.
Para seleccionar con acierto una fotografía, hazte estas preguntas:
- ¿Guarda relación la imagen con el texto?
- ¿Muestra lo que quiero transmitir?
- ¿Es una escena natural fácilmente identificable con la realidad?
- ¿Transmite emociones?
- ¿Tiene relación la imagen con mi público objetivo?
2. Líneas de Visión
La mayoría de fotografías presentan unas líneas de visión imaginarias que apuntan hacia el mejor emplazamiento para un texto.
Fíjate en esta imagen:
Aunque no se vea claramente la cara del hombre que aparece en la fotografía, es fácil imaginar que está mirando hacia el horizonte que tiene en frente.
Es en ese espacio donde encaja perfectamente la frase ya que el usuario que vea la imagen dirigirá instintivamente su mirada hacia la dirección en la que mira el hombre.
En general, un enunciado se lee más veces cuando la mirada de la figura en la fotografía, ya sea animal o humana, se dirige hacia el texto que está escrito.
Igualmente, se lee más el mensaje cuando la figura señala con la mano hacia la dirección donde está el mensaje. Mira esta imagen por ejemplo:
En cambio, en la siguiente imagen donde la modelo nos está mirando de frente, hacia el objetivo de la cámara, el mensaje queda en segundo plano con menos probabilidades de que sea leído:
Otra característica a tener en cuenta en la composición de la fotografía es la dirección del movimiento del objeto.
Estos dos aviones se dirigen hacia el centro derecho de la imagen y allí precisamente es donde encaja mejor la frase:
Si el título estuviera en el lado izquierdo de la imagen, pasaría desapercibido.
3. Branding
El color es una de las características del branding de una marca que aparece de forma constante en su web y publicaciones en redes sociales.
Un ejemplo es Drybar de productos y accesorios para el cabello. Tanto en su perfil de Instagram como en su web destaca el color amarillo de su branding.
4. Fotografías de peso optimizado
Por experiencia, te aconsejo subir a tu administración de WordPress fotografías de un peso inferior a 50 KB. De esta manera aligerarás la carga de la páginas web optimizando su velocidad.
Existen plugins de WordPress que reducen de forma automática el peso de las imágenes. Y para serte sincera, he probado algunos y no me han acabado de gustar. Así que continuo reduciendo las imágenes manualmente en plataformas como compressjpeg.com/es/ o tinypng.com.
5. Nombre del archivo de la imagen
Las imágenes de sitios web, como sucede con los documentos, llevan un nombre.
No dejes perder la oportunidad de poner la palabra clave en la imagen principal.
La palabra clave va en la etiqueta alt. Ahí también puedes añadir una descripción de la imagen que sirva para la accesibilidad web.
Como utilizo Genesis Blocks, añado la etiqueta alt desde la biblioteca de medios. Si trabajaras con el Editor Clásico, en la misma entrada podrías poner la descripción de esa etiqueta alt.
6. Tamaño de la imagen
El tamaño es mejor que encaje al 100% en el sitio web donde vaya a insertarse.
Por ejemplo, si el espacio es reducido y el tamaño completo de una imagen va a ser de 300×300 px, es preferible que la imagen original guardada en la biblioteca de WordPress sea de ese tamaño exacto.
Esta es una forma de evitar la disminución de la velocidad de carga debido a la adaptación que hace WordPress cuando carga las imágenes.
7. Formato de la imagen
Los formatos más comunes son .jpg y .png. En el primero, las imágenes son de peso menor que en el segundo, aunque algunos aprecian diferencias en calidad a favor de .png.
Luego, archivos .png son los que permiten un fondo transparente, por si quisieras insertar la imagen encima de otro fondo.
Los .jpg se caracterizan porque se cargan progresivamente; al empezar la carga de la web, la imagen aparece borrosa progresando hacia la nitidez completa, característica que en definitiva favorece a una velocidad de carga más ágil.
Las imágenes complementan los textos de una web facilitando la comprensión y una lectura amena.
Existen una serie de pautas recomendables en las imágenes que subas a WordPress.
En este post has visto siete tips de imágenes de sitios web eficaces que te aconsejo sigas a partir de ahora. 🙂
