comparte el articulo 

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

Actualizado el 13/01/2010 < > 3 Cometarios

Resumen: 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 de una página 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 y cómo lo percibimos?

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

En 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, los cuales brindan por lo general sensaciones más informales. La elegancia del blanco del encabezamiento y la tipografía también contribuyen a crear este efecto.

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.Uso de degradados, simulación de metalizados, etc.

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.

Ejemplo de contraste de colores

El siguiente ejemplo, 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 intenció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

Conclusión

Como  puede verse, la combinación de colores en las páginas web está íntimamente ligada a los fines que se persiguen con las mismas 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.

Publicado el 13/01/2010, última actualización 13/01/2010.

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

Autor: Verónica Milán y Andrés Fernández

URL: LaWebera.es :: Diseño Web

Añadir Comentario (Subir al texto)

3 Cometarios

  1. Simbolismo de los colores y su uso en el diseño web

    […] diseñador de páginas web debe tener en cuenta que el color es mucho más que un elemento decorativo. En el diseño web, siempre se debe pensar que la […]

    Viernes, 22 de enero 2010

  2. El uso de menús en nuestro sitio web y su influencia en la navegación

    […] También podemos irle dando estilo a nuestro menú agregando atributos como fuentes y colores. […]

    Martes, 2 de marzo 2010

  3. diseño web cordoba

    La eleccion del codigo cromatico, es un paso crucial a la hora de realizar cualquier proyecto de diseño, un articulo muy indicado para quien se inicie en con el diseño en general.

    Martes, 23 de octubre 2012

(Subir al texto)

Añadir Comentario

* Campos obligatorios

Meneame Bitacoras