Si può utilizzare un <a parte> elemento all’interno di una <sezione role=“main”> elemento?

Io sono nel processo di miglioramento dell’accessibilità nel mio HTML utilizzando HTML5 e WAI-ARIA.

È OK per avere la seguente configurazione?

<!-- main content -->
<section id="main" role="main">
    <h1>The main content</h1>

    <!-- This div needs to be here for styling reasons -->
    <div class="the-content">    
         <p>All the text that goes with the main content</p>
    </div>

    <!-- the sidebar -->
    <aside id="sidebar" role="complementary">
        <h2>A title</h2>
        <p>Some text</p>
    <aside>
</section>

La cosa che non so è se devo avere il <aside> elemento al di fuori del <section> e il role="main" contenitore. Che importa?

  • Il titolo di questa domanda è fuorviante. Ciò implica che si sta chiedendo di mettere un <aside> elemento all’interno di una <main> elemento, mentre il codice che hai è un <aside> all’interno di un genitore <section>
  • Ho aggiornato il titolo, grazie per la macchia.
InformationsquelleAutor shrewdbeans | 2013-07-09



4 Replies
  1. 7

    Sì, è il <aside> all’interno del <section> è perfettamente valido, markup e passa la validazione W3C, se è quello che siete preoccupati.

    Il <section> elemento permette il flusso di contenuti all’interno di, che possono includere il <aside> elemento – tuttavia, se si sta utilizzando solo le sezioni per lo styling scopi, probabilmente si dovrebbe essere utilizzando un div, invece.

    A parte che (pun intended) ho i miei dubbi sul role=main parte valido – come, il ruolo unico attributo valori ammessi su <section> elementi sono riportati di seguito:

    Default ARIA semantica:

    role=region.

    Quali Altri ruoli ARIA, gli stati e le proprietà possono essere utilizzati?

    alert, alertdialog, application, contentinfo, dialog, document, log,
    marquee, search, o status.

    Globale di aria-* attributi e le eventuali aria-* attributi applicabili per
    il permesso di ruoli.

    Piuttosto che in particolare non comprende il main ruolo.

  2. 3

    Spec (editor di progetto che già include main) non permette il nido il main elemento all’interno di article, aside, footer, header o nav, ma non dice nulla di nidificazione di questi elementi all’interno main. Inoltre, fornisce due esempi che utilizzano article e nav (intra-documento di navigazione) all’interno main. Così almeno aside, annidati nei article o section (e, quindi, l’ambito per il suo livello), deve essere ammesso. Posso anche immaginare il caso in cui una parte dei contenuti, con alcune info integrativa all’interno (come nel oltre esempi di utilizzo nelle WCAG Wiki) può formare insieme il contenuto principale della pagina, quindi non credo che la disattivazione sarebbe ragionevole.

    D’altra parte, la struttura dell’algoritmo (che ora sembra essere la ragione principale per l’esistenza di tutti suddividere il contenuto, tra cui aside) è ancora segnato come ‘a rischio’, quindi, la definizione di questi elementi possono cambiare alcuni chiarimenti possono essere aggiunti.

    Probabilmente ci si dovrebbe porre questa domanda a HTML5 spec editor?

  3. 2

    Ho concorrere con Darren riferimento a cui si rilascia il tag. Inoltre, il tagging è un po ‘ strambo. Vari tag WAI-ARIA ruoli in modo nativo, mentre sì, è possibile sovrascrivere nativo ruoli, ma perché? Questo post WAI-ARIA sul Paciello Gruppo blog parla di più. Ex:

    Insstead di utilizzare

    <section id="main" role="main">

    che si potrebbe utilizzare <main>, il che significa la stessa cosa, e di migliori prassi. Il <aside> tag ha il ruolo complementare aggiunti nativamente, che è come dire il Mio nome è Ryan, è davvero il mio nome è Ryan.

    • Ho sentito da qualche parte che è ragionevole per aggiungere il ruolo di HTML5 elementi per la massima compatibilità, è vero?
    • L’unico che ho sentito questo argomento è <nav>. Avrei bisogno di rivedere le fonti prima di commentare ulteriormente.
    • Conincidentally stavo leggendo un articolo su il <principale> elemento da Bruce Lawson, e accenna egli ancora esplicitamente aggiunge ruoli di elementi come il navigatore e il principale: brucelawson.co.it/2014/se-si-usa-html5-intestazione e piè di pagina/…
    • Effettivamente <sezione role=”main”> non è la stessa cosa che <principale> poiché il sencond non è un elemento di sezione, che è davvero una proprietà utile se siete preoccupati per la struttura del documento (e si dovrebbe)!

Lascia un commento