Los errores de accesibilidad más comunes en tiendas en línea y cómo corregirlos

Textos alt ausentes, bajo contraste de color, formularios inaccesibles — estos son los errores que las comprobaciones automáticas detectan con más frecuencia. Resumen y guía de corrección.

Publicado:

Ejemplo de tienda en línea con cuatro errores de accesibilidad destacados: texto alt ausente, bajo contraste, campo de formulario sin etiqueta e indicador de foco ausente

Por qué las comprobaciones automáticas revelan más de lo esperado

La mayoría de los propietarios de tiendas en línea asumen que su sitio web es accesible. La realidad suele ser diferente. Una comprobación automática típicamente descubre decenas o cientos de hallazgos incluso en una tienda aparentemente normal.

La automatización cubre aproximadamente el 30–50 % de las reglas de WCAG 2.1 AA. ¿Cuáles son los problemas más comunes?

Textos alt ausentes

El hallazgo más extendido. Las imágenes sin descripción textual (el atributo alt) son completamente inaccesibles para los usuarios con lectores de pantalla.

Cómo corregirlo:

  • Imágenes funcionales (productos, ilustraciones, logotipos): una descripción significativa de lo que muestra la imagen o lo que hace el botón
  • Imágenes decorativas (fondos, adornos): atributo alt vacío para que los lectores de pantalla las omitan correctamente
  • Imágenes que contienen texto: el texto debe estar presente en el atributo alt

Contraste de color insuficiente

El segundo problema más frecuente. WCAG 2.1 AA exige una relación de contraste mínima de 4,5:1 para el texto normal y de 3:1 para el texto grande (18 pt o 14 pt en negrita). El contraste deficiente afecta a las personas con baja visión.

Elementos típicamente problemáticos: un botón claro «Añadir al carrito» sobre fondo blanco, texto descriptivo en gris, mensajes de error en color pálido, texto en banners con imagen.

Cómo corregirlo: herramientas como Colour Contrast Analyser o un análisis automático le mostrarán inmediatamente qué áreas no cumplen el estándar.

Formularios inaccesibles

Los formularios son un punto crítico en cualquier tienda en línea. Los problemas más frecuentes:

  • Etiqueta (label) ausente en un campo: un campo de E-mail sin etiqueta asociada programáticamente es irreconocible para un lector de pantalla
  • Mensajes de error no anunciados mediante ARIA: un usuario con lector de pantalla no ve que se ha producido un error
  • Campos obligatorios sin indicación: un asterisco (*) sin explicación textual no es suficiente
  • Botones sin texto significativo: «Confirmar» es mejor que solo un icono sin descripción

Problemas de navegación con teclado

Su ley nacional que implementa la EAA exige que toda la tienda en línea sea operable sin ratón. Los problemas más frecuentes:

  • Focus ring visible ausente: cuando un usuario navega con la tecla Tab, siempre debe poder ver dónde se encuentra
  • Keyboard trap: el usuario queda atrapado en una ventana modal o menú y no puede salir usando el teclado
  • Orden de foco incorrecto: Tab salta por la página de forma no natural

Elementos interactivos inaccesibles

Los botones y los enlaces deben tener un nombre accesible para que las tecnologías de apoyo los anuncien correctamente. Patrones problemáticos:

  • Botón con solo un icono sin texto ni aria-label
  • Enlace «Haga clic aquí» o «Más información» sin contexto
  • div o span interactivo sin role='button' y sin soporte de teclado

Cómo empezar a corregir

Enfoque recomendado:

  1. Realice un análisis automático — identifique los problemas más impactantes de forma rápida y gratuita
  2. Priorice por gravedad: resuelva primero los hallazgos críticos (critical) y graves (serious)
  3. Corrija los errores técnicos: los textos alt, el contraste y las etiquetas de formulario son correcciones relativamente sencillas
  4. Encargue una auditoría manual: las reglas restantes (legibilidad, comportamiento con lectores de pantalla) requieren juicio humano

Recuerde: las comprobaciones automáticas detectan aproximadamente el 30–50 % de las reglas de WCAG. Corregir los errores detectados automáticamente es un paso necesario, pero no suficiente, para cumplir con su ley nacional que implementa la EAA.

La comprobación automática de accesibilidad (como esta en Inkluzo) cubre aproximadamente el 30–50 % de las reglas WCAG 2.1 AA. Comprueba errores detectables por máquina — textos alternativos, contraste, estructura de encabezados y formularios, atributos ARIA. El 50–70 % restante de los criterios requiere evaluación manual.

Más artículos de la guía

Preguntas frecuentes

¿Cuántos errores son normales?
La mayoría de las tiendas en línea tienen decenas o cientos de hallazgos detectables automáticamente. La gravedad es más importante que el número — corrija primero los errores críticos y graves.
¿Cómo sé qué corregir primero?
Céntrese en los hallazgos marcados como críticos (critical) y graves (serious) — son los que tienen mayor impacto en los usuarios con discapacidad.
¿Es suficiente corregir los errores detectados automáticamente?
No. La automatización detecta aproximadamente el 30–50 % de las reglas de WCAG 2.1 AA. Para una visión completa — y para cumplir con su ley nacional que implementa la EAA — es necesaria una auditoría manual.

¿Quiere probar la accesibilidad de su sitio web ahora?

Iniciar comprobación de accesibilidad