Para verificar el contraste de las imágenes se puede utilizar la aplicación Colour Contrast Analyser. Esta herramienta permite seleccionar dos colores utilizados en una imagen para ver su contraste. Una vez escogidos dos colores nos dará el contraste o ratio de luminosidad existente entre ambos. Como ya hemos comentado anteriormente hay que validar el contraste del texto y el contraste de los objetos gráficos que trasmiten información. La herramienta además de indicar el contraste, también indica si cumple o no el criterio del contraste en función de si los colores seleccionados son texto o son objetos gráficos.
Para elegir los colores a validar, hay que elegir el color de primer plano y el color de fondo con la pipeta. Al seleccionar el color con la pipeta, podéis comprobar que el tono del color varía cuando nos posicionamos en la parte central o en el borde de la zona de la que queremos seleccionar el color; habría que elegir el color correspondiente con la parte central de la imagen, que suele ser el color más intenso.
Para verificar el contraste del texto, el ratio exigido es diferente en función del tamaño del texto:
- Para texto normal (texto inferior a 18 puntos o texto inferior a 14 puntos y negrita): el contraste debe ser mayor o igual a 4.5:1.
- Para texto grande (texto igual o superior a 18 puntos o texto igual o superior a 14 puntos y negrita): el contraste debe ser mayor o igual a 3:1.
A continuación mostramos un ejemplo del texto de una misma imagen en la que el texto se ha representado en diferentes tamaños para que podáis haceros una idea de lo que sería texto normal y lo que sería texto grande.
Por tanto, para verificar que el color del texto mostrado en una imagen tiene un contraste suficiente respecto al color de fondo de la imagen, habría que elegir con la pipeta ambos colores (seleccionando como hemos indicado previamente el color de la parte más central) y comprobar el contraste indicado por la herramienta; como ya hemos comentado anteriormente la herramienta también indica si se cumple el contraste para texto normal ("regular text") y para texto grande "large text").
Os animamos a realizar el siguiente ejemplo. Vamos a validar el contraste del texto "newsletter" de la siguiente imagen.
Habría que validar el contraste del entre el color azul del fondo y el blanco del texto. La herramienta indica que el ratio del contraste es 5.1:1; también indica que cuando estos colores se utilizan en texto, el contraste cumple para texto normal y para texto grande. El resultado de la herramienta es el siguiente.
Por otro lado, para verificar el contraste de los objetos gráficos, el ratio exigido debe ser mayor o igual a 3:1.
Para verificar el contraste de los objetos gráficos, habría que elegir con la pipeta los colores a seleccionar (seleccionando como hemos indicado previamente el color de la parte más central) y comprobar el contraste indicado por la herramienta; como ya hemos comentado anteriormente la herramienta también indica si se cumple el contraste para objetos gráficas.
Os animamos a realizar el siguiente ejemplo. Vamos a validar el contraste de la imagen de la lupa . El resultado de la herramienta Analyser Contrast Checker es 2.6:1 y también indica que el contraste no es suficiente para imágenes gráficas.