Los bloques de color podrían ser denominados como la tendencia de los ladrillos y la argamasa en el diseño web. Usar cajas coloreadas con forma cuadrada, o rectangular, o incluso curva, como herramienta web, es el comienzo a la hora de dibujar contenido en cualquier sitio.

La tendencia comenzó en el mundo de la moda. Bolsos, zapatos e incluso suéteres exportaron la tendencia de poner múltiples colores juntos – pero sin patrones – en bloques separados.

Ahora esta tendencia se está desplazando hacia el diseño.

Y los colores que ves podrían no ser precisamente tus favoritos. La tendencia se centra primordialmente en colores luminosos – no verás un beige aquí – y los matices aparentemente no siempre van ligados. (Se refleja mucho la tendencia de la moda). Así que lo que podrías encontrar es una web que use colores pop como el rosa, el naranja y el rojo...todo al mismo tiempo.

Pero funciona – y bien. Esta tendencia de diseño es simple y crea mucho contraste. El efecto visual puede aturdir bastante a los diseñadores que usan el color para guiar a los usuarios a través del sitio. Todo el mundo lo hace de forma ligeramente distinta además: bloques de color sólido, bloque de color para textos o fotos y bloques de colores con un toque de animación sorpresa al poner el ratón encima.

Bloques de Color Sólidos

El uso más común de bloques de color en el diseño web puede ser encontrado en el simple uso de formas geométricas coloreadas y brillantes. Con frecuencia se usan cuadrados, rectángulos, con colores luminosos y bordes sutiles para ayudar a atraer la atención del usuario. Algunos diseñadores están empezando a expandir el alcance de los bloques de colores incluyendo algunas formas como círculos o elementos con bordes más redondeados.

Normalmente estos bloques son de un solo color – sin patrones ni gradientes – pero pueden contener otros elementos como texto, fotos o ilustraciones. El factor común en todos los diferentes estilos de bloques de color es la simplicidad. Los colores son sencillos y brillantes – la tendencia es usar una paleta de colores primarios, o neones, colores altos sin matices. Las formas usadas para los bloques son también simples y carentes de decoración – sin sombreados, efectos 3D, patrones ni múltiples bordes.

Y esta simplicidad es la base del funcionamiento de los bloques de colores. La tendencia es también fácil de construir y desarrollar, y sencilla a ojos de los usuarios. Porque el uso del brillo, de colores distintos, elimina la pregunta de “en qué se fijarán primero los usuarios al llegar a la web”. Las paletas con muchos colores luminosos pueden ser divertidas de crear y usar y los sitios que usen estos esquemas se mostrarán abiertos y a disposición del visitante.

Bloques de Color y Texto

Usar técnicas de bloques de color para destacar el texto es una gran manera de reflejar las palabras más importantes de tu sitio. Funciona usando una fuente que apenas destaque o colocando el texto en bandas de color. Ambas opciones pueden obtener la atención y dirigirla hacia las palabras importantes del sitio web.

Cuando se usa el método del reflejo, hay que considerar usar texto negro con un fondo de color estilo neón para atraer la atención hacia las palabras. Juega con las opciones de ambos, incrementando o reduciendo el brillo en ambos jugando con el contraste. De lo que tienes que estar más pendiente es del tamaño de letra.

Usar bloques de colores como herramienta para destacar la letra funciona mejor con textos grandes, puede ser difícil leer los tamaños más pequeños.

Usar grandes bloques o bandas de color (tramos con color en su comienzo y en su final) puede ser otra efectiva herramienta para llevar la atención hacia el texto. Este tipo de combinación texto/color seduce visualmente y puede ser una gran alternativa en los sitios con carencia de grandes imágenes.

El contraste es una importante consideración cuando trabajamos con colores y texto. Es importante usar el texto y los bloques de colores como diferentes partes de un mismo espectro de colores para que los usuarios puedan ver claramente el color y a la vez leer claramente el texto.

El texto de trazo grueso puede igualmente ser importante cuando se coloca en fondos saturados. Opta por estilos de letra de tamaño que vayan desde el medio-grueso al grueso-pesado para otorgar consistencia a cada letra.

Bloques de color e imágenes

Emparejar bloques de color e imágenes puede ser un desafío pero también puede producir bonitos conceptos de diseño. La clave del éxito en este caso es mantener todo simple – desde la elección de colores, hasta la selección de imágenes o fotos, pasando por su proporción y tamaño.

Trabajar con imágenes y colores que tienen colores complementarios o que contrastan hace que se añada impacto a ambos. Cuando trabajes con bloques de color e imágenes, intenta mantener la colocación del texto así como la elección de fuentes de una manera sencilla. Quieres que los usuarios miren a las imágenes y a los colores antes de que la información se dibuje en la pantalla.

Bloques de color y sorpresas

Uno de los más divertidos efectos de bloques de color es usarlos para crear un atisbo de sorpresa. Dos de los mejores ejemplos se muestran sobre estas líneas, pero debes visitar los sitios para captar realmente la esencia del asunto. El concepto es simple, clickea en un bloque de color y a veces ocurren cosas.

En la página de Landor, clickeas en los bloques grises que cambian a un color pop con información textual en su interior. Lo que realmente hace que esta técnica de color de bloques funcione es que obtienes un color pop cada vez que lo haces. Las cajas grises van cambiando sus colores de forma distinta, enfatizando el brillo y el pensamiento de algo divertido.

La sorpresa es un poco diferente y más sutil en el sitio de Kyle Speed – cuando haces “hover” sobre un bloque de color de los que están situados por debajo, los colores se hacen más vibrantes. Esto añade énfasis en el lugar de la pantalla en el que el usuario está centrando su atención leyendo el texto que está dentro del bloque.

Conclusión

Lo que realmente conduce la tendencia de los bloques de color son los colores altos, el diseño con “energía”.
Cuando se ejecuta apropiadamente, el efecto es sencillo pero crea un fuerte interés visual. Bloques de color contrastan con las áreas sin color (o negras) para centrar la atención de los usuarios.
Aunque esté de moda ahora, esta técnica de diseño tiene pinta de establecerse durante mucho tiempo, dada su simplicidad y su atractivo universal.

Carrie Cousins
Fuente