Usa los shortcodes de POM de forma accesible

La accesibilidad depende del contenido y los ajustes que se suministren a cada elemento. Revisa la página publicada como lo haría un visitante, no solo la vista previa del maquetador.

Encabezados y orden de lectura

  • Usa los niveles de encabezado de Title para describir la jerarquía de la página.
  • Mantén un orden de origen significativo cuando las columnas se apilan.
  • No elijas un nivel de encabezado solo por su tamaño visual.
  • Da a cada sección un encabezado visible cuando ayude a los visitantes a entender el contenido.
  • Escribe un texto de botón que describa el resultado de activarlo.
  • Usa Button Aria-Label cuando la etiqueta visible necesite más contexto.
  • No uses un icono como única etiqueta a menos que el componente proporcione un nombre accesible.
  • Confirma que los enlaces y controles sigan siendo distinguibles sin depender únicamente del color.
  • Al abrir otra ventana, deja claro ese resultado para el visitante.

Contenedores interactivos

Para acordeones, pestañas, modales, paneles fuera del lienzo, deslizadores y carruseles:

  1. Prueba cada activador con un teclado.
  2. Confirma que el foco se mueva o permanezca en una ubicación predecible.
  3. Confirma que los controles tengan etiquetas comprensibles.
  4. Evita el movimiento automático que impide leer.
  5. Asegúrate de que los paneles ocultos no creen anuncios duplicados.

Las celdas del carrusel que están fuera del área de visualización visible se eliminan de la navegación por teclado y de las tecnologías de asistencia hasta que se vuelven visibles.

Imágenes, vídeo y mapas

  • Proporciona texto alternativo significativo para las imágenes informativas.
  • Usa texto alternativo vacío para las imágenes puramente decorativas.
  • Proporciona subtítulos o transcripciones para los medios grabados esenciales.
  • No reproduzcas audio automáticamente.
  • Asegúrate de que la información de los mapas también esté disponible en texto cuando sea necesaria para completar una tarea.

Formularios y resultados dinámicos

Usa etiquetas e instrucciones visibles. Verifica los mensajes de validación, los campos obligatorios, los estados de carga, los resultados vacíos y el envío correcto sin depender únicamente del color o del movimiento. Los controles de Faceted Search deberían anunciar su propósito y mantener un orden de teclado lógico.

Visibilidad por dispositivo

No ocultes contenido esencial de un área de visualización. Al mantener versiones visuales separadas, asegúrate de que los visitantes se encuentren solo con una versión equivalente a la vez.

Verificación

Revisa la navegación por teclado, la visibilidad del foco, el orden de los encabezados, las etiquetas, el texto alternativo, el contraste, el zoom y el comportamiento de movimiento reducido en la página pública.