Si has llegado hasta aquí buscando consejos de accesibilidad para mejorar tu página web, es porque tienes claro que es clave que el mayor número de personas puedan utilizarla, sin importar con qué equipo accedan y con independencia de sus conocimientos y capacidades, ¿verdad? ¡Allá vamos!
Por qué apostar por la accesibilidad web
La accesibilidad reduce barreras para personas con distintas capacidades y formas de navegación. Una estructura clara puede beneficiar a muchos usuarios, pero estos consejos no garantizan mejoras de posicionamiento o velocidad ni demuestran por sí solos el cumplimiento de la normativa aplicable. Una evaluación debe abarcar las páginas, tareas y tecnologías de apoyo relevantes.
10 consejos básicos de accesibilidad web
Es hora de contarte los 10 trucos de accesibilidad web que consideramos como básicos:
- Incluye un texto alternativo que exprese la función o información de las imágenes relevantes. En imágenes puramente decorativas, utiliza una alternativa vacía para no añadir ruido al lector de pantalla.
- Posibilita la ampliación o disminución del tamaño de las fuentes sin que el diseño sufra “desperfectos”. Es decir, no dejes de lado el diseño responsive y permite que el texto se escale dependiendo del tamaño de la pantalla.
- Utiliza tablas para datos, no para maquetar. Identifica sus encabezados y relaciones con las celdas; añade un título cuando ayude a entenderlas. El tutorial de tablas de W3C muestra cómo hacerlas accesibles.
- Comprueba el contraste y no comuniques errores o estados solo mediante el color. WCAG 2.2 AA establece, para texto, una relación mínima de 4,5:1; para texto grande, 3:1, con las excepciones definidas en el criterio.
- Cuida el tamaño y la separación de los controles. El criterio 2.5.8 de WCAG 2.2 AA usa 24 × 24 píxeles CSS o las alternativas y excepciones que establece, como el espaciado suficiente. No lo conviertas en una medida física fija en centímetros.
- CTA que expliquen qué encontrarán. En este aspecto nos referimos a que intentes ser lo más explicativo posible en tus textos en general y en las CTA o llamada a la acción que utilices en particular. Por ejemplo, en lugar de escribir: “Leer más” o “Clic aquí” utiliza “Quiero conocer la oferta” o “Haz clic y descarga el ebooksobre moda gratis”.
- Contenido multimedia como vídeos o música. Incluye las transcripciones de los textos, subtítulos y una descripción del vídeo. Deja que el usuario sea quien controle el vídeo y evita reproducirlo automáticamente.
- Comprueba que se pueda navegar y realizar las tareas con el teclado, sin trampas de foco. El foco debe ser visible y seguir un orden coherente, también al abrir y cerrar menús o ventanas de diálogo.
- Organiza los formularios con etiquetas asociadas a cada campo, instrucciones claras y errores que indiquen qué corregir. No uses el placeholder como única etiqueta y conserva los datos válidos cuando haya un error.
- Escribe enlaces cuyo propósito se entienda por el texto o su contexto. Una URL larga no sustituye un nombre de enlace comprensible: «Información del servicio de desarrollo web» resulta más claro que «aquí».
Usa estas comprobaciones como punto de partida y contrástalas con las WCAG 2.2. Combina revisión automática y pruebas manuales de teclado, zoom, formularios y lectura con tecnologías de apoyo.
Si estás planificando mejoras en tu web, cuéntanos qué barreras has detectado y qué tareas necesitan realizar sus usuarios.