Nav ve main

<nav> ve <main> etiketleriyle sayfanın ana bölümlerini işaretlersin.

Nav etiketi

<nav> etiketi sayfanın asıl menüsünü işaretler. İçine bir liste biçiminde bağlantılar konur. Böylece ekran okuyucular 'menü burada' der ve kullanıcı menüye atlayabilir.

Örnek: <nav><ul><li><a href="/ana-sayfa">Ana sayfa</a></li><li><a href="/about">Hakkında</a></li></ul></nav>. Yalnızca asıl menü için <nav> kullanılır; sayfadaki tüm bağlantıları sarmak için değil.

Main etiketi

<main> etiketi sayfanın ana içeriğini işaretler. Bir sayfada yalnızca bir <main> olur ve içinde başlık, menü ya da alt bilgi değil, sayfanın asıl anlattığı içerik yer alır.

Örnek: <main><h1>Yazı Başlığı</h1><p>Yazı metni...</p></main>. Ekran okuyucu kullanıcıları 'ana içeriğe atla' deyince buraya gelir. Arama motorları da asıl içeriği böylece ayırt eder.

Uygulama Menü ve ana içeriği yaz

Body içine bir <nav> ve bir <main> ekle. Nav içine bir <ul> ve içinde bir <li> olsun; <li>'nin içine <a href="/about">Hakkında</a> yaz. Main içine bir <h1> ekle ve metni Hakkımızda olsun.

Örnek çözümü göster

<body>
  <nav>
    <ul>
      <li><a href="ben-kimim.html">Hakkında</a></li>
    </ul>
  </nav>
  <main>
    <h1>Hakkımızda</h1>
  </main>
</body>

Kendini test et

Bir sayfada kaç <main> etiketi olur?
- İki
- Üç
- Bir
- Sınırsız
Cevabı göster

Bir — Doğru. main sayfada yalnızca bir kez kullanılır.

Nav etiketini yaz

<____>
  <ul>
    <li><a href="/ana-sayfa">Ana sayfa</a></li>
  </ul>
</nav>

Cevabı göster

<nav>
  <ul>
    <li><a href="/ana-sayfa">Ana sayfa</a></li>
  </ul>
</nav>

Etiketi rolüyle eşleştir

<nav>

Asıl menü
<main>

Ana içerik
<ul>

Liste kabı
<a>

Bağlantı

Sıradaki ders: Article ve section

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler