Todas las guías

Accesibilidad2 de agosto de 20269 minutos de lectura

Lista de verificación de cumplimiento de la ADA de Shopify (2026)

Una práctica lista de verificación de cumplimiento de la ADA de Shopify: imágenes, contraste, navegación con teclado, formularios y aplicaciones de terceros: qué solucionar antes de que una demanda lo encuentre a usted primero.

La Ley de Estadounidenses con Discapacidades no menciona los sitios web. Fue escrito en 1990, antes de que la mayoría de la gente tuviera correo electrónico. Pero los tribunales han dictaminado sistemáticamente que el Título III de la ADA, que prohíbe la discriminación en "lugares de alojamiento público", se aplica a las tiendas de comercio electrónico, y los comerciantes de Shopify están siendo demandados por ello en un número cada vez mayor. Si vende en línea en EE. UU., este no es un riesgo hipotético.

Esta es la lista de verificación que utilizamos cuando auditamos la accesibilidad de una tienda Shopify. No lo hará a usted a prueba de balas (nada lo hace), pero cerrará las brechas que los abogados de los demandantes buscan primero.

Lo que realmente requiere la ADA (no existe un estándar oficial)

Aquí está la parte que hace tropezar a la gente: la propia ADA no nombra un estándar técnico para sitios web. El Congreso nunca actualizó la ley para Internet y el Departamento de Justicia ha declarado que el Título III se aplica a las tiendas en línea sin adoptar formalmente un conjunto específico de reglas.

En la práctica, ese vacío se llena conWCAG (Pautas de accesibilidad al contenido web) 2.1 o 2.2, nivel AA. No es ley, pero es a lo que los acuerdos de conciliación, las cartas de orientación del Departamento de Justicia y los fallos judiciales hacen referencia una y otra vez. Si su tienda cumple con WCAG 2.2 AA, está alineado con lo que cada parte en una demanda (demandante, demandado y juez) lo comparará.

Dos cosas más que vale la pena saber antes de comenzar:

  • La Ley de Accesibilidad de la UE ahora se puede aplicar por separado(desde junio de 2025) para empresas que venden en la UE, con sus propios requisitos asignados libremente a las WCAG. Si realiza envíos a clientes europeos, esta lista de verificación cubre la mayor parte del mismo terreno.
  • El cumplimiento no es binario.No se "aprueba" la ADA de la misma manera que se aprueba un examen de conducir. Reduces tu exposición solucionando barreras reales y sigues reduciéndola a medida que encuentras más.

La lista de verificación de cumplimiento de ADA de Shopify

Trabaje con estos en orden. Cada sección tarda unos minutos en comprobarse manualmente, incluso sin herramientas especializadas.

1. Imágenes y medios

  • Cada imagen de producto tiene texto alternativo descriptivo, no "IMG_2481.jpg", ni el título del producto repetido sin detalles útiles, sino una descripción sobre la que un comprador ciego podría actuar ("suéter de lana azul marino con cuello redondo, doblado, sobre un fondo gris").
  • Las imágenes decorativas (texturas de fondo, espaciadores) tienen atributos alt vacíos (alt="") para que los lectores de pantalla los omitan en lugar de leer el nombre de un archivo en voz alta.
  • Cualquier video en su sitio tiene subtítulos. Cualquier audio tiene una transcripción.

2. Color y contraste

  • El cuerpo del texto tiene una relación de contraste de al menos 4,5:1 respecto al fondo; El texto grande (18 puntos+) necesita 3:1. Las herramientas gratuitas de verificación de contraste lo confirmarán en segundos con la paleta de colores de su tema.
  • Las insignias de oferta, las etiquetas de "agotado" y los errores de forma no dependen únicamente del color. Una etiqueta roja de "agotado" también necesita la palabra "agotado"; los usuarios daltónicos no pueden distinguir el rojo del verde.
  • El texto de marcador de posición en los campos del formulario no es la única etiqueta. El texto del marcador de posición desaparece una vez que se completa un campo y, a menudo, no cumple con los requisitos de contraste.

