Algunos lectores no ven las wikis de la misma manera que tú. Ellos tienen sensibilidad de contraste. Esto provoca dificultades para visualizar/leer palabras que tienen poco contraste con el fondo que tienen debajo. Si bien pueden distinguir letras negras sobre un fondo blanco, otras combinaciones de colores son mucho más difíciles de leer para ellos, pudiendo provocar dolor de cabeza.

Afortunadamente puedes ayudarlos siguiendo los estándares de contraste web y podrán permanecer en tu wiki más tiempo.

Puede lograr buenos niveles de contraste con miles de combinaciones de colores.

Puede lograr buenos niveles de contraste con miles de combinaciones de colores.

Un problema para los lectores

Existen muchas enfermedades oculares que pueden alejar a lectores de tu wiki. Glaucoma, Retinopatía y Astigmatismo entre otras. Estas enfermedades afectan a personas de todas las edades, por lo que siempre debe tener en cuenta la posibilidad de que alguno de tus lectores tenga dicha discapacidad visual.

Sin embargo, no solo las personas con discapacidad visual se benefician de los diseños con buen contraste. Las malas combinaciones de colores pueden provocar fatiga visual e incomodidad, haciendo que incluso aquellos con una gran vista se alejen de tu wiki.

Ratios de contraste

¿Cómo conseguir mayor contraste en tu wiki? Fácil: ratios de contraste (RC). Hay algunas matemáticas bastante sofisticadas detrás de estos ratios estándares de contraste web, pero no es necesario que las comprendas para mejorar tu wiki.

Colorable_-_The_Color_Palette_Contrast_Tester_Dansky
Una muestra de analizador de contraste

Todo lo que necesita es una herramienta fácil de usar llamada analizador de contraste. Hay un montón de ellos ahí fuera para ayudarte. Colorable. Se demuestra en el video de la izquierda pero también existen otros, como por ejemplo el comprobador de contraste WCAG.

También puedes usar el inspector de accesibilidad de Firefox o la elección de color de Chrome, como extensiones de tu explorador para comprobar los ratios.

Existen dos estándares web: AA y AAA. Todos los analizadores de contraste los obviarán cuando alcance estos objetivos. Debe tener al menos la relación de contraste AA entre su fondo y los colores del texto. Pero intente el estándar AAA más alto para que pueda ayudar a la mayor cantidad de lectores posibles.

Para lograr el estándar AA, también debe prestar atención al contraste de los elementos gráficos, como los iconos, necesarios para comprender el contenido de el wiki. Deben ser fáciles de ver así como también el texto, o de lo contrario algunos lectores pueden perder el contexto u otra información valiosa.

¡El tamaño importa!

Las letras más grandes no necesitan ratios de contraste muy altos para ser fácilmente legibles. Por esa razón, normalmente se puede expresar un poco más de libertad creativa con los encabezados de sección que con el texto del artículo.

Esta combinación puede utilizarse para encabezados de sección pero no es recomendable en el texto del artículo.

Esta combinación puede utilizarse para encabezados de sección pero no es recomendable en el texto del artículo.

Por lo general, los analizadores de contraste le dirán si su RC logrado solo se aplica a texto grande. Si no dice grande, entonces significa que el RC se aplica tanto en el texto grande como en el normal.

El logo normalmente no tiene un RC mínimo, es muy grande y está estilizado. Eso no significa que debas olvidar el contraste por completo. Un logo blanco se perderá sobre un fondo blanco. Pero si decide usar blanco sobre blanco, simplemente coloque algunos bordes más oscuros o sombras a su alrededor.

Blanco sobre negro o negro sobre blanco

Existe un gran debate sobre la mejor manera de ofrecer contraste a los lectores, especialmente cuando se trata de si el texto oscuro sobre un fondo claro es mejor que lo contrario. Pero eso depende del lector y del tipo de discapacidad visual que padezca. Se sabe que el texto blanco sobre fondo negro dificulta la lectura del texto para las personas con astigmatismo.

Sin embargo, el texto negro sobre un fondo blanco puro provoca deslumbramiento, lo que es problemático para algunos. En general, la mejor solución es un texto oscuro sobre un fondo claro o utilizar colores como el azul marino para un fondo oscuro y colores pastel para el texto claro, sin dejar de cumplir los estándares AA y AAA.

Mejores prácticas

Aquí se mencionan algunas de las mejores prácticas que te ayudarán a cumplir con los estándares del W3C.

  • Logra mantener AA para una copia de cuerpo normal, pero intenta llegar a AAA de ser posible.
  • Asegúrate de leer tu analizador RC correctamente. Haz coincidir el ratio con el tamaño del texto de su interés. A tus lectores no les ayudará tener una combinación de colores que funcione a 18 píxeles cuando estás examinando la situación a 11 píxeles.
  • No combine colores que sean opuestos entre sí en el círculo cromático. Algunas malas combinaciones pueden ser: rojo sobre verde, cian sobre rojo, rojo sobre azul, azul sobre amarillo, etc.

Seguir estos consejas prácticas ayudará a que más personas se sientan cómodas viendo tu wiki y, por lo tanto, permanezcan más tiempo allí.

Véase también

Ayuda y comentarios