Por qué importa ahora: la Ley Europea de Accesibilidad
La Directiva Europea de Accesibilidad, conocida como European Accessibility Act, se aplica desde el 28 de junio de 2025 y en España se ha incorporado mediante la Ley 11/2023. Entre los servicios que cubre está el comercio electrónico dirigido a consumidores, lo que significa que muchas tiendas online deben cumplir requisitos de accesibilidad.
La norma tiene excepciones, por ejemplo para algunas microempresas que prestan servicios, y matices sobre plazos y alcance. No te damos asesoría legal: si tienes dudas sobre si te aplica y qué tienes que documentar, consúltalo con un asesor. Lo que sí podemos decirte es que trabajar la accesibilidad mejora la tienda para todo el mundo, te aplique la ley o no.
La referencia técnica: WCAG
El estándar de referencia son las Pautas de Accesibilidad para el Contenido Web (WCAG). Las propias recomendaciones de Shopify para tiendas se basan en ellas. Funcionan por criterios verificables: contraste, alternativas para imágenes, navegación por teclado, estructura de encabezados, formularios etiquetados y similares.
Shopify recuerda en su documentación que seguir estas pautas no garantiza por sí solo que la tienda sea totalmente accesible. Hay que probar con herramientas y, sobre todo, con personas usando lectores de pantalla y teclado.
Lo que puedes revisar sin tocar código
Buena parte del trabajo se hace desde el admin y el editor de temas. Shopify recomienda un contraste mínimo de 4,5:1 para el texto normal y los botones, de 3:1 para los títulos y textos grandes (24 px o más) y también de 3:1 para elementos no textuales como bordes de campos e iconos. El texto encima de imágenes y vídeos tiene que cumplir lo mismo.
Los textos alternativos de las imágenes de producto se añaden en el admin, y los del resto de imágenes del tema, en el editor. Describe lo que se ve con el contexto de tu tienda: no es lo mismo «zapatilla» que «zapatilla de trail azul vista de lado con suela de tacos».
- Contraste suficiente en textos, botones e iconos
- Texto alternativo en todas las imágenes con contenido
- Texto de cuerpo de al menos 16 px y sin justificar
- Enlaces subrayados o distinguibles por algo más que el color
- Sin vídeos ni carruseles en reproducción automática sin controles
- Subtítulos o transcripción en vídeos con diálogo
Lo que depende del tema
El resto está en el código del tema: que todos los elementos interactivos tengan foco visible al navegar con teclado, que los encabezados sigan un orden lógico sin saltos, que los menús desplegables, el carrito lateral y los modales se puedan abrir, usar y cerrar con teclado, y que los campos de formulario tengan etiquetas reales.
Los temas gratuitos de Shopify, como Dawn, parten de una buena base. Los problemas suelen venir de las personalizaciones y de las apps: sliders añadidos, popups de suscripción que atrapan el foco, iconos sin texto o botones hechos con elementos que no son botones. Cada cambio en el tema debería probarse también con teclado.
Apps, popups y overlays
Muchas apps añaden elementos que no controlas: ventanas de cookies, chats, reseñas o selectores de variantes. Pruébalas con teclado y lector de pantalla antes de dejarlas en producción. Un banner de cookies que no se puede cerrar con teclado bloquea la tienda entera para quien no usa ratón.
Desconfía de las soluciones de un clic que prometen hacer accesible la web con un script superpuesto. No corrigen los problemas del código de base y a veces interfieren con los lectores de pantalla. La accesibilidad se arregla en el tema y en el contenido, no con una capa encima.
Cómo enfocar una auditoría de accesibilidad
Empieza por las páginas que llevan a la compra: inicio, colección, ficha de producto, carrito y búsqueda. El checkout lo gestiona Shopify, pero lo que pasa antes depende de tu tema. Usa herramientas automáticas para detectar lo evidente (contraste, imágenes sin alternativa, campos sin etiqueta) y completa con pruebas manuales recorriendo el proceso de compra solo con teclado.
Una prueba sencilla que puedes hacer hoy: abre tu ficha de producto, deja el ratón a un lado y trata de elegir una variante, añadir al carrito y llegar al checkout usando solo el tabulador, Intro y las flechas. Si en algún momento no sabes dónde está el foco o no puedes avanzar, has encontrado un problema que también sufren tus clientes. Repite la prueba con el lector de pantalla del sistema operativo, como VoiceOver en Mac o Narrador en Windows, y escucha si los botones y los precios se entienden sin verlos.
Documenta lo que encuentras, prioriza lo que bloquea la compra y corrígelo en el tema. Después, incluye la accesibilidad en el proceso: cada nueva sección, app o campaña se revisa con los mismos criterios antes de publicarse.
Preguntas frecuentes
¿La Ley Europea de Accesibilidad afecta a mi tienda Shopify?
Se aplica desde junio de 2025 a parte del comercio electrónico con consumidores, con excepciones como algunas microempresas. Para saber si te afecta y qué debes hacer, consulta a un asesor.
¿Los temas de Shopify son accesibles?
Los temas de Shopify como Dawn parten de una buena base, pero las personalizaciones, el contenido y las apps pueden romper la accesibilidad. Hay que revisarla en tu tienda concreta.
¿Sirven las apps de accesibilidad de un clic?
No sustituyen arreglar el tema y el contenido. Los overlays no corrigen el código de base y a veces interfieren con lectores de pantalla.
¿Qué contraste de color recomienda Shopify?
Al menos 4,5:1 para texto normal y botones, y 3:1 para títulos y textos de 24 px o más, y para elementos como iconos y bordes de campos.