Los colores web son los colores que muestra cada pixel en una pantalla. Son los colores de la luz y suelen estar basados en modelos de color RGB (Red, Green, Blue) donde los colores primarios son el Rojo, Verde y Azul.
La adición de los tres colores primarios saturados produce el blanco. Se llama síntesis aditiva porque es una suma de colores. El color negro es la ausencia de luz.
Los colores secundarios se obtienen por la adición de los colores lumínicos primarios:
Podemos representar los colores web usando el modelo RGB, con valores hexadecimales de dos dígitos:
#RRGGBB
Los dos dígitos RR son el valor del componente rojo, los GG el valor del verde y los BB el valor del azul.
Los valores hexadecimales que podemos asignar a cada dígito van desde el 0 hasta la letra f (16 valores). El cero es ausencia de luz y la f el valor máximo.
Asignando valores a los dígitos correspondientes obtenemos los colores primarios y secundarios de la siguiente manera:
ROJO: #ff0000
VERDE: #00ff00
AZUL: #0000ff
Amarillo: #ffff00
Cyan: #00ffff
Magenta: #ff00ff
Para una mayor accesibilidad no se recomienda el uso de colores puros sino mezclados, es decir, con valores en cada uno de los tres canales: rojo, verde y azul.
Podemos aplicar el color deseado en nuestra web añadiendo el codigo Hexadecimal a las etiquetas HTML, de la siguiente manera:
<h3 style="color: #990033;">Título de tercer nivel</h3>
En este ejemplo aplicamos el color rojo institucional UCM #990033 al texto de un encabezado: etiqueta h3.
Para aplicar color de fondo tenemos que añadir la propiedad background-color. Cada propiedad debe ir separada por "punto y coma" y acabar en "punto y coma".
En el Manual de estilo Web podemos encontrar los colores y tipografía UCM, cuyo uso sirve para homogeneizar los estilos y mantener la consistencia web UCM.
El color, el formato, el uso de formas e iconos, la tipografía y las imágenes se deben combinan para crear una impresión global de una página como "perteneciente" a la web donde se encuentra.
El uso de contraste y color es vital para la accesibilidad.
El contraste es una medida de la diferencia en la "luminancia" o brillo percibido entre dos colores. Esta diferencia de brillo se expresa como una relación que varía de 1:1 a 21:1.
Nuestra web requiere el cumplimiento del nivel AA de las Pautas de Accesibilidad de Contenido Web, WCAG 2.1 (Web Content Accessibility Guidelines)
Según los criterios de conformidad, para cumplir las Pautas se requieren los siguientes ratios mínimos de contraste:
Podemos comprobar si nuestros colores cumplen con los niveles de contraste establecidos introduciendo sus valores hexadecimales en chequeadores de accesibilidad de colores web:
Existe un porcentaje de la población con problemas para percibir los colores (un 8% en los varones y un 1% en las mujeres) y no es tratable.
La ceguera al color, el daltonismo y otros trastornos similares, hacen que la persona no perciba ni distinga los colores de la misma manera que la mayor parte de la población. En algunos casos el usuario no puede distinguir cierto grupo de colores, o no es capaz de distinguir los matices y las sombras dentro de un color. En casos más extremos la visión es totalmente monocromática, en blanco y negro.
La principales recomendaciones son:
