murattunalı.

Bölge yapısı ve atlama bağlantısı.

Bölge yapısı, bir sayfanın başlık, gezinme, ana içerik ve alt bilgi gibi bölümlerinin HTML'de açıkça işaretlenmesidir ve ekran okuyucu kullanıcısının sayfada gezinme biçimini doğrudan belirler.

Gören bir kullanıcı sayfayı bir bakışta tarar: menü üstte, içerik ortada, alt bilgi aşağıda. Bu tarama, düzenin görsel ipuçlarından — konum, boşluk, çizgi — anında okunur. Ekran okuyucu kullanıcısının böyle bir bakışı yoktur; sayfayı doğrusal olarak, baştan sona dinler. Bölge yapısı, o kullanıcıya kaybettiği bakışı geri veren şeydir.

Bölgeler işaretlendiğinde ekran okuyucu, kullanıcıya sayfanın bölümler listesini sunabilir ve kullanıcı doğrudan istediğine atlayabilir. İşaretlenmediğinde tek seçenek baştan dinlemektir — her sayfada, menü dahil.

Bölge öğeleri ve karşılıkları

HTML, bölgeleri işaretlemek için hazır öğeler sunar ve bunları kullanmak, aynı işi rol bildirimleriyle yapmaktan hem kısa hem güvenlidir. Öğe kullanıldığında rol otomatik gelir.

  1. Başlık bölgesi — sayfanın üst şeridi: logo, ana gezinme, dil değiştirici. Sayfada bir tane olmalı.
  2. Gezinme bölgesi — bağlantı grupları. Birden fazla olabilir (ana menü, alt bilgi menüsü, kırıntı yolu) ve o zaman her birinin ayırt edici bir adı olmalı.
  3. Ana içerik bölgesi — sayfaya özgü içerik. Sayfada bir tane, ve atlama bağlantısının hedefi burasıdır.
  4. Tamamlayıcı bölge — içerikle ilgili ama ondan ayrılabilen malzeme: yan sütun, ilgili bağlantılar.
  5. Alt bilgi bölgesi — telif, yasal bağlantılar, iletişim.
  6. Arama bölgesi — arama formu için ayrı bir rol vardır ve arama sayfada belirginse kullanılmalıdır.

Birden fazla gezinme bölgesi olduğunda her birinin adlandırılması kritik hâle gelir. Adsız üç gezinme bölgesi, ekran okuyucu listesinde «gezinme, gezinme, gezinme» olarak görünür ve kullanıcı hangisinin ana menü olduğunu bilemez. Adlandırma bir etiketle yapılır ve tek satırlık bir iştir.

Aynı sorun ana içerik bölgesinin birden fazla olmasında da çıkar: sayfada iki ana içerik varsa hangisinin gerçek içerik olduğu belirsizleşir. Kural basittir — bir sayfada bir ana içerik bölgesi.

Atlama bağlantısı: neden gerekli

Her sayfanın başında aynı gezinme menüsü duruyorsa, klavye kullanıcısı her sayfada o menünün tamamını geçmek zorundadır. Yirmi bağlantılı bir menüde bu, içeriğe ulaşmak için yirmi tuş vuruşu demektir — ve site içinde on sayfa gezen biri için iki yüz gereksiz tuş vuruşu.

2.4.1 «Blokları Atlama» tam olarak bunu çözer ve A seviyesindedir — yani karşılanmaması temel bir ihlaldir. En yaygın çözümü, sayfanın ilk odaklanabilir öğesi olarak doğrudan ana içeriğe atlayan bir bağlantı koymaktır.

Bağlantı normalde görünmez, ama odaklandığında görünür hâle gelir. Bu davranış önemlidir: görünmeden odaklanabilir bırakmak, kullanıcının ilk Tab'da nereye gittiğini bilmemesine yol açar. Ekranın dışına taşınmış ama odakta içeri kayan bir kalıp, bunun standart çözümüdür.

Sık yapılan iki hata

Atlama bağlantısı basit görünür ama iki noktada sessizce bozulur ve ikisi de test edilmeden fark edilmez.

Birincisi: bağlantı yalnızca kaydırıyor, odağı taşımıyor. Görsel olarak çalışıyormuş gibi görünür — sayfa gerçekten ana içeriğe kayar — ama bir sonraki Tab kullanıcıyı menünün başına geri götürür, çünkü odak hiç hareket etmemiştir. Hedef öğenin odaklanabilir hâle getirilmesi bunu çözer.

