6 Consejos para crear Composiciones de Imagen y Texto

El uso de combinaciones de texto e imágenes es mucho más habitual de lo que puede parecer. Lo primero que nos llega a la cabeza pueden ser los típicos banner de publicidad de productos, pero va mucho más allá. Puede servir para posicionar tu logotipo en la cabecera de tu web con tu fotografía favorita. O para enviar un mensaje de una forma más visual a tus usuarios o clientes.

Y aunque en un primer momento pueda parecer algo sencillo, para que realmente funcione hay que tener en cuenta diferentes variables. Porque un mal uso de esta combinación puede hacer que nuestro logo no sea legible. O que el mensaje que queramos trasmitir no llegue de forma correcta. Aparte de que, si entramos en el aspecto visual, queramos conseguir una disposición de imagen y texto agradable a la vista.

Por estos motivos, nos lanzamos a hacer este artículo. Porque seguro que habéis visto combinaciones de texto y fotografías que no cumplían su función. Con todo lo que ello supone para nuestra marca personal, o para nuestra empresa.

Además de los consejos que queremos enseñaros en esta ocasión, no queremos olvidarnos de recomendaros otros artículos que hemos visto anteriormente en Silo Creativo. Por ejemplo, el texto que dedicamos en exclusiva a la regla de tercios y su aplicación, tanto en diseño gráfico como en diseño web. O aquel en que que dimos algunos principios con los que mejorar nuestros diseños, con ejemplos prácticos del mundo de la publicidad, el cine o el arte.

Para hacer este artículo hemos hecho uso del catálogo de fotografía disponible en Unplash. Unplash es un repositorio gratuito de fotografías, con más de medio millón de imágenes, todas ellas de gran calidad.

Y como no todo es las imágenes que vayamos a usar, también es importante tanto el texto como el tipo de fuente que elijamos. Os recomendamos que echéis un vistazo a alguno de los artículos que tenemos sobre nuestras tipografías favoritas. O también sobre las mejores combinaciones de fuentes, si tenemos pensados diferentes niveles de texto. Aunque si prefieres rebuscar entre colecciones de tipografías, siempre puede ir a Google Fonts, donde encontrarás cientos de ellos, todas de uso gratuito.

Sin más, vamos a meternos de lleno en nuestras recomendaciones. Este listado es mucho más amplio, pero queremos mostraros algunas de las más interesantes y fáciles de aplicar.

Pon un toque de color en tu texto

texto color destacado
Photo by Pierre Châtel-Innocenti on Unsplash

Añadir un color diferentes a ciertas palabras del texto puede funcionar de dos formas distintas. Si usamos un color opuesto al del fondo, le estamos dando mucha importancia a esa palabra

, dándole al fondo una protagonismo muy secundario.

Mientras que si decidimos poner un tono parejo al del fondo, dotamos al conjunto de mucha suavidad, dando un aspecto más amable y compensado entre todos los elementos de nuestra composición.

Desenfoca el fondo de tu imagen

desenfoque texto fondo
Photo by Tikkho Maciel on Unsplash

De las más sencillas de realizar. Damos importancia al texto aplicando un desenfoque a la imagen. Jugando con estas variables, podemos dar lugar a varios escenarios. Por una parte, una fotografía totalmente desenfocada, donde el punto de interés es el propio texto. O por otra, que los únicos objetos enfocados sean el texto y un único algún componente de la imagen.

Este último caso suele darse cuando, por ejemplo, en banner de publicidad, cuando lo interesante es dar importancia a una única pieza, y al texto que la acompaña. Aunque podemos aplicarla en diferentes circunstancias.

Dale un tintado de color a tu imagen

degradado color fondo
Photo by Fabien Bazanegue on Unsplash

Aunque es difícil de encontrar su punto intermedio, una vez que lo consigamos, este efecto es de los más estimulantes. Y es que hay que lograr un equilibrio entre que se note el color que estemos usando, que se vea la fotografía de fondo, y que el contraste con el texto sea suficiente. Pero cuando lo consigamos, el resultado es espectacular. Muy recomendable usar con el color de nuestra marca.

