Volver al blogDesarrollo

Accesibilidad web: lo que tu empresa necesita saber (y lo que te puedes saltar)

La accesibilidad web no es solo para empresas grandes con equipos de compliance. En 2026, con la Directiva Europea de Accesibilidad en vigor, afecta a muchas más empresas de lo que parece. Aquí está lo que importa realmente.

FR
Francisco Reyes
CDO · Director Digital Externo
12 de abril de 20266 min de lectura

Hasta hace relativamente poco, la accesibilidad web era algo que las empresas grandes mencionaban en sus políticas pero pocos implementaban de verdad. En 2026, eso ha cambiado con la Directiva Europea de Accesibilidad (European Accessibility Act), que desde junio de 2025 exige a muchas empresas que sus productos y servicios digitales sean accesibles.

Desarrollador web con auriculares probando la navegación por teclado de un sitio en su escritorio, junto a la luz de la ventana

Si operas en Europa o vendes a clientes europeos, vale la pena entender qué aplica y qué no.

Qué es la accesibilidad web (en términos prácticos)

Accesibilidad web significa que tu web puede ser usada por personas con diferentes capacidades: personas con discapacidad visual que usan lectores de pantalla, personas con discapacidad motriz que navegan solo con teclado, personas con daltonismo que dependen del contraste, personas con problemas cognitivos que necesitan claridad de presentación.

Los estándares internacionales son las WCAG (Web Content Accessibility Guidelines). Las WCAG 2.1 tienen tres niveles: A (básico), AA (estándar recomendado), AAA (avanzado). La mayoría de requisitos legales apuntan al nivel AA.

A quién afecta la Directiva Europea de Accesibilidad

La Directiva de Accesibilidad (EAA) se aplica principalmente a empresas que ofrecen:

  • Servicios bancarios y financieros al consumidor
  • Comercio electrónico (tiendas online que venden a consumidores)
  • Servicios de transporte
  • Servicios de comunicaciones electrónicas
  • Libros digitales y software

Si tienes una tienda online que vende a particulares, la EAA aplica. Si tienes un sitio web corporativo B2B o una web de servicios sin transacción digital, la aplicación es menos directa — aunque la tendencia regulatoria es de expansión.

Hay dos matices que conviene no confundir. El primero: las microempresas que prestan servicios (menos de 10 personas y menos de 2 millones de euros de facturación) quedan fuera del alcance de las obligaciones de la Directiva. El segundo: cualquier empresa puede alegar "carga desproporcionada" para determinadas medidas, pero eso no es una exención automática — hay que documentar la evaluación. Antes de dar por hecho que estás fuera, contrástalo con quien lleve tu asesoría legal: esto es un resumen editorial, no un dictamen jurídico.

Lo que realmente importa implementar

1. Texto alternativo en imágenes

Cada imagen que contiene información debe tener un atributo alt descriptivo. Las imágenes decorativas deben tener alt="" para que los lectores de pantalla las ignoren.

<!-- Bien -->
<img src="grafico-ventas.png" alt="Gráfico de barras mostrando crecimiento de ventas del 35% en 2025">

<!-- Decorativa -->
<img src="patron-fondo.png" alt="">

2. Contraste de color suficiente

El texto normal debe tener un ratio de contraste de al menos 4.5:1 respecto al fondo. El texto grande (18px o más) necesita 3:1.

Herramienta gratuita para verificar: WebAIM Contrast Checker (webaim.org/resources/contrastchecker). Introduces los colores y te dice si pasan el test.

El error más frecuente: texto gris claro sobre fondo blanco que se ve "moderno" pero falla el test de contraste.

3. Navegación por teclado

Un usuario que no puede usar ratón debe poder navegar toda la web usando solo el teclado (Tab para avanzar, Shift+Tab para retroceder, Enter para activar, Escape para cerrar modales).

Prueba fácil: abre tu web y navégala solo con Tab. ¿Puedes llegar a todos los elementos interactivos? ¿Sabes dónde está el foco en cada momento (hay un indicador visual)?

