html - w3schools - ¿Por qué `ul` tiene el papel de ARIA` menu` pero `menuitem` está prohibido para` li`?
wai aria roles (5)
Solo cubrí algunas especificaciones de Strage con respecto a los roles de ARIA . ¿Por qué ul tiene el menu roles de ARIA pero está prohibido el menuitem para li ?
Me gustaría describir una barra de navegación utilizando los elementos de navegación ul , li y HTML5 en combinación con los roles, el menu y el menu ARIA.
<!DOCTYPE html>
<html>
<head><title>ARIA role bug?</title></head>
<body>
<nav role="navigation">
<ul role="menu">
<li role="menuitem"><a href="http://example.com/">example.com</a></li>
</ul>
</nav>
</body>
</html>
El validador HTML5 de W3 me molesta aquí:
Menuitem de mal valor para el rol de atributo en el elemento li.
El validador W3C, al aplicar las reglas HTML5, en realidad compara con (alguna versión de) el WHATWG "Living HTML standard", que actualmente dice, en la cláusula 3.2.7 WAI-ARIA , sobre "el elemento li cuyo elemento principal es un elemento ol o ul "Lo siguiente:" El rol debe ser listitem, menuitemcheckbox, menuitemradio, option, tab o treeitem ".
Esto corresponde a las reglas en el borrador del W3C "Usar WAI-ARIA en HTML", en la Tabla de Recomendaciones 2.9.
Estaba usando un DOM similar y cambiando el rol de un submenú li a la presentation hice que la página se validara. Aunque quizás sea semánticamente incorrecto, en mi situación es intrascendente.
Jukka es incorrecta aquí . El validador W3C no compara con el WHATWG LS, en su lugar, compara con la especificación HTML de W3C . La especificación HTML de W3C es la fuente autorizada para los requisitos de verificación de conformidad para el Validador W3C.
En lo que respecta a menuitem no se permite según la especificación de HTML, creo que esto es un error. Y como tal he archivado un error . Ahora está en mi cola de errores para ser resuelto.
También he presentado un error contra el validador W3C y wai-aria en HTML doc. Hasta que se corrija el validador, sugiero que utilice los roles según la especificación WAI-ARIA e ignore el validador.
apéndice:
Revisé la historia de la integración de ARIA en HTML y no encontré ninguna razón por la que no se permitiera el uso de menuitem , por lo que creo que fue un descuido. Arreglé y resolví el error al que hacía referencia arriba.
La siguiente marca HTML está en la especificación de ARIA en sí misma (la que usted vinculó), y muestra claramente que se utiliza un LI (anidado, incluso) como menuitem. Supongo que el marcado particular que está utilizando lo está forzando a no conformarse, pero eso es solo una corazonada.
<ul role="menubar">
<!-- Rule 2A: "File" label via aria-labelledby -->
<li role="menuitem" aria-haspopup="true" aria-labelledby="fileLabel"><span id="fileLabel">File</span>
<ul role="menu">
<!-- Rule 2C: "New" label via Namefrom:contents -->
<li role="menuitem">New</li>
<li role="menuitem">Open…</li>
…
</ul>
</li>
…
</ul>
No debe poner role = "menuitem" en un elemento li cuando contiene un elemento a, ya que un widget de elemento no puede contener ningún elemento interactivo (por ejemplo, enlaces).
Eche un vistazo a los ejemplos de aria-practices para el menú.
<li role="none">
<a role="menuitem">my menuitem here</a>
</li>
o
<li role="menuitem">my menuitem here</li>