Estás en Inicio > Manual de Diseño Web > Empleo del color en el…
disenador-web-autonomo

Empleo del color en el diseño de páginas web



Imaginemos por un instante que en este momento nos estamos conectando a la web y comenzamos nuestra navegación abriendo una página web. ¿Cuál es la primera impresión que recibe nuestro cerebro de los órganos sensibles a la luz, nuestros ojos? La respuesta será casi inmediata: el color. Mucho antes de que nuestra mente comience a descifrar los contenidos que tiene la página, lo primero que se percibe es una sensación a través del color.

El color tiene el poder de transmitir sensaciones. Es sabido que los rojos, amarillos y naranjas resultan estimulantes e inclusive irritantes, mientras que los verdes y los azules brindan una sensación de tranquilidad y sosiego. Es por esta razón que los diseñadores web emplean las diferentes combinaciones de colores (en adelante denominaremos paleta de colores) para que sean el complemento del mensaje que los contenidos de la página.

La adecuación de la paleta de colores al mensaje que la página debe transmitir a sus usuarios es una de las claves del éxito de cualquier diseño. Los usuarios de internet dedican muy poco tiempo a decidir si se quedan o no en una página, por lo que esta primera impresión resulta fundamental.

 

¿Qué es el color?

Nuestro cerebro tiene la capacidad de recibir las señales que le envían los ojos, cuya función es recibir la luz que llega del entorno. Los diferentes materiales tienen la capacidad de reflejar y absorber diferentes colores (que en definitiva son diferentes longitudes de onda) y los reflejos de los materiales estimulan los terminales nerviosos de nuestros ojos que es lo que nuestro cerebro recibe.
 
Así por ejemplo, cuando un material no refleja ninguno de los colores, nosotros percibimos el color negro; por el contrario, cuando un material refleja todos o casi todos los colores, tenemos la percepción del color blanco. Cuando un cuerpo absorbe los colores rojos y azules, lo vemos de color verde; cuando un cuerpo absorbe los colores verdes y azules, lo vemos rojo. Los diferentes grados de reflexión de los colores de la luz por parte de los materiales son los que nos dan los diferentes matices.

 

Combinación de colores

Cuando un objeto o figura de un color dado se encuentra en contacto con otro objeto de color diferente, se produce lo que llamamos combinación de colores. En el diseño web, el contraste entre los diferentes colores empleados para decorar y los colores propios de las imágenes, resulta determinante a la hora de definir la estética de la página.

Las propiedades de los colores (luminosidad, valor, temperatura y saturación), hace que haya muchas variedades de colores y, por ende, muchas posibilidades de combinaciones y contrastes.

El contraste entre elementos con diferencias en la luminosidad de los colores, puede verse muy claramente en la combinación del color blanco con el negro, ya que estos son los extremos de la luminosidad. El contraste por luminosidad es uno de los más empleados en el diseño de páginas web, fundamentalmente en el destaque de los textos sobre el fondo sobre el que se colocan. En la siguiente figura, podremos apreciar combinación de colores cuya diferencia radica en la luminosidad.

Contraste de color
 
También es posible emplear los demás tipos de contrastes de colores, como los contrastes por el valor, por la saturación, etc. Cuando el contraste se produce entre colores complementarios, las diferencias son muy nítidas, aunque las diferencias que se producen son extremas, lo que hace que debamos emplear este tipo de contraste de color con sumo cuidado, porque se pueden producir estridencias que pueden dar problemas estéticos importantes al diseño en su conjunto.

Mal contraste de colores Contraste de color

Hasta hace unos años, era frecuente encontrar diseños web en los que se empleaba una combinación de colores seleccionados de una paleta muy exigua, de apenas 256 colores, dada la tecnología que se empleaba para formar colores en los monitores. Con el avance tecnológico de los últimos años, esto se ha resuelto y los diferentes hardware y software pueden crear e interpretar una gama de colores de varios millones de ellos, lo que permite una gran libertad a los diseñadores web.

 

Ejemplos de utilización de colores

Las combinaciones que se pueden hacer entre los muchos colores para decorar la página y alentar a los posibles usuarios a quedarse en ella son muchas. Sin embargo, los estudios indican que a las personas les gustan ciertas combinaciones más que otras.

Así como en los restos de los elementos de una página web, el diseñador debe tener presente el tipo de público al que va dirigida la página para definir la combinación de colores que predominará en su página

El ejemplo que sigue es sencillo de ver que se quiso dar una combinación tal que diera sensación de formalidad, elegancia y modernidad. La formalidad está dada en los colores por la falta de colores cálidos, que brindan por lo general, sensaciones más informales. La elegancia del blanco del encabezamiento y la tipografía. La modernidad está ejemplificada por el empleo del azul, que no es un azul opaco ni oscuro. Por el contrario, tiene una tendencia a ser brillante. Aquí también podemos ver que la combinación de colores empleados es de un contraste muy elevado, lo que permite destacar los contenidos escritos por encima de otros elementos, lo que nos indica claramente que el principal contenido de la página son sus textos.

Ejemplo de contraste de colores

En la siguiente página, tiene una paleta de colores suaves y pastel, cuya finalidad es la de brindar a los visitantes una sensación de placidez, comodidad y familiaridad. Observemos la escasa cantidad de colores cálidos. Por el contrario, los colores empleados en abundancia son los azules claros y los verdes.

Ejemplo de contraste de colores

Muy por el contrario, en la siguiente página podemos apreciar que casi la totalidad del diseño está dominado por uno de los colores cálidos: el naranja. Esta es una página de alto impacto visual. La intensión es sorprender (y vaya si lo logra) al visitante, dándole además un aspecto audaz, atrevido y trasgresor. El altísimo contraste hace que cada uno de los elementos componentes de la página se encuentren perfectamente definidos, haciendo muy sencilla su visibilidad.

Ejemplo de contraste de colores

Como  puede verse, la combinación de colores en la página web está íntimamente ligada a los fines que se persiguen con la misma y los efectos que se pretende ocasionar al visitante. De la elección de la paleta de colores y del buen uso que se haga de ella, depende en gran medida el éxito del diseño.






Artículos Relacionados
El contraste en el diseño web
Se llama contraste a las diferencias que existen entre dos elementos relacionados y es uno...
Guías de navegación en la web
Como empezar una web. Guías de navegación: ¿cómo averiguo dónde estoy? Esta cuestión es tan...
Simbolismo de los colores y su uso en el diseño web
El diseñador de páginas web debe tener en cuenta que el color es mucho más...
¿Cómo organizar una web?
Como empezar una web: ¿Cómo organizar el sitio? Parte del problema con la Web hoy...

Artículo creado el 13/01/10
Última Actualización: 27/01/10

Autor y licencia

Licencia: Contenido exclusivo de LaWebera.es. Prohibida su copia.

Autor: Andrés Fernández
URL: LaWebera.es :: Diseño Web



2 Comentarios para “Empleo del color en el diseño de páginas web”

Enlaces a esta entrada


Publicar un comentario