Si queremos ir un paso más allá, podemos pasar de un color plano a un gradiente. Y es que los gradientes son una de las tendencias en el diseño de este año. Eso si, estudia bien los colores a combinar para que tu composición tenga un aspecto agradable.

Añade contraste entre texto e imagen

contraste texto imagen
Photo by Kinga Cichewicz on Unsplash

Uno de los aspectos a tener en cuenta es que nuestro texto sea legible. Esto lo conseguiremos si el color de nuestro texto es lo suficientemente contrastado con respecto al fondo. Además, con esto nos aseguramos que las personas con algún déficit visual tengan problemas el ver nuestras composiciones. Al respecto de esto, la accesibilidad es un tema que siempre deberíamos tener en cuenta, tal y como te contamos en uno de nuestros artículos.

Y con contraste no solo nos referimos a la diferencia de color, sino también a su tamaño. Una fuente muy pequeña puede resultar ilegible o pasar desapercibida. Al igual que un texto que tenga una tipografía muy fina. Si nuestro texto no se lee, no será capaz de transmitir su mensaje.

Haz que el texto sea parte de la imagen

texto oculto imagen
Photo by Mousum De on Unsplash

De esta lista, quizás sea el punto que más me gusta. Porque no es simplemente colocar el texto y fin. Hay que analizar la fotografía y todos sus elementos, descubrir los diferentes planos y colores. Y desde este punto, ver como podemos encajar el texto dentro de la imagen.

Uno de mis ejemplos favoritos son los títulos de inicio de Panic Room, de David Fincher. En el vídeo, podemos ver como la tipografía, recreada digitalmente sobre el plano de la ciudad, toma las perspectivas de la imagen, se refleja en los edificios, o da sombra a los viandantes. Es un elemento externo que forma parte del fondo.

Enmarca tu texto

cuadro texto importancia
Photo by Becca Tarter on Unsplash

En algunas ocasiones nos enfrentamos con una fotografía con multitud de colores, donde es complicado hacer que nuestro texto resalte. Por lo que una de las opciones que tenemos es, además una de las más sencillas. Y no es mas que colocar una forma de color justo debajo del texto.

No nos llevemos a engaño con el título que hemos puesto. Esta forma no tiene porque ser necesariamente rectangular. Podemos hacer un círculo u otra forma poligonal. Y si notamos que el contraste es demasiado grande, siempre tenemos la opción de dotar a esta forma de cierta transparencia para que muestre un poco el fondo, y se integre algo mejor en la composición general.

Como veis, las opciones son múltiples. Combinadas con nuestros conocimientos previos que tenemos sobre encuadres y tipografías, harán que nuestras imágenes con texto sean mucho más atractivas y visuales.

Como siempre, tenéis abiertos los comentarios para cualquier apreciación que queráis decirnos. O si tenéis alguna otra idea sobre combinación de imagen y texto que sepáis, nos la podéis comentar y las añadimos al artículo!

Comentarios (5)

  1. Que herramienta online o descarga recomiendas para realizara de manera práctica las composiciones de imagen y texto. Saludos…

    1. La más conocida y usada posiblemente sea Photoshop, aunque actualmente uso Affinity Photo, que cumple ampliamente con mis necesidades. Ambas son de pago, Photoshop con un modelos de Suscripción, y Affinity Photo mediante el pago de licencia de por vida.

      Si nos vamos a herramientas gratuitas, tienes Gimp o Krita, que son OpenSource, o Paint.net.

      Todas las que he listado son para instalar en tu equipo de trabajo. Sobre las disponibles como aplicaciones web, las más usadas son Pixlr Editor y Photoshop Express Editor. Aunque personalmente, prefiero instalar estas aplicaciones de forma nativa en mi equipo de trabajo, ya que la mayoría de estas herramientas web tienes menos opciones que sus versiones de sobremesa, y no estan tan optimizadas.

      Espero que te haya servido de ayuda. Y gracias por comentar!

  2. Hola, ante todo muchas gracias por la información. Yo estoy buscando un banco de imágenes gratuitas pero que sean dibujos o vectores para luego editar en photoshop. Gracias

Deja una respuesta

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