KAMİS
A Düzeyi İlkeler
Metinsel Olmayan İçerik
İlke
İnternet sitesinde kullanılan içeriklerin metinsel alternatifleri verilmelidir.
Açıklama
İnternet sitelerinde sunulan içeriklerin metinsel alternatiflerinin sunulması, engelli kullanıcıların internet sitesini sorunsuz kullanabilmeleri için çok önemlidir. Sunulan içeriklerin ihtiyaç duyulduğunda yazı büyüklüğünün artırılabilmesi, Braille alfabesine (görme engelli insanların okuyup yazması için kullanılan bir alfabe yöntemi) ya da sembollere dönüştürülebilmesi, sesli olarak dinlenebilmesi ve metinsel alternatiflerinin sunulması erişilebilirlik açısından gereklidir. Bununla birlikte, site tasarımı için kullanılan ve içerik ile ilgili olmayan görsel öğelerin ya da Captcha uygulaması için kullanılan görsellerin metinsel alternatifleri sağlanmayabilir.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.1.1
Örnek
Örnek sitede, haber resmi için açıklama eklenmiştir. Bütün resimler için açıklama kullanılması, resimlerin ekran okuyucular tarafından okunmasını sağlamaktadır. Resim açıklamaları kullanılan resim ile ilişkili olmalıdır.
Sadece Ses ve Sadece Video Ortamları
İlke
Ses ve video öğelerinin alternatifleri bulunmalıdır.
Açıklama
Önceden kaydedilmiş ses ve video öğeleri için, içeriğin tamamının ya da özetinin metinsel alternatifinin sunulması gerekmektedir. Örneğin, görme engelli vatandaşların bir video öğesinin içeriğinden tamamıyla faydalanabilmesi için okuyabileceği ya da ekran okuyucu programlar aracılığı ile dinleyebileceği metin biçimi sağlanmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.2.1
Örnek
Örnek sitede kullanılan videonun transkripti bulunmaktadır. İsteyen kullanıcılar transkript aracılığı ile video içeriğine erişebilmektedirler.
Altyazılar
İlke
Video ve ses öğeleri için altyazı seçeneğine yer verilmelidir.
Açıklama
İnternet sitelerindeki ses ya da video içeriklerine yönelik altyazı sağlanması beklenmektedir. Altyazılar oluşturulurken, varsa etraftaki sesler (Örn. Konukların gülmesi, alkış sesleri vb.) ve ipuçları da kullanıcılar ile paylaşılmalıdır. Video içeriğinin tamamını açıklayan bir metin yer alıyor ise alt yazı kullanımına gerek kalmayabilir. Sesli içeriklerin (Özellikle canlı yayın vb. gibi zamana bağlı ortamların) duyma engelli kullanıcılar tarafından erişilebilir olması için işaret diline çevirisinin yapılması da tercih edilebilir.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.2.2
Örnek
Örnek sitede kullanılan videonun altyazısı bulunmaktadır. Duyma zorluğu çeken kullanıcılar da altyazılar aracılığı ile video içeriğine erişebilmektedir.
Sesli Açıklama veya Ortam Alternatifi
İlke
Ses ve video öğeleri için sunulan sesli açıklama ve metinsel alternatifler açıklayıcı olmalıdır.
Açıklama
Engelli kullanıcıların, internet sitelerinde yer verilen ses ve video öğelerini sadece dinleyerek kavrayabilmesi mümkün olmayabilir. Bu nedenle ses ya da video öğeleri için sunulan seslendirme ya da metinsel alternatiflerin, kullanıcıları hem içerik hakkında hem de detaylar hakkında bilgilendirmesi gerekmektedir. Örneğin, “Ekranda orta yaşlı bir kadın yer alıyor.” ya da “Şu anda konuşmacı eliyle katılımcıları gösteriyor.” gibi açıklamalara yer verilmesi engelli kullanıcıların içeriği daha kolay anlamasını sağlayacaktır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.2.3
Örnek
Örnek sitede kullanılan videonun açıklaması bulunmaktadır. Video açıklamasında sadece video içeriğinin sesli hali değil, ekrandaki diğer olayların da belirtilmesi gerekmektedir.
Bilgi ve İlişkiler
İlke
Sayfa yapısı engelli kullanıcıların anlayabileceği ve kullanabileceği şekilde tasarlanmalıdır.
Açıklama
İnternet sitelerinde sayfa yapısı belirlenirken, kullanıcı ajanları ya da ekran okuyucular gibi programlar tarafından algılanabilecek tasarımlar tercih edilmelidir. Sitede yer alan gezinim öğeleri ve bağlantılar, anlamlı ve birbirinden ayırt edilebilecek şekilde gruplandırılmalı, sayfa içerikleri anlaşılır olacak şekilde başlıklandırılmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.3.1
Örnek
Örnek sitede içerik başlıklara ayrılarak gruplandırılmıştır. İnternet sitesinde başlıklandırmanın yapılması ve içerik yapısının kurulması kullanıcıların internet sitesini daha kolay kullanmasını sağlayacaktır. Başlıkların içerik ile ilişkili olması erişilebilirliği arttıracaktır.
Anlamlı Sıralama
İlke
Sayfa içeriklerinin sunulma sırasının içeriğin anlamını etkilediği durumlarda, uygun olan sıralama açıkça belirtilmelidir.
Açıklama
İnternet sitesi içeriklerinin belirli bir sırada okunması isteniyorsa, kaynak kodlar bunu dikkate alarak oluşturulmalıdır. Ekran okuyucu programların içeriği anlamlı bir şekilde kullanıcıya sunabilmesi için doğru sıralamayı belirleyebilmesi sağlanmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.3.2
Örnek
Örnek resimde gösterildiği gibi internet sitelerinde kullanılan içeriğin anlamlı bir şekilde sıralanması ekran oyucuların bu içerikleri doğru sıra ile okumasını sağlayacaktır.
Duyusal Karakteristikler
İlke
İçeriklere yönelik açıklamalar verilirken, sadece belirli duyusal özellikler kullanılmamalıdır.
Açıklama
İnternet sitelerinde yer alan içerikler ya da işlemler açıklanırken sadece şekil, boyut, görsel konum, yön veya ses gibi duyusal özelliklere hitap edilmemesi gerekmektedir. Örneğin, “Sonraki adıma geçmek için yeşil düğmeye tıklayınız.” ifadesi, görme engelli kullanıcılar için anlamsız olacaktır. Bu nedenle, site içerikleri, gezinim öğeleri, bağlantılar ve düğmeler için farklı engellere sahip kullanıcılar göz önünde bulundurularak, açık ve anlaşılır açıklamalara yer verilmelidir.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.3.3
Örnek
Örnek sitede, “İleri” düğmesi için açık ve anlaşılır olacak şekilde bir yönlendirme hazırlanmıştır.
Renk Kullanımı
İlke
İçeriklerin ayırt edilebilmesi ya da doğru anlaşılabilmesi için renk kullanımına dikkat edilmelidir.
Açıklama
İnternet sitelerinde yer alan içeriklerin ya da gezinim öğelerinin sadece renkleri aracılığı ile ayırt edilebilir olmasından kaçınılmalıdır. Site içeriğinde verilmek istenen bilgiler sadece renk kodlarına dayandırılmamalı, renkleri algılamakta sorun yaşayabilecek kullanıcılar (Örn. Görme engelli kullanıcılar, renk körü kullanıcılar vb.) göz önünde bulundurulmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.4.1
Örnek
Örnek sitede kullanılan grafik hem farklı renkler hem de farklı şekiller kullanılarak gösterilmiştir. İnternet sitesinde kullanılan açıklamaların sadece farklı renklerde olması yeterli olmayabilir. Renk körü olan kullanıcılar da düşünülerek farklı şekiller ile ifade etme yöntemleri kullanılmalıdır.
Ses Denetimi
İlke
Ses öğeleri kullanıcılar tarafından kontrol edilebilir olmalıdır.
Açıklama
İnternet sitelerinde kullanılan ses öğelerinin 3 saniyeden daha uzun sürdüğü durumlarda, kullanıcıların ilgili öğeyi durdurabilmesi ya da kapatabilmesi sağlanmalıdır. Kullanıcıların isteği dışında otomatik olarak açılan ses öğelerinin ya da arka plan seslerinin, ekran okuyucu programlar ile internet sitesine erişen kullanıcıları rahatsız edebileceği unutulmamalıdır. Site içeriği yüklendiğinde ses öğelerinin otomatik olarak başlaması yerine kullanıcılar tarafından başlatılabilmesi sağlanmalıdır. Kullanıcılar tarafından seçim yapılmadığı sürece arka plan seslerinin kullanımından kaçınılmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 1.4.2
Örnek
Örnek sitede, video içeriğinin kullanıcılar tarafından kontrol edilebilmesi sağlanmıştır. İçerikte kullanılan sesinin kapatılması işlevi belirgin ve kolay bulunabilir bir ifade ile sağlanabilmektedir.
Klavye
İlke
İnternet sitelerinde yer alan içerik ve işlemlerin tamamı klavye ile erişilebilir olmalıdır.
Açıklama
Engelli kullanıcıların internet sitelerindeki içerik ve işlemlerin tamamını klavye ile sorunsuz bir şekilde kullanabilmesi beklenmektedir. Örneğin, veri giriş ekranlarında Enter tuşu ile veri girişi yapılabilmesi ve Tab tuşu ile veri giriş alanları arasında gezinim sağlanmalıdır. Sadece klavye kullanılarak işlemlerin yapılabilmesi özellikle görme engelli kullanıcılar, el-göz koordinasyonunu sağlayamayan kullanıcılar ve ellerindeki titreme nedeniyle fare kullanamayan kullanıcılar için faydalı olacaktır. Bununla birlikte, el yazısı ile giriş yapılmasının ya da fare kullanımının zorunlu olduğu işlemler istisna olarak kabul edilebilir.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.1.1
Örnek
Örnek resimdeki yardım seçeneği sadece fare ile ulaşılabilir olmamalıdır. Fare kullanamayan ve klavye aracılığı ile internet sitesini kullanan kullanıcıların da bu içeriğe ulaşabilmesi için klavye tuşlarına da bu işlevler atanmalıdır.
Klavye Kilitlenmesinin Olmaması
İlke
Klavye kullanımı internet sitesindeki bütün içerik ve işlemleri kapsamalıdır.
Açıklama
İnternet sitelerinde yer alan içerik ve işlemler tasarlanırken, sadece klavye ile internet sitesi içeriğine erişim sağlayan kullanıcılar göz önünde bulundurulmalıdır. Kullanıcıların diyalog kutularını ve pop-up pencerelerini kontrol etmek ya da kapatmak için de klavye tuşlarını kullanabilmesi sağlanmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.1.2
Örnek
Örnek sitede, açılan pencerede yer alan “Tamam” ve “İptal” düğmeleri klavye ile de kullanılabilmektedir. İnternet sitelerinde kullanılan uyarı mesajları, bilgilendirme mesajları ve pop-up gibi pencerelerin sadece fare ile değil klavye ile de kapatılabilir olması gerekmektedir.
Ayarlanabilir Zaman
İlke
Kullanıcılara içeriği okuyabilmesi ya da kullanabilmesi için yeterli zaman verilmelidir.
Açıklama
İnternet sitelerinde yapılan işlemlerde zaman sınırlamasının olmaması beklenmektedir. Ancak, zamana dayalı işlemlerin bulunduğu durumlarda kullanıcılar zaman sınırlaması hakkında bilgilendirilmelidir. Kullanıcıların işlemlerini tamamlayabilmeleri için zaman sınırlamasını durdurabilmesi ya da verilen süreyi uzatabilmesi sağlanmalıdır. Kullanıcıların zaman dolmadan önce bilgilendirilmesi, zaman sınırlamasını uzatmak için kullanıcılara 20 saniye verilmesi, zaman kısıtlamasının varsayılan değerin on katına kadar uzatılabilmesi ve uzatma işleminin basit bir şekilde (Örn. Boşluk tuşunu kullanarak gibi) yapılabilmesi tavsiye edilmektedir.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.2.1
Örnek
Örnek sitede, kullanıcılara verilen süreyi uzatma seçeneği verilmesi beklenmektedir. İnternet sitelerinde yer alan süreli işlemlerde (Örn. Bir tercih yapma, sipariş verme, bilgileri girme vb.) kullanıcıya bu sürenin uzatılması imkânı verilmelidir.
Duraklatma, Durdurma, Gizleme
İlke
Hareketli içerikler kullanıcılar tarafından kontrol edilebilir olmalıdır.
Açıklama
İnternet sitelerinde hareket eden, yanıp sönen ya da kayan içerikler beş saniyeden fazla sürüyorsa, bu içeriklerin kullanıcılar tarafından duraklatılabilmesi, durdurulabilmesi ya da gizlenebilmesi sağlanmalıdır. Bununla birlikte, site içeriklerinin otomatik olarak güncellendiği durumlarda, ekran okuyucu programların performansını olumsuz etkilememesi için otomatik güncelleme devre dışı bırakılabilmelidir.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.2.2
Örnek
Örnek sitede otomatik olarak hareket eden bir içerik için içeriği durdurma seçeneği kullanıcılara sunulmuştur.
Üç kere ya da Aşağısı Yanıp Sönme Eşiği
İlke
İçerikler, sağlık sorunlarını tetiklemeyecek şekilde tasarlanmalıdır.
Açıklama
İnternet sitelerindeki yanıp sönen içerikler, bazı kullanıcıların nöbet geçirmesi için tetikleyici olabilir. Bu nedenle, yanıp sönen içeriklerin saniyede en fazla 3 kez yanıp sönmesi sağlanmalı, içeriklerin küçük boyutlarda ve parlak olmayan renkler kullanarak tasarlanması tercih edilmelidir. Epilepsi hastaları için oluşturduğu risk göz önünde bulundurularak yanıp sönen içeriklerin gerekli olmadıkça kullanılmaması tavsiye edilmektedir.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.3.1
Örnek
Örnek resimler hareketli resimlerdir ve saniyede 3 kereden fazla hareket içermektedir. Bu resimler bazı kullanıcılar için psikolojik sorunlar oluşturabilmektedir. Bu nedenle, internet sitelerinde kullanılacak görseller dikkatli seçilmelidir. Kullanıcıların sağlık durumlarını olumsuz etkileyecek resimlerden kaçınılmalıdır.
Blokların Pas Geçilmesi
İlke
Tekrar eden içeriklerin pas geçilebilmesi sağlanmalıdır.
Açıklama
İnternet sitesinin farklı sayfalarında tekrar edilen içeriklerin pas geçilebilmesi seçeneği kullanıcılara sunulmalıdır. Örneğin, bütün sayfaların başında yer alan gezinim öğelerinin her sayfada program tarafından yeniden okunması ekran okuyucu programlar aracılığı ile internet sitesine erişim sağlayan engelli kullanıcılar için sıkıcı olabilir. Bu nedenle, kullanıcıların istediklerinde tekrar eden içeriği atlayabilmesi sağlanmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.4.1
Örnek
İnternet sitelerinde sıklıkla tekrar eden öğelerin ekran okuyucular tarafından her defasında okunması kullanıcıyı rahatsız edecektir. Örneğin, menüler her sayfada yer almaktadır ve ekran okuyucular sayfaları okumaya en üstten başlamaktadır. Sayfanın üst kısmına konulan “İçeriğe Geç” özelliği ile menülerin tekrar tekrar okunması engellenebilir.
Konu Başlıklı Sayfa
İlke
Açık ve anlaşılır sayfa başlıklarına yer verilmelidir.
Açıklama
İnternet sitelerinde açıklayıcı ve anlamlı başlıklara yer verilmesi gerekmektedir. Böylelikle, kullanıcıların sayfa içeriklerini anlayabilmesi ve tarayıcıda açık olan farklı internet sayfalarını ayırt edebilmesi sağlanacaktır.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.4.2
Örnek
Örnek sitede, açık ve anlaşılır sayfa başlığına yer verilmiştir. İnternet sitelerindeki sayfaların başlıklandırılması, içerik ile ilişkili olması ekran okuyucuların hangi sayfada olduklarını kullanıcıya daha doğru şekilde aktarmasını sağlayacaktır.
Odaklama Sırası
İlke
İçeriklerin mantıksal olarak sıralanmasına dikkat edilmelidir.
Açıklama
İnternet sitelerinde yer alan içerikler için HTML kodları oluşturulurken, içeriğin mantıksal ve anlamlı olarak sıralanması gerekmektedir. Ekran okuyucu programlar aracılığı ile site içeriğine erişim sağlayan kullanıcıların, içerikleri doğru ve eksiksiz anlayabilmeleri için içeriğin uygun sırada sunulması önemlidir. Özellikle veri giriş ekranlarında ve formlarda, kullanıcıların doğru sırada giriş yapabilmesi için veri giriş alanları arasındaki gezinimin kullanıcıların karışıklık yaşamayacağı bir sırada tasarlanması beklenmektedir.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.4.3
Örnek
Örnek sitede kayıt işlemini yapmak için kullanılan formun sadece klavye ile kullanılabileceği durumlar göz önünde bulundurularak tasarlanması gerekmektedir. Tab tuşu ile ilerlenmek istendiğinde sıradaki alana geçilmesi beklenmektedir.
Bağlantının Maksadı
İlke
Bağlantılar, anlamlı ve ilişkili oldukları içerik ile tutarlı olacak şekilde isimlendirilmelidir.
Açıklama
İnternet sitelerindeki bağlantı isimlerinin tanımlayıcı, açık ve anlaşılır olması beklenmektedir. Bağlantı isimlerinin, bağlantıya tıklandığında görüntülenecek sayfa ya da gerçekleştirilecek işlemler ile ilgili bilgi vermesi sağlanmalı, kullanıcıların karışıklık yaşayacağı ya da anlamayacağı isimlendirmelerden kaçınılmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 2.4.4
Örnek
Örnek sitede yer verilen bağlantı, açıklayıcı ve ilişkili olduğu içerikle ilişkili olacak şekilde tasarlanmıştır.
Sayfanın Dili
İlke
Sayfa içeriğinin dili, ilgili programlar tarafından belirlenebilir olmalıdır.
Açıklama
İnternet sitelerinde kullanılan konuşma dilinin, HTML kodunda açıkça belirtilmesi gerekmektedir. Sitede kullanılan dilin belirtilmemesi, ekran okuyucu programların kelimeleri yanlış telaffuz etmesine, kullanıcı ajanlarının içeriği doğru algılayamamasına ve alternatif metinlerin yanlış dilde gösterilmesine neden olabilir.
Referanslar
- WCAG 2.0 – A Düzeyi / 3.1.1
Örnek
Örnek site içeriğinin dili kaynak kodunda belirtilmiştir. Ekran okuyucuların internet sitelerindeki içerikleri doğru okuyabilmesi için içeriklerin hangi dilde hazırlandığı bilgisinin HTML kodunda belirtilmesi gerekmektedir.
Odaklamada
İlke
Kullanıcıların bir öğeye odaklandığı durumlarda, bağlam değişikliği yapılmamalıdır.
Açıklama
İnternet sitelerinde yer alan herhangi bir öğenin odaklanmayı aldığı durumlarda, bağlam değişikliği yapılmasına izin verilmemelidir. Örneğin, veri girişi yapılan bir ekranda, tab tuşuna basıldığında yeni bir diyalog kutusunun açılması, kullanıcıların karışıklık yaşamasına neden olacaktır. Bu nedenle, odaklanılan öğe dışındaki öğeler sadece kullanıcıların seçim yapması durumunda aktif olmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 3.2.1
Örnek
Örnek resimlerde aynı işlemin farklı yollardan yapılabildiği görülmektedir. Üstteki resimde bilgi girilecek alana tıklandığında yardım penceresi otomatik olarak açılmaktadır. Ancak fare kullanmadan sadece klavye ile internet sitesini kullanan bir kullanıcının bu yardım bilgisini alması ilk resimde mümkün değildir. Bunu sağlamak için klavye ile de erişilebilecek yardım seçeneği sunulmalıdır.
Girdi İçin
İlke
Kullanıcılar girdikleri verilerin ya da tıkladıkları bağlantıların sonucunda gerçekleşecek işlemler veya değişiklikler hakkında bilgilendirilmelidir.
Açıklama
İnternet sitelerinde bir öğeye tıklandığında ya da veri girişi yapıldığında, kullanıcıların bilgilendirilmeden yeni bir sayfaya yönlendirilmesinden veya içeriğin güncellenmesinden kaçınılmalıdır. Örneğin, açılır liste şeklindeki menü elemanlarından birine tıklandığında ya da yön tuşları ile elemanlar arasında gezinirken, üzerine gelinen elemanın otomatik olarak seçilmesi engelli kullanıcılar için karışıklık yaratabilir. Bunun yerine, kullanıcıların seçtikleri elemanı onaylayabilecekleri düğmelere yer verilmesi tavsiye edilmektedir.
Referanslar
- WCAG 2.0 – A Düzeyi / 3.2.2
Örnek
Örnek resimde yapılan seçimin tamamlanması için “Seç” düğmesine tıklanması gerekmektedir. Listeden seçim yapıldığında anda işlemin tamamlanması kullanıcıların hata yapmasına sebep olabilmektedir. Bu yüzden seçimin tamamlanması için ayrı bir kontrol öğesinin kullanılması faydalı olacaktır.
Hata Tanımlaması
İlke
Kullanıcıların hata yaptıklarını fark edebilmeleri sağlanmalıdır.
Açıklama
Hata yapan kullanıcılar, hata yaptıklarını anlayabilmeli ve hatanın nedeni hakkında bilgilendirilmelidir. Ekran okuyucu programlar vb. aracılığı ile internet sitesine erişen kullanıcıların hata yaptıklarını fark edemeyebilecekleri göz önünde bulundurulmalıdır. Bu nedenle, hata mesajları metinsel biçimde sunulmalı, kullanıcıların anlayabileceği açık ve anlamlı ifadeler içermelidir.
Referanslar
- WCAG 2.0 – A Düzeyi / 3.3.1
Örnek
Örnek sitede, hatalı giriş yapan kullanıcı bilgilendirilmiştir. İnternet sitelerinde yapılan hatalı işlemlerde kullanıcıların açık ve anlaşılır mesajlar ile bilgilendirilmesi gerekmektedir.
Etiketler ve Kullanım Talimatları
İlke
Veri giriş alanları için açıklayıcı etiketlere ve yönlendirmelere yer verilmelidir.
Açıklama
Engelli kullanıcıların veri girişi yaparken karışıklık yaşamalarının önüne geçmek ve hata yapmalarını engellemek için uygun veri alanı etiketleri ve yönlendirici açıklamalar sunulmalıdır. Veri girişinin amacı ve verinin hangi formatta girilmesi gerektiği kullanıcılar tarafından anlaşılabilir olmalıdır.
Referanslar
- WCAG 2.0 – A Düzeyi / 3.3.2
Örnek
Örnek sitede, telefon bilgisinin hangi formatta girilmesi gerektiği kullanıcılar ile paylaşılmıştır.
Ayrıştırma
İlke
Site içerikleri ayırt edilebilir olmalıdır.
Açıklama
İnternet sitesi içeriklerinin kullanıcı ajanları ve ekran okuyucu programlar tarafından ayırt edilebilecek ve sorunsuzca okunabilecek şekilde kodlanması gerekmektedir. Örneğin, HTML kodunda bütün öğeler için uygun başlangıç ve bitiş etiketleri eksiksiz olarak yerleştirilmelidir. Böylelikle, ilgili programların site içeriğini tam ve doğru bir şekilde okuyabilmesi sağlanacaktır.
Referanslar
- WCAG 2.0 – A Düzeyi / 4.1.1
Örnek
Ekran okuyucular internet sitelerindeki içerikleri HTML kodları aracılığı ile okumaktadırlar. Bu yüzden HTML kodlarının hatasız kullanılması engelli kullanıcıların internet sitelerini daha verimli kullanmalarını sağlayacaktır. Örnek resimde de görüldüğü gibi açılan bütün HTML etiketlerinin kapanması gerekmektedir.
İsim, Rol, Değer
İlke
Bütün öğeler için isim, rol ve değerler atanmalıdır.
Açıklama
İnternet sitelerinde yer alan bütün öğelerin isim, rol ve değer özelliklerine sahip olması beklenmektedir. Bunun için internet sitelerinin HTML kodları, ilgili standartlar göz önünde bulundurularak geliştirilmelidir. Örneğin, bir düğme için etiketi yerine etiketi kullanılması, ekran okuyucu programların düğmeleri resim olarak algılamasına neden olacaktır. Bu nedenle, bütün öğeler için doğru rollerin uygun HTML etiketleri ile belirlenmesi gerekmektedir. Bununla birlikte, bütün öğelerin ayırt edilebilir olacak şekilde isimlendirilmesi de kullanıcıların öğelerin amaç ve işlevini anlayabilmesi için önemlidir.
Referanslar
- WCAG 2.0 – A Düzeyi / 4.1.2
Örnek
Örnek sitede, “Gönder” düğmesi için uygun olan “button” etiketi kullanılmıştır. Veri girişi yapılan ekranlarda HTML kodlarının doğru kullanımı, form elemanlarının dikkatli isimlendirilmesi, ifadelerin biricik olması vb. durumlara dikkat edilmesi gerekmektedir.
Klavye Kısayolları
İlke
İnternet sitesinin belirli bileşenler için sunduğu klavye kısayolları sadece ilgili bileşene odaklanıldığında aktif olmalı, gerektiğinde kapatılabilmeli ve değiştirilebilmelidir.
Açıklama
İnternet sitesi içinde yer alan içeriklerde, hiç fare kullanmadan hareket etmeyi kolaylaştırmak üzere kullanılan klavye kısayolları, bu kısayolları kullanmayacak veya kullanamayacak kullanıcılar için istendiği takdirde etkisiz kılınabilmelidir. İnternet sitesinde bir arayüz bileşenine odaklanıldığında sadece bu bileşen ile ilgili kısayol tuşlarının aktif olması beklenmektedir.
Referanslar
- WCAG 2.1 – A Düzeyi / 2.1.4
Örnek
Kullanıcıların klavye kısayollarını devre dışı bırakmasına izin veren bir mekanizma sağlanmalıdır. Böylelikle, konuşma girdisi ile işlem yapan kullanıcı, kısayolları devre dışı bırakarak mikrofon tarafından toplanan kelimelerin tek tuşlu kısayolları tetiklemesini önleyebilecektir. Kullanıcıların kısayolları değiştirmesine imkân veren bir mekanizma da sağlanmalıdır.
İşaretçi (İmleç) Hareketleri
İlke
Çok noktalı dokunmayı veya imleci / parmağı belirli bir yönde kaydırmayı gerektiren hareketler ile gerçekleştirilebilecek tüm işlemler, bu durum zorunluluk olmadıkça, farklı işaretleme aygıtlarıyla ve basit girdiler kullanılarak çalıştırılabilmelidir.
Açıklama
İşaretçiler çok farklı olabilmekle birlikte genellikle parmak, ekran kalemi, dizüstü dokunmatik alanı, fare veya oyun kolu olabilmektedir. İşaretçiyi belirli bir yönde kaydırmayı gerektiren bir hareket, hareketin başarısının yalnızca bitiş noktalarına değil, kullanıcının imleç veya parmak hareketinin izlediği yola bağlı olduğu bir kullanıcı etkileşimini içerir. Bu tür karmaşık hareketleri gerçekleştiremeyen kullanıcılar için basit hareketlerle içeriğe erişimin sağlandığı bir yapı tasarlanmalıdır.
Kaydırma hareketlerine; kullanıcı girdisi beklenen bir alanda yer alan kaydırıcı (slider) kontrolünün belirli bir yönde sürüklenmesini veya ekranda yer alan bir şekle göre işaretçiyi tarif edilen belirli bir yönde hareket ettirmeyi gerektiren durumları örnek olarak verebiliriz. Çoklu dokunma hareketleri için ise iki parmağı aynı anda kaydırarak yakınlaştırma, bir parmakla ekrana dokunurken diğer parmakla kaydırmayı veya iki defa dokunmayı gerektiren hareketleri örnek olarak verebiliriz.
Web içerikleri üzerinden sağlanan işaretçi hareketleri bu ilke kapsamındadır. Tarayıcı ve erişilebilirlik konusunda kullanılan yardımcı teknolojilerin kullanılması için ihtiyaç duyulan hareketler de bu kapsamda değildir. Aynı zamanda serbest biçimli sürükle-bırak hareketleri de bu ilke kapsamında değerlendirilmemektedir.
Referanslar
- WCAG 2.1 – A Düzeyi / 2.5.1
Örnek
Örnek sitede, haritaya yakınlaşmak için artı (+) düğmesi bulunmaktadır. Kullanıcılar yakınlaşma işlemini tek bir hareketle de yapabilmektedir.
İşaretçi İptali
İlke
İnternet sayfasında yapılmak istenen işlemin niteliğine göre işaretçi uygun durumda aktive olmalı, yanlışlıkla yapılabilecek işlemler için iptal etme seçeneği sunulmalıdır.
Açıklama
Kullanıcılar, internet sayfası üzerinde bulunan bir öğeye / kontrole yanlışlıkla tıklayabilir veya dokunabilir. Bu gibi durumlarda eylemi iptal edebilmeleri veya geri alabilmeleri için seçenek sunulmalıdır. Kullanıcı bir öğeye tıkladığı anda yanlış işlem yaptığını fark ederse, parmağını ekrandan kaldırmadan veya fare sol tuşunu bırakmadan önce işaretçisini hedeften uzağa taşıyarak eylemi iptal edebilmelidir.
Çeşitli dezavantajlara sahip bireyler, yanlışlıkla istemedikleri şekilde sonuçlanacak bir fare veya dokunma eylemini başlatmış olabilirler. Aşağıda, kullanıcılar için farklı eylemlerin nasıl iptal edilebileceğine dair yöntemler sunulmuştur;
- Bırakma eyleminde aktivasyon: İşaretçi eylemini iptal etmenin en kolay yolu, işlemin işaretçiyi bırakma eylemi esnasında gerçekleşmesidir. Dokunmatik ekran etkileşiminde, işlem yalnızca parmak hedefin sınırları içerisinde olacak şekilde ekrandan kaldırıldığında aktive olmalıdır. Fare etkileşiminde ise sol tuş yalnızca hedefin sınırları içerisinde iken bırakıldığında işlem etkin hale gelmelidir.
- Bırakma eyleminde iptal veya geri alma: İşlemin aktivasyonu için basit bir tıklamanın gerektiği durumlarda, fare sol tuşunun bırakılması doğal olarak işlemin iptali ile sonuçlanmalıdır. Sürükle-bırak türündeki işlemler örnek olarak verilebilir.
- Bırakma eyleminde ters aksiyon: Bu tür işlemlerde, basıldığında veya tıklandığında aktive olan bir işlem bırakıldığında iptal olur veya tersine işlem gerçekleşir. Örnek olarak kullanıcının sayfada bir öğeye tıkladığında geçici olarak görünen bir pencerenin bıraktığında kaybolmasını verebiliriz.
- Tıklama eyleminde tamamlanma: Basma veya tıklama eylemi gerçekleştiğinde işlemin tamamlandığı ve bırakma eylemine ihtiyaç duymayan işlemlerdir. En yaygın bilinen örneği klavye kullanımındadır. Kullanıcı fiziksel bir klavyede tuşa bastığında ekranda ilgili harf veya karakter basma anında görüntülenir. Eğer klavyelerin standart / beklenen bu davranışı yazılım ile değiştirilir ve tuş bırakıldığı anda harfin ekranda görünmesi sağlanırsa, bu, kullanıcılar açısından beklenmeyen ve olumsuz etkileyen bir durum olur.
Referanslar
- WCAG 2.1 – A Düzeyi / 2.5.2
Örnek
Tek bir dokunma veya uzun dokunma isteyen arayüz öğelerinde ilgili eylemin tetiklenebilmesi için parmağın o öğenin görsel sınırları içerisinde ekrandan kaldırılması gerekir.
İsimlerin Kullanılan Etiketi İçermesi
İlke
Arayüz bileşenlerinin erişilebilir isimleri, görünür adlarını içermelidir.
Açıklama
İnternet sitelerinde yer alan öğeler, kendilerini tanımlayan görsel bir etikete sahip olduğu gibi birde erişilebilirlik amacıyla kullanılan yardımcı teknoloji araçlarının okuyabileceği programlanmış etiket ismine sahiptir. Etiketleri seslendiren sistemler ve bu etiketlere göre sesli komut girdileri alan sistemlerde, görünür etiket ile erişilebilir isim arasında uyumsuzluk bulunması çeşitli sorunlara yol açmaktadır. Kullanıcı görünür etiket ismine göre sesli komut verdiğinde veya seslendirilen etiket dikkate alındığında ortaya sorunlar çıkmaktadır. Bunun önüne geçebilmek için öğelerin erişilebilir isimleri, görünür etiket isimleri ile aynı olmalı veya içermelidir.
Referanslar
- WCAG 2.1 – A Düzeyi / 2.5.3
Örnek
- Öğenin erişilebilir ismi ile görünür etiket ismi eşleşir.
- Öğenin erişilebilir ismi, görünür etiket ismi ile başlar.
Hareket ile Çalıştırma
İlke
Cihazları hareket ettirerek (sallama, döndürme vb.) veya kullanıcıların el-kol ve vücut hareketleri ile çalıştırabildiği (kamera gibi sensörlerin hareketi yorumladığı) işlevler, -hareketin yapılması işlevin çalıştırılabilmesi için zorunlu değilse- aynı zamanda daha geleneksel arayüz bileşenleri ile de çalıştırılabilmelidir.
Açıklama
Tablet ve telefon gibi mobil cihazlar, ivmeölçer, jiroskop gibi girdi sağlayan sensörlere sahiptirler. Bu tür sensörler, kullanıcıların belirli işlevleri cihazı döndürerek veya belirli bir yönde hareket ettirerek yapabilmesine imkân tanır. Bazı kullanıcılar belirlenen hareketi yapamayabilir veya bu belirlenen hareketi istemeden yapmasına yol açan bir engele sahip olabilir. Bu sebeple harekete bağlı işlevler kapatılabilmeli ve bu işlevi gerçekleştirecek ek yöntemler sunulmalıdır. Bazı uygulamalar özellikle cihazlarda yer alan sensörler yardımı ile çalışacak şekilde tasarlanmıştır. Bu ilkenin kapsamı dışında olan bu tür uygulamalara, cihazın hareketlerinin girdi oluşturduğu adımsayar uygulaması örnek olarak verilebilir.
Referanslar
- WCAG 2.1 – A Düzeyi / 2.5.4
Örnek
- Bir metin alanına veri girildikten sonra cihazın sallanması ile kullanıcının yaptığı işlemi geri alabilmesini sağlayan bir diyalog penceresi görüntülenir. Aynı zamanda metin alanının yanında aynı işlevi sunan bir “iptal” düğmesine de yer verilmiştir.
- Kullanıcı bir önceki veya sonraki sayfaya erişmek için cihazını yana doğru eğebilir. Sayfada aynı işlevi sunan düğmelere veya bağlantılara yer verilmiştir.
