it-swarm-es.tech

Elemento principal de HTML5 versus función de referencia de ARIA = "principal"

Estoy interesado en obtener más información sobre la relación y las posibles distinciones entre HTML5 <main> elemento y el atributo de rol de referencia ARIA role="main".

Tengo la impresión de que el propósito de la <main> elemento es asignar el atributo roll ARIA role="main" en un elemento HTML específico. ¿Pero eso lo resume?

¿Hay beneficios al usar <main> sobre, digamos, <div role="main">? ¿O estos, por ahora y el futuro previsible, darán el mismo resultado?

Cualquier idea para comparar los siguientes ejemplos sería muy apreciada:

<body>
  <main>
    <p>Paragraph</p>
  <main>
</body>
<body>
  <main role="main">
    <p>Paragraph</p>
  <main>
</body>
<body>
  <div role="main">
    <p>Paragraph</p>
  <div>
</body>
24
Stuart Kershaw

Según HTML5 Doctor, son equivalentes. <main> solo hace que sea más fácil y ordenado implementar role="main".

El propósito principal de es mapear el rol principal de ARIA a un elemento en HTML.

Aquí hay una descripción general de la <main> elemento.

El elemento main representa el contenido principal del body de un documento o aplicación. El área de contenido principal consiste en contenido que está directamente relacionado o se expande sobre el tema central de un documento o la funcionalidad central de una aplicación.

Recomendación

Se recomienda usar use tanto <main> y role="main" en el mismo elemento hasta que los navegadores implementen <main> correctamente.

<!-- Recommended -->
<main role="main">
    ...
</main>

Asegúrese de leer el <main> spec si estás interesado.

Nota sobre seccionamiento

Como Szabolcs señala en los comentarios, <main> no es un elemento de sección, por lo que debe usarse junto con un <section> elemento.

Referencias

25
Daniel Imms