- Katılım
- 21 May 2023
- Mesajlar
- 743
- Tepki
- 17
- Puan
- 18
Arayüz kelimesi hem bir ekran tasarımını hem iki yazılım arasındaki bağlantı noktasını anlatıyor. Ortak nokta ikisinde de aynı: iki taraf arasında, üzerinde anlaşılmış bir temas yüzeyi.
Aşağıda kullanıcı arayüzünün standarttaki karşılığını, ögelerin anlamının makineye nasıl aktarıldığını, rol-durum-özellik üçlüsünün ne işe yaradığını ve arayüz tasarımının erişilebilirlikle ilişkisini W3C belirtimine bakarak topluyoruz.
Neden anlamsal bilgi gerekiyor?
WAI-ARIA 1.2 sorunu baştan koyuyor. Belirtime göre erişilebilir bir web içeriği, sayfadaki bileşenlerin, yapıların ve davranışların anlamını taşımak zorunda; bu anlam olmadan yardımcı teknolojiler engelli kullanıcıya uygun bilgiyi aktaramıyor.
Buradaki "anlamsal bilgi" ifadesi belirleyici. Ekranda bir şeyin buton gibi görünmesi, onun buton olduğu bilgisini taşımıyor.
Belirtim boşluğu doldurmak için ne sunduğunu da söylüyor: erişilebilir kullanıcı arayüzü ögelerini tanımlayan roller, durumlar ve özelliklerden oluşan bir ontoloji.
Bu ontolojinin amacı, web içeriğinin ve uygulamalarının erişilebilirliğini ve birlikte çalışabilirliğini iyileştirmek.
- Rol: Öge ne, hangi işi görüyor.
- Durum: O an hangi hâlde.
- Özellik: Hangi niteliklere sahip.
Bilgi kime iletiliyor?
Belirtim anlamın hangi kanaldan taşındığını da söylüyor: tanımlanan anlambilim sayesinde yazar, arayüzün davranışını ve yapısını belgenin kendi işaretlemesi üzerinden aktarabiliyor; aktarımın muhatabı da yardımcı teknolojiler.
Yani bilgi, görsel tasarımın içine değil, sayfanın kodunun içine yazılıyor.
Bunun sonucu, aynı arayüzün iki farklı yoldan okunabilmesi: gözle görülen düzen ve makine tarafından okunan yapı.
Belirtim kendini tek başına da konumlandırmıyor; hem HTML hem SVG belirtimlerini tamamladığını söylüyor.
Püf nokta' Alıntı:
Görsel ipucu neden yetmiyor?
Bir ögenin kalın çerçeveli olması, gölgeli görünmesi ya da rengin değişmesi insan gözü için anlam taşıyor. Yardımcı teknoloji ise bu görsel farkları okuyamıyor; sayfanın yapısına bakıyor.
Aynı durum otomatik test araçları için de geçerli. Bir ögenin ne olduğu yapıda yazılı değilse, testi yazan taraf konuma ya da metne dayanmak zorunda kalıyor; bu da kırılgan testler üretiyor.
Üçüncü bir taraf daha var: arama motorları ve içerik önizlemesi üreten sistemler. Yapılandırılmış bilgi, aynı sayfanın farklı bağlamlarda doğru anlaşılmasını sağlıyor.
Bu yüzden anlamsal işaretleme, erişilebilirlikle sınırlı bir konu olmaktan çıkıp genel bir kalite ölçütüne dönüşüyor.
Sürüm neyi değiştiriyor?
Belirtim bu sürümde eklenenleri de belirtiyor: yardımcı teknolojilerle birlikte çalışabilirliği artıran ve önceki sürümden bu yana gelen özellikler.
Amaç da yazılı: HTML ve SVG için daha tutarlı bir erişilebilirlik modeli oluşturmak.
Bu, arayüz standartlarının neden zaman içinde güncellendiğini gösteriyor. Yeni bileşen türleri ortaya çıktıkça, onların anlamını taşıyacak roller de tanımlanıyor.
Tasarımcı için ne anlama geliyor?
Birinci sonuç, görsel karar ile anlamsal kararın ayrılması. Bir ögenin nasıl göründüğü ile ne olduğu iki ayrı iş.
İkincisi doğru ögeyi seçmek. Standart bir ögenin zaten taşıdığı anlamı, başka bir ögeye elle eklemek zorunda kalmamak.
Üçüncüsü durumu bildirmek. Bir sekmenin seçili olması, bir menünün açık olması ya da bir alanın hatalı olması yalnız renkle değil, yapıyla da anlatılmalı.
Dördüncüsü tutarlılık. Aynı işi yapan ögelerin aynı rolü taşıması, kullanıcının öğrendiği davranışın her yerde geçerli olmasını sağlıyor.
Nereden başlanır?
Standardın kendi tavsiyesi, önce doğru ögeyi kullanmak. HTML'in zaten tanımladığı bir öge varken aynı davranışı sıfırdan kurmak, rolü ve durumu elle bildirme yükümlülüğü doğuruyor.
İkinci adım, arayüzdeki durumları listelemek: açık-kapalı, seçili-seçili değil, geçerli-hatalı. Her biri için yapıda bir karşılık olup olmadığı sorulabiliyor.
Üçüncü adım sınama. Sayfayı klavyeyle gezmek ve ekran okuyucuyla dinlemek, eksik kalan bildirimleri hızla ortaya çıkarıyor.
Arayüzün diğer anlamı
Kelime yazılım tarafında ikinci bir anlam daha taşıyor: iki bileşenin birbiriyle konuştuğu tanımlı temas noktası.
İki anlam da aynı fikre dayanıyor. Kullanıcı arayüzünde insan ile sistem, program arayüzünde ise iki yazılım arasındaki kurallar belirleniyor.
Ortak ölçüt de aynı: karşı tarafın iç işleyişini bilmeden, tanımlı kurallarla iletişim kurabilmek.
Yazılımlar arası temas noktasını API yazımızda ele almıştık.
Dört erişilebilirlik ilkesine erişilebilirlik yazımızda bakmıştık; simge etiketleme tarafı için ikon yazımıza bakabilirsiniz.
Sık Sorulan Sorular
Arayüz ne demek?
İki taraf arasındaki tanımlı temas yüzeyi; kullanıcı arayüzünde insanla sistem, program arayüzünde iki yazılım arasında.
Neden anlamsal bilgi gerekiyor?
Yardımcı teknoloji, ekranda görüneni değil işaretlemede yazılanı okuyor; bileşenin rolü yazılmamışsa kullanıcıya aktarılacak bir anlam da kalmıyor.
Rol, durum, özellik nedir?
Belirtimin sunduğu ontoloji; erişilebilir arayüz ögelerini tanımlayan üçlü.
Bilgi nereye yazılıyor?
Belge düzeyindeki işaretlemeye; görsel tasarımın içine değil.
Hangi belirtimlerle çalışıyor?
Belirtim hem HTML hem SVG belirtimlerini tamamladığını söylüyor.
Özetle
Arayüz, iki taraf arasındaki tanımlı temas yüzeyi. Kullanıcı arayüzünde bu yüzeyin yalnız görünmesi yetmiyor; ögelerin ne olduğu, hangi durumda bulunduğu ve hangi nitelikleri taşıdığı makineye de bildirilmek zorunda. Standart bunun için roller, durumlar ve özelliklerden oluşan bir sözlük sunuyor ve bu bilgiyi sayfanın işaretlemesine yazmayı öneriyor.
Sitenizdeki bir ögenin seçili olduğunu yalnız renkle mi anlatıyorsunuz?
Güncelleme: 3 Eylül 2026. W3C WAI-ARIA 1.2 belirtimi kontrol edildi.
Dijital Dünyanıza Yön Veren Pusula
