Algılanabilir: kimse bilgiyi kaçırmaz

Nedir

Algılanabilir, dört WCAG ilkesinden ilkidir. Web sitendeki bilgiyi herkes algılayabilmeli.

Bu ilkenin dört yönergesi var: görsellere metin (1.1), video ve ses (1.2), uyarlanabilir bir yapı (1.3) ve kolayca ayırt edilen içerik (1.4). 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.

Neden önemli

Görmeyen insanlar çoğu zaman bir ekran okuyucu kullanır: sayfayı sesli okuyan bir yazılım. Ekran okuyucu bir görselde, senin o görsele eklediğin metni okur.

Az gören bazı insanlar ekranı epey yakınlaştırır ya da bir ekran büyüteci kullanır. Metin ekranın genişliğine uyuyorsa, yukarıdan aşağıya rahatça okurlar. Uymuyorsa, her satırda sağa sola kaydırmaları gerekir ve kolayca ipin ucunu kaçırırlar.

Nasıl yaparsın

1, 2, 5 ve 8. adımlar, web sitesine kendin koyduğun şeylerle ilgili: görseller, videolar ve metin. Diğer adımlar daha çok web geliştiricinin işi, ama onları kontrol edebilirsin.

1. Her görsele bir metin alternatifi ver (1.1.1, A düzeyi). Bu alternatif metin, görselin tam olarak neye benzediğini değil, ne anlama geldiğini söyler. Mahalle ekibinin (wijkteam) girişini gösteren bir fotoğraf için: “Kütüphanenin yanında mavi kapılı giriş”. “Görsel” ya da “resim” gibi sözcüklere gerek yok, çünkü ekran okuyucu bunu zaten söyler. Bir görsel sadece süs mü? O zaman alternatif metni boş bırak. Bir şemaya kısa bir alternatif metin yaz, şemadaki adımları da altına numaralı bir liste olarak ekle. Alt metin yardımcısı sana birkaç soru sorar ve böylece seninle birlikte bir alternatif metin hazırlar.
2. Videolara altyazı ekle (1.2.2, A). Canlı yayın mı yapıyorsun, örneğin yakınlarına bakım veren kişiler için bir webinar? O zaman canlı altyazı sağla (1.2.4, AA). Kayıtlı bir videoda sadece görüntüde görülen şeyleri, ek bir sesli anlatımla betimle (1.2.5, AA). Sadece ses mi var, örneğin bir podcast? O zaman yazıya dökülmüş metnini de ekle (1.2.1, A).
3. Yapıyı koda yerleştir (1.3.1, A). Sadece kalın harf değil, gerçek başlıklar ve listeler kullan. Böylece ekran okuyucu başlıktan başlığa atlayabilir. Yapı kontrolü kodda hangi başlıkların olduğunu gösterir.
4. Formlarda tarayıcının yardım etmesine izin ver (1.3.5, AA). Ad, e-posta adresi ve telefon numarası gibi alanlara sabit bir kod ver. Tarayıcı bu alanları o zaman kendisi doldurabilir. Böylece daha az yazarsın ve daha az şey hatırlaman gerekir.
5. Bilgiyi sadece renkle verme (1.4.1, A). “Zorunlu alanlar kırmızıdır” renk körü biri için işe yaramaz, bu yüzden bir kelime ya da işaret de ekle. Aynı şey sadece biçime ya da yere dayanan bir yönlendirme için de geçerli, örneğin “sağdaki yuvarlağa tıkla” (1.3.3, A). Renk gözlüğü ile renk körü birinin sayfanı aşağı yukarı nasıl gördüğünü görürsün.
6. Yeterli kontrast sağla (1.4.3, AA). Kontrast, metin ile arka plan arasındaki açıklık ve koyuluk farkıdır. Normal metnin kontrastı en az 4,5:1, büyük metninki (18 punto ya da 14 punto kalın) en az 3:1 olmalı. Bu, boş bir form alanındaki örnek metin için de geçerli. Form alanlarının çerçevesi ve bir anlam taşıyan simgeler için en az 3:1 gerekir (1.4.11, AA). Renk gözlüğü iki renk için oranı hesaplar.
7. Metni büyütmeye izin ver (1.4.4, AA). %200 büyütmede her şey hâlâ çalışır. 1280 piksel genişliğinde bir ekranda, yana kaydırmadan %400’e kadar yakınlaştırabilirsin (1.4.10, AA). Biri satırlar, harfler ve kelimeler arasındaki boşluğu kendisi artırırsa hiçbir metin kaybolmaz (1.4.12, AA).
8. Metni resmin içine koyma (1.4.5, AA). Taranmış bir broşürde kimse harfleri, satır aralığını ya da renkleri değiştiremez. Logo ise olur.
9. Sayfanın ekranla birlikte dönmesine izin ver (1.3.4, AA). Bir sayfa, ekran dik de dursa yan da dursa, telefonda da tablette de çalışır, çünkü bazı insanların tableti tekerlekli sandalyelerine tek bir konumda sabitlenmiştir.

Dikkat et

• Alternatif metnin doğru olup olmadığını her yerde ayrı kontrol et. Aynı fotoğraf bir sayfada bilgi verir, başka bir sayfada sadece süs olabilir. Bir test programı alternatif metnin eksik olup olmadığını görür, doğru olup olmadığını görmez.
• Otomatik altyazıları kontrol et. Çoğu zaman hatalı olurlar. Bir yerde “değil” kelimesi eksikse, söylenenin tam tersi yazar. Bu yüzden onları başlangıç olarak kullan ve kendin düzelt.
• Bilgiyi PDF yerine tercihen bir web sayfasına koy. WCAG şartlarını belgelere de uygulayabilirsin, ama bir PDF’yi erişilebilir yapmak pek çok kurum için zor. Yine de belge olması gerekiyorsa, Erişilebilir belgeler hazırlamak yazısını oku.

Daha fazla bilgi

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