Accesibilidad

Un sitio que algunos visitantes no pueden usar es un sitio que rechaza clientes en silencio. Tratamos el nivel AA de WCAG 2.2 como el piso de ingeniería de cada construcción, y lo verificamos por medición en lugar de afirmarlo en un folleto.

Por qué importa

Tres razones, todas prácticas

Cada vez más es ley

La regulación de accesibilidad no deja de ampliarse: normas para el sector público, legislación de discapacidad aplicada a la web y requisitos de consumo en más y más mercados. Somos ingenieros, no abogados, y no damos asesoría legal. Lo que sí podemos decir con claridad es que un sitio construido y verificado según WCAG 2.2 AA se apoya en el estándar que esos regímenes citan, y un sitio que lo ignora carga con un riesgo que no presupuestaste.

Se solapa con ser encontrado

La misma estructura que sirve a un lector de pantalla sirve a un rastreador de búsqueda: encabezados reales y en orden, controles etiquetados, texto descriptivo en las imágenes, enlaces que dicen adónde van. El trabajo de accesibilidad y el de búsqueda se refuerzan entre sí, y por eso los tratamos como una sola disciplina y no como dos facturas.

Es una señal de calidad que los compradores sienten

Un contraste cómodo, objetivos táctiles generosos, una página que se maneja con teclado, movimiento que respeta tu configuración: los visitantes rara vez nombran estas cosas, pero las sienten como cuidado. Su ausencia se lee como baratura, justo en la página donde pides que confíen en ti.

En la práctica

Qué significa AA en una página real

El estándar suena abstracto hasta que se aplica. Esto es lo que significa, en concreto, en cada sitio que publicamos.

  • Contraste en ambos esquemas de color. Los colores de texto e interfaz se verifican contra los fondos sobre los que realmente se apoyan, en modo oscuro con el mismo rigor que en claro. El esquema oscuro se diseña junto al claro, nunca se invierte al final.
  • Todo el sitio funciona desde el teclado. Un enlace de salto como primera parada, un anillo de foco visible en cada elemento interactivo, y un orden de tabulación que sigue el orden de lectura de la página.
  • Objetivos cómodos. Cada enlace y cada botón supera el tamaño mínimo de objetivo en cada tamaño de pantalla, así que un dedo en un teléfono acierta donde apuntó.
  • El movimiento pide permiso. Todo lo que se anima se desactiva para quien tenga configurada la reducción de movimiento, y en su lugar se muestra un estado estático pensado.
  • La semántica sostiene la estructura. Landmarks, exactamente un encabezado principal, niveles de encabezado en orden, campos de formulario etiquetados y texto alternativo descriptivo en cada imagen que aporta significado.
  • Los formularios fallan de forma útil. Los campos obligatorios están marcados, los errores se anuncian con texto y no solo con color, y un envío rechazado recibe una explicación honesta en lugar de un descarte silencioso.
  • El texto se comporta bajo zoom. El diseño se reacomoda cuando un visitante amplía el texto, sin columnas recortadas y sin desplazamiento lateral.

Verificación

Verificado por página, por tamaño de pantalla, por esquema

01

Una auditoría automatizada que controla el despliegue

Cada página compilada se audita contra WCAG 2.2 AA en anchos de teléfono, tableta y escritorio, en esquema claro y oscuro, en cada cambio. Una violación no produce un informe que alguien quizá lea: rompe la compilación, y una compilación rota no puede desplegarse. Las regresiones de accesibilidad se atrapan antes de que un visitante pueda encontrárselas.

02

Medición, no ojo

Las razones de contraste se calculan, los tamaños de objetivo se miden en píxeles, el orden de los encabezados se analiza, y las mismas verificaciones corren en cada versión de idioma de cada página. Lo que una lista de control afirma, la batería de pruebas lo demuestra.

03

Manos también en el teclado

Las verificaciones automáticas detectan mucho, pero no todo. Antes de publicar un sitio, además lo usamos como lo haría un visitante real con necesidades de acceso: lo recorremos completo con el teclado, lo leemos con el texto ampliado y repasamos los formularios pensando en los anuncios del lector de pantalla.

Integrada

Integrada desde la paleta, nunca adaptada después

Adaptar la accesibilidad al final es la forma cara de conseguirla: recolorear una paleta de marca que nunca superó el contraste, reconstruir componentes que no pueden recibir foco, reescribir páginas cuyos encabezados eran decoración. Nosotros tomamos el camino contrario. El sistema de diseño se verifica por contraste en ambos esquemas antes de componer una sola página, los componentes interactivos se construyen primero para el teclado, y la auditoría corre desde el primer despliegue del proyecto, no desde el último. Al lanzar, la accesibilidad no es una tarea en una lista; es una propiedad del código que las pruebas mantienen verdadera.

Empieza un proyecto de sitio web sales@wwi.dev

Pregúntanos lo que quieras sobre el estándar, o pídenos revisar tu sitio actual. Escríbenos por el formulario de contacto o a sales@wwi.dev.