Uso de Colores en la Web

Esto es primordial al definir las líneas maestras de diseño de un Web Site, va a tener gran influencia en como lo perciban los usuarios y la sensación que les quede después de la visita. Cada uno puede aceptar mejor o peor determinadas combinaciones de colores. Sin embargo existen criterios objetivos si se quiere obtener un diseño equilibrado y agradable y sobre todo, que ni estrese ni canse.

¿Cuántos Colores utilizar?

Es arriesgado establecer una norma estricta, ya que 6 colores simultáneos en una página pueden ser demasiados si existe un gran contraste entre ellos, pero pueden conformar una combinación agradable si la relación entre los mismos es adecuada. Puede asegurarse que siempre es mejor pocos colores que muchos. Se puede afirmar que 3 colores en una misma página sería lo mínimo a utilizar y, en la mayoría de casos, debiera ser suficiente. Con menos de 3, las posibilidades de que la página sea aburrida son muy grandes. 

- Color Primario: es el tono básico de la página, el que la define, y el que ocupa la gran mayoría de la misma. Sería el color del atributo "background" de la página. 

- Color Secundario: es el segundo tono predominante en la página, aunque en mucha menor medida que el primario. Normalmente debe acotar o resaltar áreas y debe ser bastante próximo en tono al primario. 

- Color Destacado: es el color que se utiliza para resaltar aspectos concretos de la página. Por definición debe contrastar mucho con los colores primario y secundario y, por tanto, debe utilizarse con moderación. Puede utilizarse el Complementario o el Complementario Escindido del color primario de la página.

¿Cuál debe ser la Relación entre los Colores?

Según su posición en el Círculo Estándar de Color, pueden ser: 

1-Colores Análogos: aquellos que se encuentran a ambos lados del mismo en el círculo de color.

2-Colores Complementarios: aquellos que se encuentran opuestos en el círculo de color.

3-Colores Monocromáticos: aquellos que se encuentran aislados, sin presencia de otros colores. Usados producen sensación de unidad, homogeneidad y robustez. Se puede evitar la monotonía utilizándolos con diferente luminosidad (más claros y más oscuros).

4-Colores Complementarios Adyacentes: Dado un color, sus complementarios adyacentes son los colores análogos de su color complementario. El uso de estos  aporta un alto nivel de contraste, sin llegar al extremo.

5-Colores Triada: Tres colores constituyen una Triada cuando sus tonos son equidistantes en el Círculo de Color. Suele ser una buena solución cuando se desea un diseño colorido, ya que la mezcla estará bien balanceada. Si el conjunto resulta demasiado colorido para nuestras necesidades, siempre se pueden apagar un poco los colores disminuyendo su luminosidad o su saturación (o ambas).

6- Esquema Cromático Monotono: lo constituyen un único tono de color junto a sus posibles variaciones en términos de tintes, luminosidad y saturación. Suele ser una buena solución si se desea un diseño robusto y homogéneo pero con las diferenciaciones y resaltes necesarios. En el caso probable se sensación de monotonía, siempre es una buena solución introducir negro y blanco.

7-Esquema Acromático Monotono: es un caso particular del esquema de color monotono constituído sólo por colores neutros dentro de la gama del negro al blanco. Suele ser un esquema eficaz al diseñar los distintos componentes de la página web, pero con seguridad resultará aburrido. Una buena solución es introducir un color resaltado.

¿Cómo Debe ser el Contraste entre Colores?

El contraste entre dos colores, es la diferencia que hay entre ambos. El contraste será mayor cuanto mayores sean las diferencias entre ambos en términos de: Tono, Luminancia y Crominancia.

En primer lugar será importante que exita un gran contraste entre el testo ordinario y el "background". Sin embargo habrá que tener sumo cuidado en no caer en estridencias que generalmente son tomadas como inmadurez o falta de profesionalidad.

Esta misma recomendación es aplicable cuando elegimos colores para resaltar o separar áreas de contenidos: aquí es menos necesario y abusar de él puede ser aún más perjudicial.

En el segundo caso la gran luninosidad de ambos colores, y en especial la del verde, hace que el contraste sea demasido grande y la combinación resulte agresiva.

La Teoría del Color define muchos tipos de contraste y, aunque algunos no son especialmente aplicables a páginas web, es muy interesante conocerlos para profundizar en el conocimiento del efecto de los colores.

-Contraste de Tono: Está relacionado directamente con las distancias entre dos colores dentro del Círculo Estándar de Color, cuanta mayor es la distancia entre dos colores dentro del círculo, mayor es el contraste entre ambos.

-Contraste de Valor: Permite crear grandes contrastes con el mismo tono de color sólo mediante el brillo de luz.

-Contraste de Saturación: Es el más adecuado para resaltar aspectos de la página web de una forma moderada, poco estridente. 

-Contraste Simultáneo: Es un efecto creado por nuestro sistema visual que, dado un color predominante, tiende a requerir su color complementario. 

¿Ceguera al Color?

Hay múltiples tipos de disfunciones en la visualización de colores. Sin embargo a efectos de accesibilidad sólo necesitamos preocuparnos de los daltónicos, grupo que constituye la inmensa mayoría de los que sufren alteraciones en la percepción del color. Pensando en ellos, deberemos tratar de evitar siempre las combinaciones de texto en cualquiera de las variedades del verde sobre fondos rojizos, áreas con motivos en este color predominante, y viceversa. Independiente de la luminosidad o saturación de los colores.