Skip to content
← Volver al blog
Páginas Web

Cómo hacer una página web accesible: la guía práctica que no exige ser experto

La accesibilidad web suena a materia de grandes organizaciones con departamento legal propio. La realidad es más simple y más urgente: desde junio de 2025, la normativa europea de accesibilidad amplió el círculo de negocios obligados a cumplir unos mínimos, y buena parte de las pymes que venden online o prestan servicios digitales ya están dentro, lo sepan o no.

La buena noticia es que cumplir lo esencial no exige rehacer la web ni contratar una auditoría cara. La mayoría de los fallos de accesibilidad se concentran en un puñado de errores repetidos, y corregirlos suele llevar horas, no semanas. Esta guía cubre qué exige la accesibilidad en la práctica y las 8 correcciones que resuelven la mayor parte del problema.

Por qué esto te afecta más de lo que crees

La Directiva Europea de Accesibilidad (2019/882), transpuesta a la legislación española, entró en vigor de forma efectiva en junio de 2025 para servicios como el comercio electrónico, la banca, el transporte de pasajeros, los libros electrónicos y las comunicaciones electrónicas. Si tu negocio vende productos o servicios online, gestiona reservas, o presta un servicio que encaja en alguna de esas categorías, es muy probable que ya te aplique, con independencia de tu tamaño.

Pero incluso si tu actividad concreta queda fuera del alcance estricto de la ley, tres razones prácticas hacen que merezca la pena de todos modos: evitas una reforma urgente y cara si la normativa se amplía (una tendencia constante en los últimos años), amplías tu audiencia real (más de un 15% de la población tiene alguna discapacidad que afecta a cómo navega internet), y mejoras señales que Google también valora, como la estructura semántica y los textos alternativos.

Qué exige la accesibilidad en la práctica

Checklist de accesibilidad por zona de la página Texto e imágenes • Contraste 4.5:1 mínimo • Texto alternativo en todas las imágenes • Tamaño de letra ≥ 16px • Jerarquía de títulos correcta (H1, H2, H3...) • Sin texto solo en imágenes decorativas Navegación • Todo accesible con tabulador (teclado) • Foco visible al navegar con Tab • Menús que no dependen solo del ratón • Enlaces con texto descriptivo (no "clic aquí") Formularios • Cada campo con etiqueta <label> • Errores explicados en texto, no solo color • Campos obligatorios marcados con texto • Confirmación clara al enviar
La mayoría de los fallos de accesibilidad se concentran en estas tres zonas de cualquier página.

Las pautas de referencia internacional (WCAG 2.1, nivel AA) se resumen en cuatro principios: la web debe ser perceptible (se puede ver y oír, con alternativas si algún sentido no funciona), operable (se puede navegar sin depender de un solo dispositivo de entrada), comprensible (el contenido y la interfaz tienen sentido) y robusta (funciona en distintos navegadores y tecnologías de asistencia). Detrás de estos cuatro principios hay decenas de criterios técnicos, pero la mayoría de negocios solo necesitan resolver un núcleo pequeño y repetido de fallos.

Las 8 correcciones que cubren la mayoría de los fallos

1. Contraste de color suficiente. El texto normal necesita una ratio de contraste de al menos 4.5:1 contra su fondo (3:1 para texto grande). Herramientas gratuitas como el comprobador de contraste de WebAIM te dan el resultado en segundos con solo pegar los dos colores.

2. Texto alternativo en todas las imágenes con significado. Cada imagen que aporta información necesita un atributo alt que describa qué muestra. Las imágenes puramente decorativas pueden llevar un alt vacío (alt="") para que los lectores de pantalla las ignoren sin problema.

3. Navegación completa con teclado. Pulsando solo la tecla Tab, cualquier visitante debe poder llegar a todos los enlaces, botones y campos de formulario, en un orden lógico, con el elemento activo siempre visible (un contorno o resalte claro).

