"El uso de los colores en la Web"

El uso de los colores en la Web


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.
Relación entre colores:

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

Colores Análogos: Para un color dado, sus colores análogos son aquellos que se encuentran a ambos lados del mismo en el círculo de color. los Adyacentes: Dado un color, sus complementarios adyacentes son los colores análogos de su color complementario. Dos colores complementarios adyacentes del rojo "red" serían por ejemplo el verde primavera "springgreen" y el azul cielo "skyblue".

• 1. El Contraste entre colores:
     Buscandlo una definición intuitiva, podemos simplificar y decir que 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
     • Crominancia
     
     
     
     
     1. 4.1 Contraste de Tono: Está relacionado directamente con las distancias entre dos colores dentro del Círculo Estándar de Color descritas en el apartado

   3. Relación entre colores. así, cuanta mayor es la distancia entre dos colores dentro del círculo, mayor es el contraste entre ambos.Entonces, una pareja de colores complementarios produce el máximo contraste, mientras que para cualquier color el que menor contraste produce con este es su adyacente.
   Es interesante el contraste ce tono entre colores fríos y cálidos. Los colores cálidos siempre aparecen al espectador más próximos, mientras que los colores fríos aparecen al espectador más distantes.En una página web será más conveniente utilizar colores fríos para marcos, tapices o elementos secundarios y colores calientes para menús, iconos o barras de herramientas que queramos que el usuario siempre tenga presente.Para la relación texto y background normalmente no será suficiente cfontraste de tono ya que no garantizará legibilidad suficiente. Será necesario aplicar algún tipo de contraste adicional.
  

  1. 1. 4.2 Contraste de Luminancia (o de Valor): Permite crear grandes contrastes con el mismo tono de color sólo mediante el brillo de luz:
        
        En general este tipo de contraste, aún siendo grande, es agradable al ojo humano, con lo que usarlo en diseños web suele ser trabajar sobre seguro. Como contrapartida, no arriesgar en la combinación de tonos, puede significar apostar por un diseño convencional, poco impactante.
        
        
     2. 4.3 Contraste de Saturación: El contraste de saturación con frecuencia es el más adecuado para resaltar aspectos de la página web de una forma moderada, poco estridente.
        
        Un efecto interesante se obtiene utilizando áreas con diferentes saturaciones con un fondo gris: se produce una sensación de transparencia que puede ser muy apropiada en ciertas circunstancias.
        
        
     3. 4.4 Contraste Simultáneo: Es un efecto creado por nuestro sistema visual que, dado un color predominante, tiende a requerir su color complementario.
        
        Este efecto puede obtenerse combinando dos colores brillantes pero que no sean complementarios, o, simplemente, utilizando un color brillante sobre un background neutro (un color de la gama de los grises).
        Este tipo de contraste tiene la ventaja de resaltar diferencias entre áreas de forma impactante, pero sin la agresividad que producen los complementarios. Sin embargo puede provocar tensión e inestabilidad y debe utilizarse con prudencia.
        
        
     4. 4.5 Combinación de contrastes: Es lo más frecuente, sobre todo cuando se trata de resaltar textos.
        

        
        

        En este caso se ha utilizado un Contraste de Tono, poniendo un lienzo violeta y el texto en turquesa, que es complementario adyacente del primero, por lo que la combinación debería aportar suficiente contraste de color.
        Sin embargo, vemos que para el caso de textos, no es así: la combinación no aporta suficiente contraste y leer el texto cansa la vista (sobre todo si fuera un párrafo largo). Aunque la mezcla es natural y no es desagradable, no es adecuada para textos.

        
        

        En este segundo caso, al contraste de color inicial le hemos añadido Contraste de Luminancia, oscureciendo el background e iluminando el foreground. La combinación de ambos contrastes aumenta sensiblemente la legibilidad del texto.Sin embargo, invertir las relaciones naturales entre colores no funciona. Aportando contraste de luminancia y de saturación simultáneamente conseguimos oscurecer el turquesa y aclarar el crimson pero, aunque consiguieramos suficiente contraste para resaltar el texto (que vemos que no es el caso), la vista no se sentiría cómoda ante la mezcla.
        
        
  2. Los colores y el texto:
     
     Como acabamos de comentar usar convenientemente el contraste es especialmente importante cuando se trata de escribir texto y resaltarlo suficientemente para garantizar su legibilidad a la totalidad de nuestros usuarios.
     Pero no sólo es una cuestión de contraste. Hay combinaciones de colores que:
     • Son especialmente conflictivas para usuarios con disfunciones en la vista
     
     
  3. Ceguera al color:
     Hay múltiples tipos , como describimos en nuestra página de los 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, etc., y biceversa. Independiente de la luminosidad o saturación de los colores.