SevirantaHacer accesible tu tienda WooCommerce: una guía práctica
9 de junio de 2026
Respuesta corta. WooCommerce sigue razonablemente bien las directrices de accesibilidad de WordPress, pero tu tienda hereda sobre todo la accesibilidad de tu tema, tus plugins y tu contenido, y ahí suele torcerse la cosa. Repasa los seis puntos de abajo (contraste, textos alternativos, encabezados, plugins y page-builders, teclado, idioma) y presta especial atención a tu checkout por bloques y tus filtros de producto; así tendrás cubierta la mayor parte.
¿Por qué WooCommerce por sí solo no basta?
WooCommerce es un plugin sobre WordPress. Que tu tienda cumpla las WCAG depende de cómo esté construido tu tema, qué colores elegiste, qué plugins y page-builder usas y cómo rellenaste tus productos. Por eso dos tiendas con la misma versión de WooCommerce pueden puntuar de forma totalmente distinta. La buena noticia: como mucho se repite a través de tu tema y tus plantillas, una sola corrección cubre a menudo cientos de páginas.
1. Comprueba el contraste de color
El error más frecuente. En un tema por bloques (Full Site Editing) ve a Apariencia → Editor → Estilos → Colores; en un tema clásico, a Apariencia → Personalizar → Colores. Asegúrate de que el texto y el fondo tengan al menos un contraste de 4,5:1 (3:1 para texto grande). Fíjate sobre todo en el texto sobre tu botón Añadir al carrito, las etiquetas de precio y de oferta, y los enlaces. Ajustarlo bien una vez rige para toda la tienda. Consulta contraste de color: el requisito WCAG y cómo medirlo.
2. Pon textos alternativos a las fotos de tus productos
Abre un producto en Productos, haz clic en Imagen del producto (y Galería del producto)
sobre la imagen → rellena en la biblioteca de medios el campo Texto alternativo. Describe de
forma breve y objetiva lo que se ve (p. ej. "Zapato de hombre de ante negro con cordones"), sin
lenguaje de marketing. Empieza por tus productos más vendidos y los banners de tu página de inicio.
Las imágenes decorativas reciben un alt vacío (alt=""). Más sobre esto en
escribir textos alternativos que funcionan.
3. Comprueba la estructura de encabezados
Usa los encabezados en orden lógico (H1 → H2 → H3) y no solo para el formato. En el editor de bloques (Gutenberg) ves el nivel de cada bloque de encabezado; no te saltes niveles. Atención con page-builders como Elementor o Divi: te permiten dar formato grande a cualquier texto sin que se convierta en un encabezado real; elige ahí conscientemente el nivel de encabezado correcto.
4. Presta atención a tus plugins y tu page-builder
Esta suele ser la mayor fuente de problemas. Los plugins de reseñas, chat, pop-ups, sliders y filtros —y los page-builders pesados— inyectan su propio código en tu tema, y ese código contiene con frecuencia botones sin nombre, ARIA incorrecto o elementos que no se pueden manejar con el teclado. Así que no instales a ciegas cualquier plugin y prueba siempre tu web con todo activo. Si un plugin resulta inaccesible, cámbiate a una alternativa que sí respete las normas WCAG. Donde puedas, opta por los nuevos bloques de WooCommerce para el carrito y el pago (ver punto 6).
5. Prueba con el teclado
Prueba a recorrer tu web del todo sin ratón: solo con la tecla Tab y Enter. ¿Puedes llegar a todo
—menú, filtros de producto, selección de variaciones, carrito, pago— y ves en cada momento dónde está
el foco? En WooCommerce fíjate específicamente en los desplegables de variación, el contador de
cantidad (+/−) y los widgets de filtro de tu barra lateral; esos son los puntos donde el teclado
suele quedarse atascado.
6. Comprueba tu ajuste de idioma y tu checkout
Asegúrate de que tu tema fije el atributo de idioma correcto, para que un lector de pantalla elija la
pronunciación adecuada. En un tema clásico, en header.php está la línea
<html <?php language_attributes(); ?>>, que debe contener el atributo de idioma. Si usas WPML o
Polylang para varios idiomas, comprueba que cada versión de idioma reciba el atributo lang correcto.
Cámbiate preferentemente a los bloques de Carrito y Pago basados en bloques de WooCommerce: son
más accesibles que el antiguo checkout por shortcode y se mantienen activamente en accesibilidad.
Errores frecuentes de WooCommerce y su corrección
| Elemento de WooCommerce | Error frecuente | La corrección |
|---|---|---|
| Botón "Añadir al carrito" | tipografía demasiado clara / contraste bajo | contraste en los estilos del tema a 4,5:1 como mínimo |
| Fotos de producto | nombre de archivo como descripción (IMG_2043.jpg) | texto alternativo funcional en la biblioteca de medios |
Contador de cantidad (+/−) | botones sin etiqueta, no manejables con el teclado | añadir etiqueta/aria-label o usar una variante accesible |
| Widget de filtro de producto | filtros utilizables solo con el ratón | plugin de filtro accesible o los bloques de filtro de WooCommerce |
| Plugin de accesibilidad | instalar un widget de overlay | evitar — no repara tu código ni protege contra reclamaciones |
¿Ayuda un plugin de accesibilidad del directorio de plugins de WordPress?
No. Si buscas "accessibility", encuentras decenas de plugins que prometen hacer tu tienda compatible con un solo clic mediante un widget. No piques: no reparan tu tema ni tus plantillas, y los organismos reguladores comprueban el código fuente en bruto de tu tienda. Resolverlo estructuralmente en tu tema y tu contenido es la única vía que resiste, y además te aporta mejor SEO y un tiempo de carga más rápido. Más sobre esto en por qué un widget de overlay no te protege.
¿Cumple así mi tienda WooCommerce con la ley?
Estos seis puntos cubren la mayor parte de lo que detecta una comprobación automatizada, pero "cumplir" va más allá: depende de tu tema completo, tus plugins y tu contenido en conjunto. Si la European Accessibility Act se te aplica, lo repasas en nuestra checklist. ¿Trabajas también con Shopify? Entonces nuestra guía de Shopify te ayuda más.
¿Cómo sé dónde está ahora mi tienda WooCommerce?
La forma más rápida: escanea gratis una página. Verás, por cada hallazgo, qué falla y cómo resolverlo, y como mucho pasa por tu tema y tus plantillas, lo resuelves a menudo de una sola vez para toda tu tienda. En menos de 60 segundos, sin cuenta.