Benim sitem

html ders 2

Web Sitelerini Erişilebilir Yapmak

 

Web Erişilebilirliği Nedir?

Web erişilebilirliği, web sayfalarının engelli kişiler tarafından da kullanılabilmesi anlamına gelir. Erişilebilirlik sağlandığı takdirde, engelli kişiler web sayfalarını algılayabilir, anlayabilir, sayfalar arasında dolaşabilir, sayfalar ile etkileşimde bulunabilir ve sayfalara katkı sağlayabilirler. Web erişilebilirliği aynı zamanda engelli olmayan kişilere de, (örneğin yaşlılık sebebiyle alışkanlıkları değişen kişiler gibi) çeşitli avantajlar sağlar.

Web erişilebilirliği web sayfalarına erişimi etkileyen her türlü engeli -görme, işitme, konuşma engelleri ile fiziksel, bilişsel ve nörolojik engeller- içerir. Milyonlarca kişi web sayfalarına erişimlerini etkileyen çeşitli engellere sahip durumdadır. Ş;u anda, pek çok web sitesi ve web uygulaması engelli kişilerin bunlardan faydalanmasını zorlaştıran veya imkansız kılan engeller içermektedir. Daha erişilebilir web siteleri ve uygulamaları yaygınlaştıkça, engelli kişilerin web sayfalarından faydalanması ve bu sayfalara katkı vermesi mümkün olacaktır.

Web erişilebilirliği engelli olmayan kişiler için de faydalıdır. Örneğin, erişilebilirliğin temel prensiplerinden biri web sitelerinin ve uygulamalarının çok çeşitli kullanıcı ihtiyaçları, tercihleri ve o an içinde bulundukları durumlarını karşılayacak şekilde esnek bir şekilde tasarlanmasıdır. Bu tür bir esneklik, yavaş Internet bağlantısına sahip, geçici engeller yaşayan (örneğin kolu kırılan), yaşlanma sebebiyle alışkanlıkları değişen vb. engelli olmayan kişiler için de avantaj sağlar.

Web Erişilebilirliği Konusunda Yapılabilecekler

1) Kodlama

Dokü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.

2) Javascript Kullanımı

Sayfadaki bütün fonkisyonlar javascript açık olmadığında gerçekleştirilebilir olmalıdır. Eğer bu mümkün değilse sayfanın javascript içermeyen alternatif versiyonu düzenlenmelidir.

3) Renk Kontrastı

Arka plan rengi/yazı rengi kombinasyonlarının kontrast değerleri, görme bozukluğu olanlar ve renk körlüğü rahatsızlığı olanların metinleri okumada sıkıntısı olup olmayacağını belirlemek için ölçülmelidir.

Bu değeri ölçmek için W3 tarafından Luminosity kontrast oranı denen bir algoritma önerilmektedir. Bu kontrast değerlerini ölçmek için aşağıdaki iki online araç kullanılabilir.

4) Linkler

Metin linkler farklı renkte ve altı çizili olmalıdır. Kullanıcı deneyimi kullanıcılarda linklerin bu şekilde olması beklentisini yaratmıştır. Ziyaret edilmiş link ile edilmemiş link rengi farklı olmalıdır. Link olarak seçtiğiniz renk link olmayan metinlerde kullanılmamalıdır. Link olmayan herhangi bir metnin altı çizilmemelidir.

Linklerin kullanıcının gideceği sayfayı net bir şekilde ifade etmesi beklenmektedir. Linklerde "buraya tıklayın" gibi ifadeler kullanılmamalıdır. Metin içinde aynı ifade ile belirtilmiş linkler aynı yere gitmelidir.

Başka siteye giden linkler ile HTML olmayan dosyalara verilen linkler ayrıca belirtilmelidir.

Örnek:

Başvuru Dökümanı (Word Belgesi) 

5) Görseller

Aktif Görseller

Her görsel için mutlaka bir alternatif metin oluşturulmalıdır. Görselden oluşan linkler, butonlar, görselin içinde imagemap etiketi ile oluşturulmuş linkler ve görselden oluşan form elemanları da bu zorunluluğa dahildir. Eğer görsel metinden oluşuyorsa alternatif metine görselin üzerinde yazan metin yazılmalıdır.

Bilgi İçeren Görseller

