20 problemas de accesibilidad más frecuentes
A continuación te dejo una lista de los problemas de accesibilidad web más comunes. Por supuesto, no son los únicos que pueden surgir, pero son un buen punto de partida para mejorar la accesibilidad de tu sitio web.
Listado de problemas comunes
1. Usa etiquetas de encabezado adecuadas
Organiza el contenido con niveles de encabezado (h1, h2, etc.)
.
Relacionado con:
2. Añade texto alternativo en imágenes
Proporciona descripciones para imágenes usando (alt)
.
Relacionado con:
3. Se puede navegar únicamente con el teclado
Asegura que todo el sitio sea accesible sin mouse, utilizando solo el teclado.
Relacionado con:
4. Contraste de color adecuado
Asegura que el texto y los elementos tengan un contraste suficiente para ser legibles.
Relacionado con:
5. Campos de los formularios accesibles
Usa etiquetas label
para describir claramente cada campo de formulario.
Relacionado con:
6. Proporciona transcripciones para archivos multimedia
Para videos y audios, incluye transcripciones o subtítulos.
Relacionado con:
7. Evita contenido parpadeante
Limita o evita contenido que parpadea para prevenir ataques epilépticos.
Relacionado con:
8. Usa enlaces descriptivos
Evita enlaces genéricos como haz clic aquí
, y usa descripciones claras.
Relacionado con:
9. Estructura HTML correcta
Usa una jerarquía HTML correcta, lo que facilita la navegación por asistentes.
Relacionado con:
10. Mejor uso de los atributos en los campos de los formularios
Complementando al uso de label
descrito anteriormente, la label
debe estar conectada con el campo de formulario mediante los atributos for
y id
en la label y el campo respectivamente.
Relacionado con:
11. Controla reproducción automática y el desplazamiento automático
Evita que videos o audios se reproduzcan automáticamente, o permite detenerlos fácilmente. También se aplica al contenido que se mueve sin la interacción del usuario, como las galerías de imágenes (carousels o sliders).
Relacionado con:
12. Usar ARIA (correctamente)
Aplica atributos ARIA para mejorar la accesibilidad, pero evita el mal uso que puede confundir a los lectores de pantalla.
Relacionado con:
13. El color no debe ser la única forma de añadir significado
Usa otros indicadores visuales como íconos o texto para transmitir información además del color.
Relacionado con:
14. Asegura el tamaño de clic adecuado en botones y enlaces
Los elementos interactivos deben ser lo suficientemente grandes para facilitar su selección.
Relacionado con:
15. Da tiempo suficiente para que se puedan cumplir las tareas pertinentes
Si hay sesiones con límite de tiempo, permite extender o desactivar el temporizador.
Relacionado con:
16. Usa texto descriptibo en íconos y/o botones
No dejes botones sin etiquetas claras que describan su función.
Relacionado con:
17. No ocultes contenido importante detrás de hover o foco
Relacionado con:
18. Proporciona un enlace que permita saltar al contenido principal
Este enlace permite a los usuarios de teclado y lectores de pantalla saltar directamente al contenido principal.
Relacionado con:
19. Evita los cambios de contexto inesperados
Las interacciones no deben provocar cambios de contexto automáticos, como cargar nuevas páginas sin advertencia.
Relacionado con:
20. El contenido es legible incluso con zoom
No hay problemas de solapamiento cuando incrementamos el zoom de la página en hasta un 200%.
Relacionado con:
Si quieres obtener más información sobre los criterios o aprender a hacer auditorías profesionales, échale un vistazo a los siguientes enlaces.