3. Navegación por teclado

  • Cada elemento interactivo (enlaces de navegación, filtros, "agregar al carrito", selectores de cantidad, el cajón del carrito, campos de pago) es accesible y operable usando solo las teclas Tabulador e Intro, sin mouse.
  • El foco es visible. Cuando te desplazas hacia un botón o enlace, aparece un esquema visual claro que muestra dónde te encuentras. Muchos temas eliminan esto por estética conoutline: noney nunca reemplazarlo.
  • Los modales y los cajones del carrito atrapan el foco correctamente: la pestaña se desplaza dentro del modal abierto, no en el contenido de la página oculto detrás de él, y Escape los cierra.

4. Formularios y pago

  • Cada entrada tiene un<label>vinculado programáticamente a él, no solo colocado visualmente cerca. Los lectores de pantalla anuncian la etiqueta cuando el campo recibe el foco; sin la conexión no anuncian nada útil.
  • Los mensajes de error son específicos ("Ingrese un código postal válido") y se anuncian a los lectores de pantalla cuando aparecen, no solo se muestran en texto rojo.
  • El proceso de pago comienza a terminar con un teclado y un lector de pantalla. Este es el flujo de mayor valor para probar; también es crítico para los ingresos, por lo que los errores aquí le cuestan ventas incluso antes de que le cuesten una demanda.

5. Estructura y semántica

  • Los títulos siguen un orden lógico (un H1, luego H2 y luego H3 anidados debajo del H2 derecho) en lugar de omitir niveles para dimensionar visualmente.
  • Existen regiones de referencia (encabezado, navegación, principal, pie de página) para que los usuarios de lectores de pantalla puedan saltar entre secciones en lugar de escuchar toda la página de arriba a abajo.
  • Los enlaces describen su destino ("Ver política de devoluciones", no "haga clic aquí" repetido seis veces en una página).

6. Aplicaciones de terceros

Esta es la categoría que la mayoría de los comerciantes de Shopify pasan por alto. Es posible que su tema esté limpio, pero el widget de revisión, la ventana emergente de ventas adicionales, la burbuja de chat y el temporizador de cuenta regresiva que instaló desde la App Store a menudo no lo son, y se cargan en cada página. Audite cada aplicación instalada individualmente; una sola ventana emergente rota puede deshacer todo lo demás.

7. Objetivos táctiles móviles

  • Los botones y enlaces tienen al menos 44×44 píxeles en dispositivos móviles, con espacio suficiente para que un usuario con control motor fino limitado no toque el botón equivocado.

Cómo probar tu tienda

La revisión manual detecta cosas que las herramientas automatizadas pasan por alto, y las herramientas automatizadas detectan cosas que la revisión manual pasa por alto. Utilice ambos:

  1. Primero ejecute un análisis automático.Nuestroherramienta gratuita AccessScanverifica su página de inicio, la página de un producto y su carrito con las reglas WCAG 2.2 A/AA usando axe-core y señala problemas clasificados por gravedad en aproximadamente un minuto. Es un punto de partida realmente útil, pero las pruebas automatizadas normalmente detectan solo entre el 30% y el 40% de las barreras reales, así que trate un escaneo limpio como un piso, no como una línea de meta.
  2. Navega por tu propio sitio con solo un teclado.Desenchufe el mouse durante diez minutos e intente comprar algo.
  3. Verifique al azar con un lector de pantalla.VoiceOver se envía gratis en todos los Mac y iPhone; NVDA es gratuito en Windows. No es necesario que lo hables con fluidez: cinco minutos en tu página de inicio y al finalizar la compra sacarán a la luz problemas obvios rápidamente.
  4. Vuelva a realizar la prueba después de cada actualización de tema o aplicación.La accesibilidad no es un proyecto de una sola vez. Una actualización de tema o una nueva aplicación pueden reintroducir silenciosamente problemas que ya solucionaste.

Una advertencia rápida sobre los widgets de accesibilidad