4. Estructura semántica correcta

Usa los elementos HTML correctos: <h1> para el título principal, <h2> para subtítulos, <nav> para navegación, <main> para contenido principal, <button> para botones (no <div> estilizado como botón).

En WordPress, la mayoría de temas modernos ya tienen buena estructura semántica. El problema suele ser el contenido generado por el usuario: editores que usan H1 o H3 de forma decorativa en lugar de estructural. Es el mismo tipo de descuido acumulado que está detrás de otros errores de WordPress que cuestan dinero, solo que aquí se paga en usuarios que no pueden navegar, no en velocidad.

5. Formularios con etiquetas

Cada campo de formulario debe tener una etiqueta asociada. No solo placeholder (que desaparece al escribir).

<!-- Bien -->
<label for="email">Email</label>
<input id="email" type="email" name="email">

<!-- Mal para accesibilidad -->
<input type="email" placeholder="Email" name="email">

Las herramientas de auditoría gratuitas

axe DevTools (extensión Chrome): Ejecuta un análisis automático de accesibilidad en cualquier página. Identifica los problemas más comunes. Gratuita para uso básico.

WAVE (wave.webaim.org): Introduce una URL y muestra una visualización de problemas de accesibilidad directamente sobre la página. Muy útil para una primera revisión rápida.

Lighthouse en Chrome DevTools: La pestaña Accessibility de Lighthouse da una puntuación de 0-100 e identifica problemas específicos.

Ninguna herramienta automática detecta todos los problemas de accesibilidad, ni se acerca. Lo que veo al revisar webs es que el análisis automático encuentra bien lo mecánico —el alt que falta, el contraste que no da— y no ve nada de lo que depende del criterio: si el orden de tabulación tiene sentido, si el texto de un enlace se entiende fuera de contexto, si un mensaje de error se anuncia. Eso solo aparece probando a mano con teclado y con lectores de pantalla reales (NVDA en Windows, VoiceOver en Mac, TalkBack en Android — todos gratuitos).

El enfoque pragmático para PYMEs

Si no tienes obligación legal directa y quieres mejorar la accesibilidad de forma pragmática:

Fase 1 (un día de trabajo): Corregir los problemas que detecta axe o Lighthouse automáticamente. Normalmente son: imágenes sin alt, formularios sin etiquetas, y contraste insuficiente.

Fase 2 (un par de días): Verificar navegación por teclado y estructura de encabezados.

Con esas dos fases cubres buena parte del impacto con una fracción del esfuerzo de una auditoría completa de WCAG. Si quieres hacerlo dentro de una revisión más amplia de la web, encaja bien en el proceso de auditar tu web tú mismo en una tarde.

Si tienes obligación legal (tienda online B2C en Europa), la recomendación es contratar una auditoría profesional y hacer el plan de remediación completo.


La accesibilidad no es solo cumplimiento normativo — es usabilidad. Una web accesible suele ser una web más usable para todos: mejor estructura, mejor contraste, mejor navegación. Los cambios que mejoran la accesibilidad casi siempre mejoran también la experiencia del resto de visitantes.

accesibilidad webWCAGDirectiva Accesibilidaddesarrollo webusabilidad

Newsletter

¿Te fue útil este artículo?

Suscríbete y te aviso cuando publique algo que valga la pena leer. Sin correo basura y sin una frecuencia forzada.

Responsable: Francisco Reyes (FARP). Uso tus datos para enviarte la newsletter y para nada más; los guardo hasta que te des de baja y no se los cedo a nadie. Puedes pedirme acceso, corrección o borrado cuando quieras escribiendo a [email protected]. Detalle completo en la Política de Privacidad.

FR
Francisco Reyes
Director Digital Externo · 11 años alineando marketing, ventas y tecnología en PYMEs de Chile, España y LATAM. Creador de FARP.
Conversar sobre esto

¿Una duda rápida?

Escríbeme y te contesto en menos de 24 horas hábiles.