No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

¿Mi marca es accesible? Contraste, colores y fuentes

3/12
Recursos

Aportes 3

Preguntas 0

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Con respecto al tema de contraste, la fórmula que se ha usado hoy en día funciona bien, pero a medida que han avanzado las tendencias de diseño y cosas como el modo oscuro han cobrado auge, se empezaron a ver las grietas en este algoritmo, dejando de lado ciertos matices de percepción de luminosidad como el como el negro afecta la visión o el grosor de la letra.

Por eso se ha trabajado en otro algoritmo que saldrá en unos años llamado APCA (Accessible Perceptual Contrast Algorithm) hecho por Andrew Somers (que en Internet lo pueden encontrar como Myndex) que tiene en cuenta estos matices y va a entrar en la versión 3.0 de la WCAG, hay varias calculadoras al respecto, la que yo recomiendo (y que el mismo Andrew Somers aprueba) es https://contrast.tools/ donde puedes comparar los resultados del algoritmo actual con el de APCA.

Yo personalmente sugiero probar con ambos algoritmos mientras sale la WCAG 3.0 (que podría tardar años) y si ven discrepancias en los cálculos, hagan una decisión informada y de ser posible, rectificarlo con usuarios.

Hay un montón de recursos al respecto pero quiero dejar el sitio de Myndex https://git.myndex.com/ y este artículo de la Universidad de Cambridge que habla del problema del algoritmo de contraste actual https://www.cedc.tools/article.html

Entrando un poco al tema de la fuente y específicamente en el tamaño de letra de un sitio web. ¿Hacer uso de Rem es buena práctica? O que unidad de medida es la más recomendada para diseñar un producto web teniendo presente la accesibilidad.
  • Tamaño de fuente: mínimo 16px/18px. Siempre que el usuario pueda hacer zoom al sitio.
  • Jerarquizar el texto (títulos, subtítulo y pocos párrafos).
  • Fuente: san-serif (diferencia entre la letra a y la o).
  • Alto contraste entre fondo y color de letra. Verificar la luminosidad entre ellos.
  • Texto decorativo (no leíble) no necesita ser accesible.
  • Agregar ícono y texto al indicar errores. No sólo por indicación de colores.