Kullanılabilir: her şey fare olmadan da çalışır

Nedir

Kullanılabilir, WCAG ilkelerinin ikincisidir. Herkes web sitendeki her şeyi kullanabilmeli: menüyü, düğmeleri ve formları. Fareyle olduğu kadar, sadece klavyeyle ya da sesli komutla da.

Bu ilkenin beş yönergesi var: klavyeyle kullanım (2.1), yeterli zaman (2.2), epilepsi nöbetini tetikleyebilen yanıp sönen görüntüler (2.3), yolunu bulmak (2.4) ve dokunma ya da ses gibi başka kullanım yolları (2.5). Bunların altında A ve AA düzeyinde 20 başarı ölçütü var: bir web sitesini test edebileceğin şartlar. Aşağıda en önemlilerini, WCAG 2.2’deki numaralarıyla bulursun. Web geliştiricine ya da tedarikçine bir sorun bildirirken bu numarayı kullanırsın.

Neden önemli

Görmeyen insanlar çoğu zaman klavye kullanır, hareket engeli olan bazı insanlar da öyle. Eli titreyen biri, birbirine yakın küçük düğmeleri kolayca ıskalar.

Ne klavyeyi ne de fareyi kullanabilen insanlar bazen konuşma tanıma ya da özel bir anahtarla çalışır. Başvuru formundaki tek bir düğme sadece fareyle çalışıyorsa, geri kalanı ne kadar iyi olursa olsun orada takılıp kalabilirler.

Nasıl yaparsın

Siteyi yapmak web geliştiricinin işi. Aşağıdaki maddelerin çoğunu klavyeyle ya da bir telefonla kendin kontrol edebilirsin.

1. Her şey klavyeyle çalışır (2.1.1, A düzeyi). Tab ile bir sonraki bağlantıya ya da düğmeye geçersin, Enter ile seçersin ve hiçbir yerde takılıp kalmazsın (2.1.2, A). Bilinen bir sorun: bir video oynatıcının düğmeleri.
2. Nerede olduğunu her zaman görürsün (2.4.7, AA). Odak, bulunduğun bağlantının ya da düğmenin çevresinde görünen bir çerçeve ya da renktir. Web geliştiricin tarayıcının standart çerçevesini kaldırırsa, yerine görünür başka bir odak koymalı. Odaktaki düğme, örneğin sabit bir sohbet çubuğunun arkasında tamamen kaybolmamalı (2.4.11, AA, 2.2’de yeni). Kullandığın her arka plan renginde odağın nasıl göründüğünü sana göstermesini web geliştiricinden iste.
3. Sıra mantıklıdır (2.4.3, A). Tab ile sayfada mantıklı bir sırayla, genelde yukarıdan aşağıya ilerlersin.
4. Menüyü atlayabilirsin (2.4.1, A). En üstteki bir “İçeriğe geç” bağlantısı, seni bir sürü tuşa basmaktan kurtarır.
5. Sayfa başlıkları ve başlıklar konuyu söyler (2.4.2, A ve 2.4.6, AA). Tarayıcı sekmesinde “Mahalle ekibine başvuru” yazması, “Ana sayfa” yazmasından daha çok şey anlatır.
6. Bağlantı metinleri açıktır (2.4.4, A). “Buraya tıkla” yerine “Başvuru hakkında daha fazla oku”.
7. Bir sayfaya birden fazla yoldan ulaşılır (2.4.5, AA). Örneğin menü ve bir arama özelliği ya da bütün sayfaların bir listesi. Az gören biri bir sayfayı bazen büyük bir menüden geçmek yerine aramayla daha kolay bulur. Siten sadece üç dört sayfaysa, ana sayfadaki bağlantılar yeterli olabilir.
8. Yeterli zaman var (2.2.1, A). Danışan portalı bir süre sonra kişinin oturumunu kapatıyor mu? O zaman önce uyar ve kişinin tek bir hareketle daha fazla süre isteyebilmesi için en az 20 saniye ver. Ya da kişinin süre sınırını önceden kapatabilmesini sağla.
9. Hiçbir şey duraklatma düğmesi olmadan hareket etmez (2.2.2, A). Kendiliğinden değişen ve beş saniyeden uzun süren haberleri duraklatabilmeli, durdurabilmeli ya da gizleyebilmelisin. Ayrıca hiçbir şey saniyede üç kereden fazla yanıp sönmez (2.3.1, A).
10. Sürükleme ve kaydırma hareketleri olmadan da olur (2.5.7, AA, 2.2’de yeni, ve 2.5.1, A). Bir randevuyu sürükleyerek mi taşıyorsun? O zaman bir düğme ya da açılır liste de koy. Mahallenin haritasında iki parmakla yakınlaştırabiliyor musun? O zaman bir artı ve bir eksi düğmesi de ekle.
11. Görünen metin, koddaki adın içinde de var (2.5.3, A). Bir düğmede “Başvur” yazıyorsa, bu kelime düğmenin koddaki adında da geçer. Çünkü sesle çalışan biri düğmede yazanı söyler: “Başvur’a tıkla”. Düğmenin koddaki adı “Formu gönder” ise hiçbir şey olmaz.
12. Tıklama alanları yeterince büyüktür (2.5.8, AA, 2.2’de yeni). Bir düğme en az 24’e 24 CSS pikselidir (web geliştiricilerin kullandığı bir ölçü) ya da çevresinde yeterli boşluk vardır. Cümlenin ortasındaki bir bağlantı bu şarta dahil değil. 44’e 44’lük daha sıkı ölçü AAA düzeyine aittir (2.5.5).

Dikkat et

• Kendin test et. Fareni bir kenara koy ve başvuru formunu sadece Tab, Shift+Tab, ok tuşları ve Enter ile doldur. Klavye testi bu işte sana on kısa adımda yol gösterir.
• Açılır menüleri ayrıca kontrol et. Fareyle üzerine gelince açılan bir menü klavyeyle de çalışmalı.
• Bir kontrol listesinin hangi sürümü izlediğine bak. Eski kurallar ve kontrol listeleri WCAG 2.1’i temel alır; yukarıda “2.2’de yeni” denen şartlar bunlarda yok. Devlet kurumları için kuralların hangi sürümü istediğini WCAG nedir? yazısında okuyabilirsin.

Daha fazla bilgi

• Diğer ilkeler: algılanabilir, anlaşılabilir ve sağlam.
• Web siteni erişilebilir yapmak: kurumun için adımlar.
• Erişilebilir web sitesi kontrol listesi