Verá aplicaciones en Shopify App Store que prometen cumplimiento instantáneo de ADA a través de una única instalación de script, generalmente un pequeño ícono de accesibilidad en la esquina de su sitio con un menú de ajustes de visualización. Estos se denominan widgets de superposición y no previenen de manera confiable las demandas. Hemos escrito un desglose completo de¿Por qué los widgets de superposición de accesibilidad no funcionan como se comercializan?— vale la pena leerlo antes de instalar uno en lugar de seguir la lista de verificación anterior.

¿Cuánto cuesta realmente la remediación?

Depende completamente de qué tan lejos se encuentre actualmente su tienda. Una tienda con un tema limpio y moderno y un puñado de aplicaciones que se comportan mal puede necesitar unos días de tiempo de desarrollador concentrado: etiquetar formularios, corregir contrastes, auditar aplicaciones. Una tienda construida sobre un tema antiguo y muy personalizado con docenas de brechas de accesibilidad incorporadas en el código Liquid personalizado es un proyecto más grande, más cercano a una reconstrucción parcial del tema.

De cualquier manera, la solución es más barata que la demanda. Los costos de defensa legal y resolución de reclamos de accesibilidad web de la ADA habitualmente alcanzan las cinco cifras, incluso cuando la solución subyacente le habría llevado a un desarrollador una semana. Si desea un presupuesto con alcance,Devmerx incorpora accesibilidad en cada tema y migración que ofrecemosy podemos cotizar trabajos de remediación por separado si ya tienes una tienda.

Preguntas frecuentes

¿Shopify cumple con la ADA desde el primer momento?

Ninguna plataforma es "compatible con ADA" de forma predeterminada, incluida Shopify. Se ha realizado trabajo de accesibilidad en el proceso de pago y en el administrador principal de Shopify, pero tu tema, tu contenido y cada aplicación que instales son tu responsabilidad. Un tema predeterminado de Shopify aún necesita que la lista de verificación anterior se aplique a su tienda específica.

¿Cumplir con las WCAG 2.2 AA garantiza que no me demandarán?

No. El cumplimiento de las WCAG reduce drásticamente su riesgo y le brinda una posición legal sólida si llega un reclamo, pero ningún estándar técnico es una garantía legal. Algunas afirmaciones son oportunistas independientemente del grado de cumplimiento de un sitio. Lo que hace el cumplimiento de las WCAG es eliminar las infracciones fáciles y obvias que, en primer lugar, hacen de un sitio un objetivo fácil.

¿Necesito una página de declaración de accesibilidad?

No es un requisito legal, pero es una buena práctica. Una página breve que indique su compromiso con la accesibilidad, enumere el estándar al que se dirige (WCAG 2.2 AA) y proporcione un método de contacto para informar barreras muestra buena fe y brinda a los usuarios un canal distinto a una demanda.

¿Con qué frecuencia debo volver a comprobar la accesibilidad?

Como mínimo, después de cada actualización del tema, cada instalación de una nueva aplicación y cada lanzamiento de contenido importante (nuevas páginas de colección, nuevas páginas de destino). Muchas tiendas establecen un recordatorio trimestral para realizar un análisis completo incluso si no ha cambiado nada obvio.

¿Solucionar los problemas de accesibilidad ralentizará mi tienda?

Generalmente lo contrario. El HTML semántico, el marcado limpio y menos scripts de terceros inflados (las mismas correcciones que mejoran la accesibilidad) también tienden a mejorar la velocidad de la página. Los dos objetivos rara vez entran en conflicto.

Devmerx

Devmerx es una agencia de desarrollo de Shopify y WordPress que ayuda a las marcas de DTC a crear tiendas más rápidas, migraciones más limpias y experiencias de mayor conversión. Con sede en Londres, Reino Unido, presta servicios a clientes de todo el mundo.

Ver nuestro trabajo

¿Necesitas ayuda con tu tienda Shopify?

Devmerx crea y optimiza tiendas Shopify para marcas DTC. Reserve una consulta gratuita de 20 minutos.