Las fotografías se han convertido en un elemento común en todo sitio web, de hecho, en ciertos sitios se considera esencial como en tiendas online, por ejemplo. Pero las fotografías no sólo sirven para mostrar el producto, sino también pueden ayudarte a conectar emocionalmente con tu público objetivo. Y esta es la principal razón por la que las fotografías se usan ampliamente en el campo del diseño web.
Ya que las fotografías formarán gran parte de cualquier diseño de interfaz web que crees, vemos necesario que tengas en cuenta algunas de las técnicas comunes que se suelen utilizar al trabajar con fotografías en un diseño de interfaz web.
Uso de Hero Images
Las hero images son de uso común en una gran variedad de sitios web ya que pueden captar la atención de los visitantes de manera inmediata. De hecho, colocar una fotografía tomada por profesionales puede ser una gran forma captar el interés de tus visitantes, por lo que diversas tendencias centradas en el uso de imágenes son de uso común hoy en día.
Las imágenes que ocupan todo el ancho de la pantalla suelen ser bastante atractivas para los visitantes y es una de las técnicas de uso de fotografías más comunes que se puede apreciar en el diseño de interfaz web. Esta fotografía en gran tamaño usualmente va acompañada de texto, opciones de navegación y botones de llamada a la acción.
Hay diversos usos que puedes darle a las Hero Images, todo depende del layout que tengas en mente para tu sitio. Ya que es una tendencia web actual, te listamos algunas pautas para que uses Hero Images:
- Fotografía: Uno de los retos de emplear Hero Images es que la composición luzca igual en diversos dispositivos. En pantallas más pequeñas la imagen deberá ser recortada, pero el punto de enfoque que se mantiene en los ordenadores debe ser el mismo que en pantallas móviles.
- Texto: Ya que la fotografía va a ser en enfoque del sitio, deberás emplear una frase corta, pero poderosa. La fuente que elijas debe ir acorde a la personalidad de la marca y el mensaje que estés intentando transmitir con la frase seleccionada. Asimismo, te en cuenta la posición del texto de modo que no irrumpa en puntos de enfoque de la fotografía.
- Botones de acción: Al igual que el texto, la posición de los botones de acción es esencial. No deben interrumpir la lectura visual ni ser vistos como estorbos en los puntos de enfoque de la fotografía. Una de las soluciones perfectas a este dilema es optar por ghost buttons, ya que contienen transparencias pueden ser colocados en diversas zonas de la fotografía sin ser una molestia.
Colage de imágenes más pequeñas
Si bien las imágenes en gran tamaño son bastante populares en el diseño web en la actualidad, no hay razón para ir contra la corriente y optar por otras opciones. Puedes usar fotografías más pequeñas y hacer un colage para formar una composición interesante. También puedes colocar estas fotografías en sucesión en un slider. Es una técnica realmente popular cuando se trata de tiendas online o incluso en sitios web de aplicaciones.
La tarea se complica un poco cuando en vez de hallar un fotografía, son varias. Si quieres hacer una composición ordenada deberás asegurarte de recortar cada fotografía de igual manera para que tengan las misma dimensiones. Asimismo, es importante que las fotografías tengan cierto vínculo la una con la otra, no hablamos necesariamente de que las fotografías hayan sido tomadas en ráfaga, sino que debe existir un elemento que las una. Podría ser el tema, el color, los personajes, etc. En estos casos, incluso el título podría ser de ayuda. Si toda tu contenido se encuentra redactando manteniendo un mismo tono, ayudará a mantener la unidad en la serie de fotografías.
Acompañada de fuentes manuscritas
La tipografía manuscrita suele ser una opción común para títulos, no sólo porque en estas secciones se puede usarla en un puntaje mayor que no genera problemas de legibilidad, sino también porque le añade cierto toque único y personal a la marca.
Ya que la categoría de fuentes manuscritas es bastante diversa, puedes encontrar todo tipo de tipografías, desde las comunes que parecen haber sido escritas por algún conocido hasta aquellas que parecen haber sido hechas con los dedos. Este tipo de fuentes es perfecta para poder crear cierto ambiente y si se adapta al estilo de la marca, te animamos a que vayas por ello.
Dependiendo de la fuente que elijas puedes cambiar drásticamente la intención y el mensaje de la marca, así que asegúrate de emplear una fuente manuscrita que realmente se adapte a la marca.
Composición con objetos asociados a la marca
Algunas marcas deciden optar por una ruta que quizá sea más complicada, pero más provechosa: toman fotografías de producto reales, de manera que desde el inicio el visitante puede relacionarse con la marca y sentirla más auténtica. Aunque es una técnica que se ve a menudo en tiendas online, puede funcionar en diversos sitios web como en agencias creativas. En vez de colocar una fotografía típica, podrías involucrar a los miembros de equipo y hacer una sesión dentro de las oficinas o incluso tomar fotografías de los bocetos o parte del proceso creativo que realizan. También puede ser bastante efectiva en restaurantes ya que muestras las instalaciones y los ambientes que posee el local, así como los platos que se preparan.
Esta técnica es bastante efectiva para darle un toque humano y auténtico al sitio web, de modo que los visitantes sientan que hay algo diferente o distinto acerca de ese sitio y en el campo del diseño web, diferenciarse es estar por delante de los demás.
Conversión a escala de grises
No todas las imágenes a color pueden generar el impacto esperado, a menudo añadir cierto efecto a tus fotografías puede ser la respuesta para lograr una reacción positiva por parte de tus usuarios.
A veces, modificar el encuadre de la fotografía podría ser efectivo. Pero adicionalmente a esta simple edición podrías considerar modificar los colores de la fotografía. Una de las modificaciones más populares es cambiar la imagen a blanco y negro. El proceso es bastante sencillo y programas sofisticados como Photoshop lo pueden hacer automáticamente, aunque también existe un método que te permite un mayor control sobre el resultado final y podría ser más adecuado si estás buscando llamar la atención de tus visitantes mediante la fotografía.
No es necesario que toda la fotografía se encuentre en blanco y negro, puedes destacar un elemento de la misma manteniendo el color de dicho elemento. Aunque a menudo se prefiere dejar toda la fotografía en blanco y negro ya que se le añaden otros elementos del sitio web como la barra de menú, el título, botones de llamada a la acción, etc. Si el fondo se encuentra en escala de grises, entonces todos estos elementos pueden destacar.
Aplicación de filtros de color
Otro efecto interesante para tus fotografías podría ser la aplicación de un filtro de color. Es una modificación sencilla de realizar que permitirá que las fotografías realmente se diferencien de los otros elementos de la interfaz. Sirve, además, para destacar la cabecera y ya que se puede adaptar a cualquier paleta de colores es un efecto bastante popular que emplean diversas marcas. De esta manera, puedes reforzar la personalidad de la marca no sólo mediante la fotografía, sino también crear cierto ambiente desde el primer pantallazo.
La aplicación de un filtro de color en tus fotografías posee muchos beneficios que seguramente podrías aprovechar.
En conclusión…
Independientemente de la técnica que consideres apropiada para tu sitio, debes asegurarte de elegir fotografías que realmente vayan acorde con la marca. Encontrarlas no será una tarea sencilla, particularmente si usas bancos de imágenes gratuitas, pero existen diversas modificaciones que puedes realizar a las fotografías para que se adapten a la marca. Si decides tomar las fotografías por ti mismo, elige un encuadre apropiado y ten cuidado con la iluminación.
