birden çok <nav> etiketi


100

Html5'te aynı sayfada birden fazla etiket kullanabilir miyiz?

Okuduğum ettik bu Zeldman.com makalesine ama tamamen bana açık değil

yani

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

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

1
Rol = 'ana', sitenizin w3.org/TR/wai-aria/roles#main ana içeriğini tanımlamak içindir ve blogroll için bir rol yoktur. Mikro verileri - schema.org'u kullanmak istediğinizi düşünüyorum .
Andrew Luhring

Yanıtlar:


144

Evet kesinlikle. Birden fazla header, navve footeretiketiniz olabilir.

Etiketleri anlamsal olarak kullandığınızdan ve geçersiz yerlere koymadığınızdan emin olduğunuz sürece (bunlar blok düzeyinde öğelerdir, bu nedenle bunları örneğin bir satır içi öğenin içine koyamazsınız), o zaman yapmalısınız Yapıştırıcıların söyledikleri hakkında fazla endişelenme. Projenizde ilerlemek yerine küçük detaylar hakkında tartışmaya kapılmak çok kolay.


2
Aynı altbilgide birden fazla gezinmeye ne dersiniz?
igasparetto

4
@igasparetto Tamamen geçerlidir, özellikle onu içeriğin yapısını temsil edecek şekilde kullanıyorsanız ve sadece şekillendirme kolaylığı için değil.
coreyward

Gezinme türleri için hangi standart etiketlerin kullanılması gerektiğine dair herhangi bir rehber var mı? Özellikle: ana gezinme, alt gezinme, yardımcı program navigasyonu (örn. Hızlı bağlantılar) ve altbilgi gezintisi? Ayrıca, <nav>zaten bir <footer>etiketin içindeyse, uygulamak gereksiz aria-label="footer navigation"mi?
chunk_split

1
@chunk_split StackOverflow'un doğru topluluk olduğundan emin olmasam da yeni bir soru sorsan daha iyi olur. ARIA özelliklerine gelince, gereksiz görünseler bile bunları eklemek güvenlidir.
2019

3

Cevap Evet. Daha <nav>fazla bilgi için mdn <nav>belgelerine bakın, altbilgide bir etiket olabilir .


Yetkili bir bağlantı sağlayan iyi iş. Bağlantılı sayfada, Kullanım Notlarında, özellikle "bir belgenin birkaç <nav>öğesi olabilir " ifadesi yer alır.
Ed Gibbs

3

Evet, birden fazla <nav>öğeye sahip olmak kesinlikle sorun değil.

Sadece ekran okuyucu kullanan kişiler için onları ayırt edilebilir hale getirdiğinizden emin olmalısınız. Her birini <nav>kullanarak etiketleyerek yapabilirsiniz aria-label.

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

Veya, <nav>ekranda etiketleme öğesi olarak tanımlanabilen görünür metinlerden biri varsa , aria-labelledbyaşağıdaki gibi kullanabilirsiniz :

<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>

Birden Çok Gezinme İşaretini kullanma hakkında daha fazla bilgi edinebilirsiniz .

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.