Ana içeriğe geç

2.4.8 Konum

Kullanıcıların bir sayfa kümesi içinde nerede olduklarını anlamalarına yardımcı olacak bilgiler sunulmalıdır.

SC Kodu: 2.4.8 Seviye: AAA
URL: https://www.w3.org/TR/WCAG22/#location

Genel Tanım​

WCAG 2.4.8, kullanıcıların bir web sitesi veya uygulama içinde nerede bulunduklarını kolayca anlayabilmelerini gerektirir. Sayfanın veya içeriğin konumu, kullanıcıya açık ve anlaşılır şekilde sunulmalıdır.

Faydalar​

  • Yön Bulma Kolaylığı: Kullanıcılar nerede olduklarını bilir.
  • Bilişsel Yükü Azaltır: Site yapısı daha anlaşılır olur.
  • Erişilebilirlik: Yardımcı teknolojilerle daha iyi gezinme sağlar.

Kapsam

  • Menü ve alt menüler
  • Çok seviyeli sayfalar
  • Form adımları (stepper)
  • Büyük içerik ve dokümantasyon siteleri

Ana Amaç​

Bu kriterin temel amacı, özellikle görme engelli, bilişsel zorlukları olan veya ekran okuyucu kullanan kullanıcıların site yapısı içinde kaybolmasını önlemektir.

Gereksinimler

  • Kullanıcının bulunduğu konum açıkça belirtilmelidir
  • Konum bilgisi programatik olarak da erişilebilir olmalıdır
  • Navigasyon yapısı tutarlı olmalıdır

En İyi Uygulamalar​

  • Breadcrumb (ekmek kırıntısı) kullanın.
  • Aktif menü öğesini görsel olarak vurgulayın.
  • Sayfa başlıklarını hiyerarşik ve açıklayıcı yapın.
  • “Buradasınız” göstergeleri ekleyin.

Örnekler ve Açıklamalar​

Örnek: Breadcrumb Kullanımı​

Ana Sayfa › Hizmetler › Erişilebilirlik › WCAG 2.4.8

Bu yapı, kullanıcının site içindeki konumunu net biçimde gösterir.

Nelerden Kaçınılmalı?

Kullanıcının bulunduğu sayfanın menü veya yapı içinde belirtilmemesi.

HTML/CSS

<nav>
  <a href="/home">Ana Sayfa</a>
  <a href="/services">Hizmetler</a>
  <a href="/accessibility">Erişilebilirlik</a>
</nav>

Açıklama:

Bu örnekte aktif sayfa belirtilmediği için kullanıcı nerede olduğunu anlayamaz. Bu durum WCAG 2.4.8 kriterini karşılamaz.

Ne Yapılmalı?

Aktif konum açıkça gösterilmelidir.

HTML/CSS

<nav aria-label="Breadcrumb">
  <ol>
    <li><a href="/home">Ana Sayfa</a></li>
    <li><a href="/services">Hizmetler</a></li>
    <li aria-current="page">Erişilebilirlik</li>
  </ol>
</nav>

Açıklama:

Bu yapı, kullanıcının mevcut konumunu hem görsel hem de programatik olarak belirtir. WCAG 2.4.8 kriterini karşılar.