4. Formularios con etiquetas correctas. Cada campo necesita una etiqueta <label> vinculada, no solo un texto de ejemplo dentro del campo (placeholder) que desaparece al escribir. Los errores de validación deben explicarse con texto, no solo con un borde rojo que una persona con baja visión o ceguera al color no distingue.

5. Jerarquía de títulos coherente. Un único H1 por página, seguido de H2 y H3 en orden lógico, sin saltar niveles solo por conveniencia visual. Los lectores de pantalla usan esta jerarquía para que el usuario navegue el contenido por secciones.

6. Texto de enlace descriptivo. “Más información sobre nuestro servicio de contabilidad” en vez de “clic aquí” o “leer más”. Alguien que navega con lector de pantalla y salta de enlace en enlace necesita que el texto tenga sentido fuera de contexto.

7. Videos con subtítulos y transcripción. Cualquier vídeo con información relevante necesita subtítulos, y ojalá una transcripción textual debajo. Beneficia tanto a personas sordas como a quien ve el vídeo sin sonido en el móvil.

8. Tamaño de texto y zoom que funcionan. El texto base no debería bajar de 16px, y la web debe seguir siendo usable si alguien aumenta el zoom del navegador al 200%, sin que el contenido se corte o se superponga.

Cómo empezar sin bloquear el resto del trabajo

No hace falta resolver los ocho puntos en un día. El orden recomendado es: primero contraste y texto alternativo (rápidos y de alto impacto), después formularios (frecuente punto de fricción real para usuarios con discapacidad), y por último navegación por teclado y estructura de títulos, que a veces requieren tocar la plantilla base de la web.

Una auditoría gratuita con Lighthouse (integrado en Chrome) o WAVE te da en cinco minutos un listado priorizado de qué falla en tu web concreta. No sustituye una revisión manual completa, pero es un punto de partida honesto que evita trabajar a ciegas.

La accesibilidad no es un proyecto que se termina una vez y se olvida — es un criterio que conviene aplicar cada vez que se añade una página, una imagen o un formulario nuevo. Empezar por las correcciones de esta lista te deja en una posición mucho más sólida, tanto frente a la normativa como frente a cualquier visitante real que hoy no puede usar tu web con comodidad.

Preguntas frecuentes

¿Mi negocio está obligado a tener una web accesible?

Depende de tu actividad y tamaño, pero el círculo se ha ampliado: desde junio de 2025 la normativa europea de accesibilidad (transpuesta en España) exige accesibilidad a comercio electrónico, banca, transporte de pasajeros y otros servicios digitales, incluidas muchas pymes que venden online. Aunque tu negocio concreto no esté obligado hoy, tratarlo como algo inevitable te ahorra una reforma urgente más adelante.

¿Necesito rehacer toda mi web para que sea accesible?

Casi nunca. La mayoría de fallos de accesibilidad se corrigen sobre la web existente: subir el contraste de un color, añadir texto alternativo a las imágenes, etiquetar los campos de un formulario, asegurar que se puede navegar con teclado. Son ajustes puntuales, no una reconstrucción completa.

¿La accesibilidad web solo beneficia a personas con discapacidad?

No. Un contraste alto ayuda a cualquiera que mire el móvil al sol; una navegación por teclado clara beneficia a quien tiene el ratón estropeado; unos textos alternativos bien puestos mejoran el SEO porque Google también los lee. La accesibilidad casi siempre mejora la experiencia para todo el mundo, no solo para quien la necesita de forma estricta.

¿Cómo compruebo si mi web ya cumple lo básico?

Hay herramientas gratuitas como Lighthouse (integrada en Chrome, en la pestaña de desarrollador) o WAVE, que analizan una página y señalan contraste insuficiente, imágenes sin texto alternativo y errores de estructura en segundos. No sustituyen una auditoría completa, pero detectan la mayoría de los fallos más comunes sin coste.

¿Hablamos?

¿Te ha sido útil? Cuéntame tu proyecto y te respondo en menos de 24 horas.