region
El contenido de la página debería estar dentro de regiones de referencia
Comprueba que el contenido bajo <body> esté contenido dentro de una región de referencia.
Ámbito de aplicación. Se aplica a una página propia (no a un documento mostrado en un frame, que está dentro de las regiones de referencia del documento superior) cuyo <body> tiene contenido: fuera de cualquier región de referencia, un elemento con texto propio o un aria-label, un <img>, <video>, <audio>, <canvas>, <object> o <embed>, o un <input> que no sea type="hidden"; o una región de referencia con cualquier cosa dentro. Las regiones live, los dialog, los button, los <svg>, los <iframe>/<frame> y los skip-link resolubles no son contenido que necesite una región de referencia. No mientras haya un diálogo modal abierto: el resto de la página es inerte entonces, así que el análisis ve el diálogo, no la página. El contenido que coincide con excludeSelectors (global o para esta regla) se deja fuera, y un hueco informado nunca lo incluye. Un elemento personalizado cuyos ElementInternals le dan un rol de landmark (this.attachInternals().role), sin un atributo role que nombre otro, es un landmark como lo es un elemento nativo con ese rol.
Resultado esperado. Cada pieza de contenido de nivel superior de la página vive dentro de una región de referencia (main, navigation, banner, contentinfo, complementary, region, form, search), de modo que los usuarios de tecnología de asistencia que navegan por regiones de referencia no se pierdan contenido que nunca se colocó dentro de una.
Ejemplos
<body><main><p>Everything lives inside a landmark.</p></main></body>
Todo el contenido de la página está contenido dentro de una región de referencia.
<body><p>Stray paragraph, not inside any landmark.</p></body>
Este párrafo está directamente bajo <body>, fuera de toda región de referencia.
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
CONTENT_OUTSIDE_LANDMARK
- Localizar en la página el contenido que indica el informe (o el iframe).
- Abrir el panel Accesibilidad de las herramientas para desarrolladores, o la lista de puntos de referencia de un lector de pantalla, y ver qué punto de referencia lo contiene, si lo hay.
- Decidir si corresponde a un punto de referencia existente (header, nav, main, footer, aside) o si está fuera de todos.
Se cumple. El contenido está dentro de un punto de referencia, o es algo que no lo necesita (como un enlace de salto o un diálogo).
No se cumple. Contenido real de la página queda fuera de todos los puntos de referencia, así que quienes navegan por puntos de referencia pueden pasarlo por alto (buena práctica, ARIA11).