İkincisi: bağlantı odaklandığında da görünmüyor. Ekran dışına taşıma tekniği, odak durumunda geri getirmeyi unutursa bağlantı erişilebilir kalır ama kullanılamaz hâle gelir — kullanıcı ilk Tab'da odağı kaybeder ve nereye bastığını bilmez. Test yöntemi tektir: sayfayı aç, tek Tab'a bas, bağlantıyı GÖR.

Yalnız kaydıran bir atlama bağlantısı, çalışıyormuş gibi görünen ama çalışmayan bir özelliktir.

Bölge yapısı ve başlık hiyerarşisi birlikte çalışır

Bölgeler ve başlıklar, ekran okuyucu kullanıcısının iki ayrı gezinme aracıdır ve birbirinin yerine geçmezler. Bölgeler sayfanın kabaca kaç bölümü olduğunu söyler; başlıklar o bölümlerin içindeki yapıyı verir. Biri olmadan diğeri eksik kalır.

Pratik sonuç: bölgeleri işaretleyip başlık hiyerarşisini bozuk bırakmak, ana içeriğe hızlı atlayıp orada kaybolmak demektir. Tersi de doğrudur — kusursuz bir başlık yapısı, bölge işaretlemesi olmadan menüyü içerikten ayırmaz.

İkisini birlikte doğrulamanın pratik yolu, sayfayı yalnız yapısıyla okumaktır: tarayıcı eklentileriyle ya da geliştirici araçlarıyla sayfanın bölge ve başlık ağacı çıkarılır ve o ağaca bakıldığında sayfanın ne anlattığı anlaşılabiliyor mu diye sorulur. Anlaşılamıyorsa yapı eksiktir — CSS'in gizlediği bir düzen, ekran okuyucuda geri gelmez.

Sayfa başlığı da bir gezinme aracıdır

Bölge yapısı sayfanın içini düzenler; sayfa başlığı ise kullanıcının hangi sayfada olduğunu söyler. Ekran okuyucu, bir sayfa yüklendiğinde ilk olarak başlığı okur — yani başlık, kullanıcının duyduğu ilk şeydir ve sayfayı tanımlama işini tek başına yapar.

Bu yüzden başlığın sıralaması önemlidir: sayfaya özgü kısım ÖNDE, marka arkada olmalıdır. Her sayfası «Şirket Adı — ...» ile başlayan bir sitede, sekmeler arasında gezen bir kullanıcı her seferinde aynı kelimeleri dinler ve ayırt edici kısma ancak sonunda ulaşır. Ters sıralama, aynı bilgiyi taşıyıp dinleme süresini kısaltır.

Aynı şey tarayıcı sekmelerinde de görünür: dar sekmelerde yalnız ilk birkaç kelime okunur. Sayfaya özgü kısım öndeyse kullanıcı sekmeyi tanır; markadan başlıyorsa tüm sekmeler aynı görünür. Erişilebilirlik ve kullanılabilirlik burada da aynı çözümü işaret eder.

Yapıyı doğrulamak

Bölge ve başlık yapısının doğru olup olmadığını anlamanın en hızlı yolu, sayfayı görsel olarak değil yapısal olarak görmektir. Bunun için üç yöntem var ve üçü de birkaç dakika sürer.

  1. Tarayıcının erişilebilirlik ağacını aç — geliştirici araçlarında sayfanın yardımcı teknolojiye nasıl göründüğü bir ağaç olarak listelenir. Gördüğünüz ağaç sayfayı anlatıyor mu?
  2. Bölge listesini çıkar — bir erişilebilirlik eklentisi ya da kısa bir betik, sayfadaki bölgeleri ve adlarını listeler. Adsız ya da tekrarlı bölge var mı?
  3. Ekran okuyucuyla bölge bölge gez — gerçek doğrulama budur. Bölgeler arası gezinme kısayoluyla sayfayı dolaşın ve nereye gittiğinizi anlıyor musunuz diye bakın.

Üçüncü yöntem diğer ikisinin yerini tutamaz çünkü yalnızca o, yapının gerçekten işe yarayıp yaramadığını gösterir. Teknik olarak kusursuz bir bölge yapısı, adlandırması kötüyse kullanıcıya yardım etmez — ve bunu ancak dinleyerek anlarsınız.

Bu sitede bölge yapısı ve atlama bağlantısı süitte ölçülüyor: ilk Tab'ın atlama bağlantısını getirdiği, bağlantının odakta görünür olduğu ve odağı gerçekten ana içeriğe taşıdığı her koşumda doğrulanıyor. Üçü ayrı testtir çünkü üçü ayrı biçimlerde bozulur.

KAYNAKLAR