Temel Erişilebilirlik Noktaları – Engelleri Kaldır
Userspots “Engelleri Kaldır” projesine erişilebilirlik konusunda içerik üretip proje için oluşturulacak web sayfalarını erişilebilir hale getirerek destek verecek. Bu konuda yazdığımız ilk makale erişilebilirliği sağlamak için dikkat edilmesi gereken temel noktalardan oluşuyor. Maddeler aşağıda:
1. Görseller
1.1 Aktif Görseller: Her aktif görsel için alt özelliği ile bir metin alternatif oluşturulmalıdır. Buna görselden oluşan linkler, görselin içinde imagemap kullanılarak oluşturulmuş linkler veya görsellerden oluşan form elemanları da dahildir. Metin alternatif görselin fonksiyonunu, linkin gideceği yeri açıkça anlatmalıdır. Eğer görsel metinden oluşuyorsa alt özelliği de aynı metni içermelidir.
1.2. Bilgi İçerin görseller: Alt özelliği ile görsellere metin alternatif yaratılmalıdır. Alt özelliğindeki metin görselle aynı bilgiyi içermelidir. Eğer bu mümün değilse, örneğin görsel bir grafikse, görsel alt özelliği ile açıklanmalı, açıklamanın olduğu bir dosyaya link verilmeli veya görselin açıklaması longdesc özelliğine yazılmalıdır. Eğer görsel metin içeriyorsa alt özelliği aynı metni içermelidir.
1.3. Gerekli olmayan görseller: Sayfadaki her görselin bir alt özelliği olmalıdır. Eğer bir görsel herhangi bir bilgi içermiyorsa alt özelliği boş olarak kullanılabilir. Burada dikkat edilmesi gereken konu link olan bir görsel kesinlikle boş alt özelliğine sahip olmamalıdır. Eğer bir görsel metin linkse ve link verilirken açıklama eklenmişse alt etiketi boş olabilir.
2.Linkler: Linkler için ‘buraya tıklayın’ yerine link okunduğunda anlamlı olacak açıklama yazılmalıdır. Metin içinde aynı ifade ile belirtilmiş linkler aynı yere gitmelidir.
3.Doğru Kodlama: Dökümanın yapısının düzgün bir şekilde gösterilmesi amacıyla alıntılar, başlıklar ve listeler için blockquote,li,h1 gibi anlamlı html kodları kullanılmalıdır. Sadece görsel etkiler yaratmak için anlamlı html kullanımından kaçınılmalıdır.
4. Sayfa içi Navigasyon: Sayfanın ana bölümleri arasında geçişi kolaylaştıracak yöntemler sağlanmalıdır.
5.Göreceli öğeler: Sayfalardaki öğelerin boyutlarını farklı ekranlar, tarayıcılar, metin boyutu özelliklerini dikkate alarak göreceli değerler olarak belirlenmelidir.
6. CSS: Sayfa sunumu css ile oluşturulmalıdır .Tablo kullanılması pek tavsiye edilmez ama bu bir hata değildir. font ve bgcolor gibi lokal özellikler eklenmemelidir. Sayfa css dosyaları kapatıldığında da anlaşılır olmalıdır.
7.Renk: Renkli bir şekilde sunulan bilgilerin hepsinin orada renk olmadığında da görülebilir olması gerekmektedir.
8. Kontrast: Arka plan rengi ile yazı rengi arasında yeterli derecede Luminosity kontrast oranı olmalıdır. (Luminosity kontrast oranı nedir? )
9. Klavye Erişimi: Sayfanın bütün fonksiyonelliği klavye ile erişilebilir halde olmalıdır.
Twitter Hata Mesajı ve Renk Körlüğü
Renk körlüğü ve Arayüz Renkleri yazısında renk körlüğü çeşitlerinden Luminosity Kontrast Oranı yazısında da Web İçerik Erişilebilirliği Yönergeleri 2.0 versiyonunda arka plan rengi/yazı rengi kombinasyonlarının kontrast değerlerini ölçmek için tavsiye edilen orandan bahsetmiştik.
Bu yazıda da bu konuyla ilgili bir şikayet ile konuyu örneklendirmek istiyoruz. Markalarla ilgili şikayet ve önerilerin olduğu Getsatisfaction.com sitesinde Twitter’ın aşağıda görünen hata mesajı hakkında şu şekilde bir şikayet de bulunuyor:
Hata mesajınız renk körleri tarafından okunamıyor. “hide” ve “visit your device settings page” linkleri farklı renklerde olmalı
Resimdeki hata mesajının kontrast oranını kontrol ettirdigimizde sonuç olarak (Arka plan rengi:#ff7b6d Yazı rengi:#4499d3) iki renk arasında yeterli kontrast farklılığı olmadığını alıyoruz. Renk körlüğü simülatörleri ile de baktığımızda linkleri yazıdan farkının olmadığını ve renk körlüğü rahatsızlığı olanlar tarafından farkedilmesinin çok zor olduğunu da görüyoruz.
Renk körlüğü istatistiğini işin içine kattığımızda durumun vahameti daha net ortaya çıkıyor:”Her 20 kullanıcıdan biri Twitter hata mesajında tıklanacak yerleri görürken zorluk yaşıyor”.
Luminosity Kontrast Oranı
W3 konsorsiyumu tarafından hazırlanan Web İçerik Erişilebilirliği Yönergeleri‘nin 2.0 versiyonunda arka plan rengi/yazı rengi kombinasyonlarının kontrast değerlerini ölçmek için Luminosity kontrast oranı denen bir algoritma önerilmekte. Bu kontrast değerlerini ölçmek için aşağıdaki iki online aracı kullanabiliriz.
Bu araçlar bize renkler arası kontrast farkından renk körlüğü rahatsızlığı olanlar ile görme bozukluğu yaşayanların okumada sıkıntısı olup olmayacağını belirtiyor.
Emirates.com’dan Erişilebilirlik Örneği
Web erişilebilirliği, web sayfalarının engelli kişiler tarafından da kullanılabilmesi anlamına gelir. Bu amaçla W3 tarafından web siteleri için yönergeler oluşturulmaktadır.
Bu yönergelerin nasıl uygulandığına dair güzel bir örneği Emirates‘in erişilebilirlik sayfasında görebiliyoruz. Emirates bu sayfada erişilebilirlik adına neler yaptığını Resimler, Metin, Bağlantılar,Formlar ve tablolar,Komut dosyaları,Açılan Pencereler,Görsel tasarım,Erişim Tuşları ve Yapısal İşaretleme başlıkları altında anlatmış. Aşağıda bu maddelerden birkaçını bulabilirsiniz. Aşağıdaki maddeler ekran okuyucu kullanarak web sayfalarını gezen kullanıcılar için oldukça yararlıdır.
Tüm resimlerin ALT etiketlerinde resim açıklaması bulunmakta.
Tüm form kontrolleri uygun ve açık bir şekilde etiketlenir ve stil sayfaları olmadan okunabilir.
Tüm formlar arasında fare kullanmadan gezinebilirsiniz.
Site içeriği, JavaScript desteği olmadan kullanılabilir.
Tarayıcınız veya tarayıcı cihazınız stil sayfasını desteklemiyorsa, yine de tüm sayfaların içeriği okunabilir.
Bu maddelerin yanında önemli bir başlık olarak Erişim tuşları (Access Keys) da dikkat çekmektedir. Erişim tuşları ile sitede tanımlanan kısayollar Windows’da ALT ile Macintosh’da da Control ile beraber basılarak ziyaret edilir. Bir erişim tuşu belirlemek için “a” etiketine accesskey parametresi aşağıdaki gibi eklenebilir.
Erişilebilirlik sadece görme engelli kullanıcılar için değil de renk körlüğü ve görme bozukluğu rahatsızlığı olan kullanıcılar için de gereklidir. Her 20 kullanıcıdan birinde renk körlüğü her 10 kullanıcıdan birinde de görme bozukluğu olduğu düşünülürse erişilebilirliğin hitap ettiği kitle hiç de azımsanmamalıdır.
