beberapa tag <nav>

97

Bisakah kita menggunakan beberapa tag pada halaman yang sama di html5?

Saya telah membaca artikel ini di Zeldman.com tetapi tidak sepenuhnya jelas bagi saya

yaitu

<header><nav>links here</nav></header>

<footer><nav>links here</nav></footer>

html

— stephenmurdoch.dll
sumber

1

Role = 'main' adalah untuk mengidentifikasi konten utama situs Anda w3.org/TR/wai-aria/roles#main , dan tidak ada peran untuk blogroll. Saya pikir Anda bermaksud menggunakan microdata - schema.org .

— Andrew Luhring

142

Ya, tentu saja. Anda dapat memiliki beberapa header, navdan footerhukuman tag sans.

Selama Anda memastikan Anda menggunakan tag secara semantik dan tidak menempatkannya di tempat yang tidak valid (itu adalah elemen tingkat blok, jadi Anda tidak dapat meletakkannya di dalam elemen sebaris, misalnya) maka Anda tidak boleh Jangan terlalu khawatir tentang apa yang dikatakan para pengacau. Sangat mudah untuk terjebak berdebat tentang detail kecil alih-alih melanjutkan proyek Anda.

— ke inti
sumber

2

Bagaimana dengan beberapa navigasi di footer yang sama?

— igasparetto

4

@igasparetto Sepenuhnya valid, terutama jika Anda menggunakannya dengan cara yang mewakili struktur konten dan tidak hanya untuk kenyamanan gaya.

— coreyward

Apakah ada panduan tentang label standar apa yang harus digunakan untuk jenis navigasi? Secara khusus: navigasi utama, subnavigasi, navigasi utilitas (misalnya tautan cepat) dan navigasi footer? Selain itu, jika <nav>sudah ada di dalam <footer>tag, apakah itu berlebihan untuk diterapkan aria-label="footer navigation"?

— chunk_split

1

@chunk_split Saya rasa sebaiknya Anda mengajukan pertanyaan baru, meskipun saya tidak yakin StackOverflow adalah komunitas yang tepat. Sedangkan untuk atribut ARIA, Anda dapat menambahkannya dengan aman meskipun terlihat berlebihan.

— coreyward

3

Jawabannya iya. Anda dapat memiliki <nav>tag di footer, untuk info lebih lanjut periksa dokumentasi mdn<nav> .

— harold ramos
sumber

Kerja bagus menyediakan tautan otoritatif. Halaman tertaut, dalam Catatan Penggunaannya, secara spesifik menyatakan "dokumen mungkin memiliki beberapa <nav>elemen".

— Ed Gibbs

2

Ya, memiliki banyak <nav>elemen tidak apa-apa.

Anda hanya perlu memastikan bahwa Anda membuatnya dapat dibedakan untuk orang yang menggunakan pembaca layar. Anda dapat melakukannya dengan memberi label masing <nav>- masing menggunakan aria-label.

<nav aria-label=’primary’>
  <ul>
    ...List on links here...
  </ul>
</nav>
<nav aria-label=’secondary’>
  <ul>
    ...List on links here...
  </ul>
</nav>

Atau, jika salah satu <nav>teks yang terlihat di layar yang dapat diidentifikasi sebagai elemen pelabelan, Anda dapat menggunakan aria-labelledbyseperti berikut:

<nav aria-label="Site Menu">
  <ul>
    ...List on links here...
  </ul>
</nav>
<article>
  <h1>Title</h1>
  ...
  <nav aria-labelledby="id-1">
    <h2 id="id-1">
      Related Content
    </h2>
    <ul>
      ...List on links here...
    </ul>
  </nav>
</article>

Anda dapat membaca selengkapnya tentang menggunakan Beberapa Landmark Navigasi .

— lucalanca.dll
sumber