Editor del boletín de noticias: Realizar la prueba de accesibilidad

Tiempo de lectura: 2 min
Los correos electrónicos accesibles son la clave de la inclusión. Garantizan que todos los destinatarios, independientemente de sus capacidades o limitaciones, puedan entender fácilmente sus contenidos. Su mailing proporciona una mejor experiencia al usuario, refuerza su marca e incluso puede generar mayores tasas de conversión.

En nuestro artículo Criterios para las pruebas de accesibilidad de sus correos electrónicos hemos resumido más información y mostrado lo importantes que son las pruebas de accesibilidad.

Cómo funciona el test de accesibilidad en nuestro editor de boletines:

  1. Abra el mailing para el que desea realizar la prueba a través de la opción de menú Emails.


  2. Arriba a la derecha, en Vista previa, encontrará el elemento Test de accesibilidad.

  3. Se abre una ventana emergente en toda la página. Aquí puede Ver su cuota de pruebas existente, realizar pruebas, comprar más pruebas y recuperar pruebas anteriores.

  4. Haga clic en Iniciar prueba de accesibilidad. Su mailing será escaneado y recibirá el siguiente resumen:


    En la pestaña Mejoras encontrará los criterios que debe ajustar. Haga clic en la flecha hacia abajo de la derecha para obtener más información y ver qué fragmento HTML está afectado. En la tabla Explicaciones de los ID de las reglas (sugerencias de mejora), al final de este artículo, encontrará más explicaciones.
  5. Haga clic en la x de la esquina superior derecha para volver al editor y ajustar allí las sugerencias de mejora.
  6. Vuelva a hacer clic en Vista previa una vez que haya realizado los ajustes > Prueba de accesibilidad. Puede hacer clic en Recuperar prueba anterior (véase el paso 3 de la captura de pantalla) para volver a ver las sugerencias o hacer clic en Iniciar prueba de accesibilidad para volver a ejecutar la prueba y comprobarla. para volver a ejecutar la prueba.

Explicaciones de los ID de las reglas (sugerencias de mejora tras la prueba)

El test de accesibilidad comprueba si su mailing cumple estas normas (véase la captura de pantalla paso 4):

Regla ID Descripción
teclas de acceso Garantiza que cada valor de atributo accesskey es único
área-alt Garantiza que los elementos del área <> de los mapas de imagen tengan texto alternativo.
aria-allowed-attr Garantiza que los atributos ARIA están permitidos para la función de un elemento
aria-allowed-role Asegura que el atributo role tiene un valor apropiado para el elemento
aria-hidden-body Asegura que aria-hidden='true' no está presente en el cuerpo del documento.
aria-progressbar-name Garantiza que cada nodo de la barra de progreso ARIA tenga un nombre accesible
aria-required-attr Garantiza que los elementos con funciones ARIA tengan todos los atributos ARIA necesarios.
aria-required-children Garantiza que los elementos con una función ARIA que requieren funciones secundarias las contienen.
aria-required-parent Garantiza que los elementos con un rol ARIA que requieren roles padre están contenidos por ellos.
aria-roledescription Garantizar que aria-roledescription sólo se utilice en elementos con una función implícita o explícita.
aria-roles Garantiza que todos los elementos con un atributo role utilicen un valor válido
aria-toggle-field-name Garantiza que todos los campos ARIA tengan un nombre accesible.
aria-tooltip-name Garantiza que todos los nodos de información sobre herramientas ARIA tengan un nombre accesible.
aria-valid-attr-value Garantiza que todos los atributos ARIA tengan valores válidos
aria-valid-attr Garantiza que los atributos que empiezan por aria- son atributos ARIA válidos
contraste de color Garantiza que el contraste entre los colores de primer plano y de fondo cumple los umbrales mínimos de relación de contraste de las WCAG 2 AA.
tipo de contenido Garantiza la definición del "meta content-type" y del juego de caracteres
lista de definiciones
Garantiza la correcta estructuración de los elementos de <dl>
dlitem
Asegura que los elementos <dt> y <dd> están contenidos por un <dl>
título del documento

Garantiza que cada documento HTML contenga un elemento no vacío <title>

duplicar-id Garantiza que cada valor del atributo id sea único
encabezamiento vacío Asegúrese de que los encabezamientos tengan un texto discernible
encabezamiento-orden Garantiza que el orden de los títulos sea semánticamente correcto.
html-has-lang Garantiza que todos los documentos HTML tengan un atributo lang
html-lang-valid Garantiza que el atributo lang del elemento <html> tiene un valor válido.
html-xml-lang-mismatch Garantizar que los elementos HTML con atributos lang y xml:lang válidos coincidan en el idioma base de la página.
imagen-alt Garantiza que los elementos <img> tengan texto alternativo o un rol de ninguno o presentación
imagen-redundante-alt Asegúrese de que la alternativa de imagen no se repite como texto
justificación Asegura que el contenido del cuerpo no está alineado al centro
landmark-no-duplicate-main Garantiza que el documento tenga como máximo un hito principal
hito-único Los hitos deben tener una combinación única de función o función/etiqueta/título (es decir, un nombre accesible).
nombre del enlace Asegúrese de que los enlaces tengan un texto discernible
lista Garantiza la correcta estructuración de las listas
listitem

Garantiza el uso semántico de los elementos <li>

meta-viewport-large Garantiza que <meta name="viewport"> pueda escalar una cantidad significativa.
meta-viewport Garantiza que <meta name="viewport"> no desactive la ampliación y el zoom del texto.
objeto-alt Garantiza que los elementos del objeto <> tengan texto alternativo
page-has-heading-one Asegúrese de que la página, o al menos uno de sus marcos, contiene un encabezamiento de nivel uno.
presentación-rol-conflicto Marca los elementos cuya función es ninguna o presentación y que hacen que se active la resolución de conflictos de funciones.
rol-img-alt Garantiza que los elementos [role='img'] tengan texto alternativo
tabindex Garantiza que los valores del atributo tabindex no sean superiores a 0
mesa-roles Garantiza la definición de las funciones de las mesas
svg-img-alt Garantiza que los elementos de <svg> con una función img, graphics-document o graphics-symbol tengan un texto accesible.
valid-lang Garantiza que los atributos lang tengan valores válidos

Ayuda & Soporte

Si tiene alguna duda o necesita ayuda, siempre puede ponerse en contacto con nuestro equipo de servicio.