Alternatif metin ile görsel açıklanmalıdır. Alternatif metin ile görseldeki bilgi aynı olmalıdır. Eğer görsel bir grafikse ve alternatif metin ile anlatılması mümkün olamıyorsa görsel "alt" etiketi ile kısaca açıklanıp, görselin uzun açıklaması "longdesc" etiketi ile verilmelidir.

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. 

6) CSS

Sayfa sunumu css ile oluşturulmalıdır. Tablo kullanılması bir hata olmamakla birlikte tablo kullanıldığında bir çok stil yine css dosyası ile belirlenmelidir. .font ve .bgcolor gibi lokal özellikler eklenmemelidir. Sayfa css dosyaları kapatıldığında da anlaşılır olmalıdır. Tarayıcı veya tarayıcı cihazı stil sayfasını desteklemiyorsa, yine de tüm sayfaların içeriği okunabilir halde olmalıdır.

Ayrıca formlar da açık bir şekilde etiketlenmiş ve stil sayfaları olmadan okunabilir halde olmalıdır.

7) Klavye Erişimi

Web sayfasındaki önemli fonksiyonlar sadece klavye kullanılarak da yapılabilmelidir. Erişim tuşları (Access Keys) ile bu özellik sağlanabilir. 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 eklenebilir.

< a href="http://www.blogger.com/index.html" accesskey=”a” >Anasayfa< /a>

Ayrıca web sitesinde formlar arasında klavyenin "Tab" tuşu ile dolaşım sağlanmalıdır. 

8) Formlar

Formlar CSS ve Javascipt kapalı olduğunda da çalışır halde olmalıdır. Formlarda giriş yapılan bölümlerin açıklamalarında label etiketi kullanılmalıdır.

9) Tarayıcı Testi

Web sayfalarının farklı tarayıcılarda nasıl gözüktüğü test edilmelidir. Bunu için bu tarayıcılar bilgisayara kurularak test edileceği gibi aşağıdaki online araçlar kullanılarak da yapılabilir.

10) Font Büyüklüğü

Font büyüklüğü görme bozukluğu olan kullanıcılar düşünülerek kullanıcılar tarafından ayarlanabilir olmalıdır. 

11) Navigasyon

Menü’de bulunan başlıklar kullanıcıların anlayacağı şekilde olmalıdır. Bunu sağlamak için kullanıcılara kart gruplama çalışması yapılabilir. Navigasyon için menü kullanmanın yanında içeriğin içinde de navigasyon araçları kullanılmalıdır.

Web sayfalarında kullanıcıların daha önce nerelerde bulunduğu (geçmişi), şu an nerede olduğu (konumu) ve nereye gideceği (geleceği) kullanıcıya açık ve net bir şekilde iletilmelidir. 

12) Hata Sayfaları

Kullanıcı aslında orada olmayan bir sayfaya girmeye çalıştığında karşısına çıkan sayfalar hata sayfalarıdır. Hata sayfaları;

  • Tasarıma uygun,
  • Arama özelliği sunan,
  • Kullanıcının geldiği yere göre içeriği değişen,
  • Site haritası veya yararlı linkler içeren,
  • 404 kelimesini barındırmayan,
  • Başka sayfaya yönlendirme yapmayan

şekilde tasarlanmalıdır.

13) Hata Mesajları

Hata mesajları teknik terimlerden uzak, anlaşılır ve çözüm konusunda kullanıcıya yol gösteren şekilde oluşturulmuş olmalıdır. 

Kaynaklar:


Web Erişilebilirliği Girişimi (Web Accessibility Initiative (WAI)) web yazılımları ve web geliştiricileri için erişilebilirlik çözümlerini tanımlayan yönergeler ve teknikler geliştirmektedir. Bu yönergelerin en son sürümü olan Web İçerik Erişilebilirliği Yönergeleri (Web Content Accessibility Guidelines-WCAG) 2.0 orijinal dokümanına http://www.w3.org/TR/WCAG20/ adresinden ulaşılabilir. (WCAG 2.0 yönergeleri 2008 Aralık ayında kabul edilmiş olan ve referans verilebilen sürümdür.)

Web Erişilebilirliği ile ilgili Kaynaklar:

Web Erişilebilirliği Kontrol Araçları: