ARIA Web Standartlarına ve HTML Uygulamalarına Erişilebilirliğe Bir Bakış
Gerçekten açık ve kapsamlı bir web, engelli kullanıcıların dinamik web içeriğinin ve modern web uygulamalarının tadını çıkarmaları için yardımcı teknolojilere dayanan teknolojilere ihtiyaç duyar. W3C'nin erişilebilirlik web standartları, web'i engelli kullanıcıların verimli bir şekilde kullanabilecekleri Erişilebilir Zengin İnternet Uygulamaları (ARIA) ile doldurmayı amaçlamaktadır..
ARIA, Web Erişilebilirlik Girişimi (WAI) tarafından yayınlanan çok sayıda erişilebilirlik standardı ve kılavuzundan biridir. HTML belgelerine kolayca eklenebilecek ek bir işaretleme sağlar. WAI-ARIA, Açık Web Platformunu hedefleyen çapraz platform bir çapraz cihaz çözümüdür, bu nedenle sadece web siteleri hakkında değil, oyunlar, dijital eğlence, sağlık hizmetleri, mobil ve diğer uygulamalar hakkında da düşünün.
Bu yazıda, WAI-ARIA standartlarının yardımı ile HTML belgelerinize nasıl erişilebilirlik katabileceğinizi inceleyeceğiz..
ARIA Çerçevesi
HTML'nin sözdizimi, geliştiricilerin öğeleri doğru bir şekilde tanımlamasına, rollerini tanımlamasına ve aralarındaki ilişkileri belirtmesine her zaman izin vermez. Bu, duyularına tam olarak sahip olan ziyaretçiler için nadiren bir sorun olsa da, yardımcı teknoloji kullanıcılarının ekranda neler olduğunu anlamalarını ve seçeneklerini keşfetmelerini engelleyebilir..
Bu, ARIA'nın yardımımıza geldiği noktadır; farklı unsurların amacını, dönüm noktası rolleri, ve onların doğasını aria ön ekli öznitelikler. Aria öneki özniteliklerin iki türü vardır: özellikleri sayfa yaşam döngüsü boyunca değişme olasılığı daha düşük olan özellikleri tanımlayan ve devletler Kullanıcı etkileşimi nedeniyle sık sık değişebilecek şeyler hakkında bilgi sağlayan.
Landmark Rolleri
Yer işareti rolleri ARIA'nın Roller Modelinin en bilinen formlarıdır (diğerleri Soyut Roller, Widget Rolleri ve Belge Yapısı Rolleridir). Dönüm noktası rolleri, geliştiricilerin büyük algılanabilir bölgeler yardımcı teknoloji kullanıcılarının hızlıca erişmek isteyebilecekleri web sayfasında.
8 tür ARIA dönüm noktası rolü vardır ve ilgili HTML etiketlerine nitelik olarak eklenmeleri gerekir.
rol =”afiş”
Afiş rolü, yalnızca tek tek sayfalarla değil, tüm siteyle alakalı içerik için kullanılmak üzere tasarlanmıştır. Genellikle, logo ve diğer önemli site çapında bilgiler için sitenin ana başlığına bir özellik olarak eklenir. Banner rolünü herhangi bir HTML belgesinde veya uygulamasında yalnızca bir kez kullanmanız önemlidir..
rol =”ana”
Ana dönüm noktası rolü belgenin ana içeriği ile ilgilidir. Herhangi bir HTML sayfasında bir defadan fazla kullanılamaz. Genellikle Gezinme rolü, bir sitedeki bağlantılar ve listeler gibi gezinme öğeleri içeren bir alanı belirtmek için kullanılır.. Tamamlayıcı işaret rolü, sitenin ana içeriğiyle ilgili ek içeriği açıklar. DOM hiyerarşisinde benzer düzeye yerleştirilmesi gerekir. İçerik bilgisi rolü, kullanıcı temsilcilerine, telif hakkı bilgisi, yasal ve gizlilik bildirimleri gibi farklı türde meta verilerin bulunabileceği bir bölgenin varlığı hakkında bilgi verir. Genellikle bir sitenin altbilgisi için kullanılır. Form işareti rolü, kullanıcı girişi için bekleyen bir formu belirtir. Kullanmanız gereken arama formları için Arama rolü oldukça açıklayıcıdır, yardımcı teknolojilerin bir web sitesinin arama işlevini tanımlamasına yardımcı olmak amacıyla hazırlanmıştır.. Uygulama simgesi rolünü, web belgesi yerine, web uygulaması olarak bildirmek istediğiniz bir bölge için kullanabilirsiniz. Normal göz atma modundan uygulama göz atma moduna geçmeye yardımcı teknolojilere işaret ettiği için geleneksel web sitelerine dahil edilmesi önerilmez. Bu dönüm noktası rolünü yalnızca büyük bir özenle kullanmalısınız. Roller, HTML etiketlerinin anlamını tanımlamanıza olanak sağlarken, durumlar ve özellikler, kullanıcıya bunlarla nasıl etkileşime girecekleri hakkında ek bilgi sağlar. Hem durumlar hem de özellikler ile işaretlenir aria ön ekli öznitelikler sözdizimi ile arya-*. En iyi bilinen ARIA özellikleri, muhtemelen aria için gereken özellik ve aria tarafından kontrol edilen durumdur. Aria gerekli bir özellik çünkü bu bir giriş öğesinin kalıcı bir özelliği (yani, kullanıcının doldurması gereken) belirtmek, bildirmek çünkü bir onay kutusu kullanıcı etkileşimi nedeniyle değerini sık sık değiştirebilir. Durumlar ve özellikler bazen belirteç değerlerini alır (sınırlı bir önceden tanımlanmış değer kümesi), örneğin aria-live özelliği 3 farklı değere sahip olabilir: kapalı, kibar, iddialı. Bu örnekteki sözdizimi şuna benzer: Diğer durumlarda, arya ön ekli özelliklerin değerleri ile gösterilir. Teller, sayılar, tamsayılar, Kimlik referansları veya doğru yanlış değerler. Sitenizdeki farklı öğeler arasındaki ilişkileri göstermek için, belge yapısından başka türlü belirlenemeyen ilişki özelliklerini kullanın. Örneğin HTML sayfanızda algılanabilir bir alan için bir ARIA dönüm noktası rolü belirledikten sonra, ARIA'nın önceden tanımladığı durumlarını ve alt öğelerin özelliklerini ekranda meydana gelen olaylara göre değiştirirseniz, yardımcı teknolojilere çok yardımcı olabilir. Bu, kullanıcıların siteyle etkileşime girmesi gerektiği yerlerde, örneğin bir formu doldururken veya bir arama sorgusu çalıştırırken çok önemli olabilir.. Erişilebilirlik tasarımının genel kuralı, kullanıcı arayüzünün mevcut durumunun her zaman yardımcı teknolojiler tarafından algılanabilmesi gerektiğidir. Örneğin, kullanıcı formda bir seçenek seçerse, yardımcı teknolojiler için de seçilmiş görünmesi gerekir. Bu, aria tarafından seçilen durumun aşağıdaki sözdizimi ile kullanılmasıyla kolayca başarılabilir: W3C'nin WAI-ARIA Yazma Uygulamaları rehberi, sitenizin görsel ve erişilebilir arayüzlerini nasıl uygun şekilde uyumlulaştıracağınızla ilgili birçok harika fikir verebilir.. ARIA rollerini ve niteliklerini kullanmak bazen gereksiz olabilir. Örneğin, HTML5'in anlamsal etiketlerini kullandığınızda Örneğin, kullanmak gereksiz form tanımlamak için önemli rol Yani zaten eklediyseniz gizli Bir form girişine HTML niteliği eklemek için gereksiz arya-gizli tarayıcı varsayılan olarak içerdiğinden, durumu.. Sonuncusu W3C özelliklerine haritalama amacıyla eklenmiştir. ana Anlamsal bir HTML öğesinin ARIA'nın dönüm noktası rolü. rol =”navigasyon”
rol =”tamamlayıcı”
Rol = "main". İlgili yazılar, popüler makaleler, son yorumlar özerk tamamlayıcı içeriğin tipik örnekleridir.rol =”ContentInfo”
rol =”form”
Rol = "arama" yerine.rol =”arama”
rol =”uygulama”
Durumlar ve Özellikler
Aria önceden eklenmiş Özniteliklerin Sözdizimi
ARIA Durumlarından ve Özelliklerinden Nasıl Yararlanılır?
1. İlişki Nitelikleriyle Elementler Arası İlişkiler Kurma
arya-labelledby özellik, geçerli öğeyi etiketleyen öğeyi tanımlar.arya-labelledby - diğer pek çok şey arasında - ARIA'nın işaret ettiği bölgelere giden başlıkları aşağıdaki şekilde bağlayabilir:Bu bir başlık
Ana içerik… 2. Elemanın Yaşam Döngüsü ile Durumları ve Özellikleri Senkronize Edin
3. Görsel ve Erişilebilir Arayüzleri Eşleştirin
.ARIA'yı Aşırı Kullanmayın
veya , modern web tarayıcıları uygun ARIA anlamını varsayılan olarak ekler. Bu durumda ARIA'nın dönüm noktası rollerini ayrı ayrı ayarlamak mantıklı değildir.. öğesi. Onun yerine sözdizimi sadece kullanmak için mükemmel . HTML'nin yerel özelliklerini, uygun ARIA özelliği ile birlikte kullanmak da gereksizdir..
