ARIA Nedir?

Tarayıcı, düğme, bağlantı ya da form alanı gibi yerel HTML öğelerinin ne olduğunu yardımcı teknolojilere kendiliğinden bildirir. Bir öğe açılır menü, sekme ya da ilerleme çubuğu gibi davranacak biçimde özel olarak kodlandığında bu bilgi kendiliğinden oluşmaz. ARIA, rol (role) ile durum ve özellik öznitelikleriyle (aria-expanded, aria-valuenow gibi) bu anlamı ekler. Özellikle sayfa yenilenmeden değişen içerikte ve özel kodlanmış denetimlerde kullanılır.

Örnek: Ürün sayfasında oturum süresinin dolmak üzere olduğunu bildiren uyarı role="alert" ile işaretlenirse ekran okuyucu bu mesajı önemli ve zamana bağlı bir bilgi olarak bildirir. Uyarı yalnızca kırmızı renkle verilseydi bu kullanıcı onu fark etmeyebilirdi.

ARIA kullanımının ilk kuralı, işi görecek yerel bir HTML öğesi varsa ARIA yerine o öğenin kullanılmasıdır. Gerçek bir button öğesi klavyeyle çalışmayı, odak almayı ve rolünü kendiliğinden getirir. ARIA yalnızca anlam ekler, davranış eklemez; ARIA ile kurulan bileşende tarayıcının yerel davranışını geliştirici betikle ayrıca sağlamak zorundadır.

MDN bu yüzden “kötü ARIA’dansa hiç ARIA olmaması daha iyidir” sözünü aktarır ve ARIA kullanan ana sayfalarda daha fazla erişilebilirlik hatası saptandığını belirten bir taramaya yer verir. Yanlış rol ya da güncellenmeyen bir durum bilgisi, kullanıcıya bileşeni olduğundan farklı anlatır.

Erişilebilir ad (accessible name), yardımcı teknolojinin bir arayüz öğesini kullanıcıya hangi adla okuyacağıdır. Düğme ve bağlantılarda ad öğenin metninden, form alanlarında bağlı label öğesinden, görsellerde alt özniteliğinden gelir. Ad sayfadaki başka bir metinden alınacaksa aria-labelledby, görünür metin hiç yoksa aria-label kullanılır. MDN görünür metnin ad olarak kullanılmasını önerir ve her denetimin bir adı olması gerektiğini belirtir.

Örnek: Yalnızca sepet simgesinden oluşan bir düğmenin metni yoksa ekran okuyucu onu yalnızca “düğme” diye okur. Düğmeye “Sepeti Aç” adı verildiğinde kullanıcı düğmenin ne yaptığını öğrenir.