Web erişilebilirliği (WCAG) rehberi: neden önemli, nasıl uygulanır

Web erişilebilirliği, bir sitenin görme, işitme, hareket ya da bilişsel farklılığı olan kişiler dahil herkes tarafından kullanılabilmesidir ve uluslararası ölçütü WCAG'dir. Uygulamada yeterli renk kontrastı, yalnızca klavyeyle kullanılabilen arayüz, anlamlı alternatif metinler, etiketli form alanları ve düzenli test, kurumsal bir sitenin AA düzeyine yaklaşması için temel adımlardır. Erişilebilirlik tasarım aşamasında ele alındığında ek maliyeti düşüktür, sonradan eklendiğinde ise çoğu bileşenin yeniden yapılmasını gerektirir.

Web erişilebilirliği nedir ve neden önemlidir?

Erişilebilirlik çoğu zaman yalnızca görme engelli kullanıcılarla ilişkilendirilir, ama kapsamı çok daha geniştir. Ekran okuyucu kullanan bir kişi, fare kullanamadığı için yalnızca klavyeyle gezinen bir kişi, renk körlüğü olan bir kişi, videodaki konuşmayı duyamayan bir kişi ve karmaşık metinleri takip etmekte zorlanan bir kişi, aynı sitenin farklı engellerle karşılaştığı kullanıcılarıdır. Bunlara yaşla birlikte azalan görme ve hareket yeteneği de eklenmelidir.

Engeller her zaman kalıcı da değildir. Kolu alçıda olan biri, güneş altında telefonuna bakan biri ya da gürültülü bir ortamda video izleyen biri de geçici veya duruma bağlı olarak benzer sorunlar yaşar. Bu nedenle erişilebilir tasarım, belirli bir azınlık için yapılan bir uyarlama değil, bütün kullanıcıların deneyimini iyileştiren bir kalite ölçütüdür.

Kurumlar açısından erişilebilirliğin bir de sorumluluk boyutu vardır. Kamu hizmeti veren kurumlar, eğitim kurumları, dernekler ve meslek örgütleri, hizmetlerini bütün üyelerine ve paydaşlarına eşit biçimde sunmakla yükümlüdür. Erişilebilirlikle ilgili yasal düzenlemeler ülkeye ve kurum türüne göre değişebildiği için güncel yükümlülükleri resmi kaynaklardan kontrol etmek gerekir; bu yazı hukuki değerlendirme yerine geçmez.

WCAG nedir ve hangi düzey hedeflenmelidir?

WCAG, yani Web İçeriği Erişilebilirlik Yönergeleri, web içeriğinin nasıl erişilebilir hale getirileceğini tanımlayan uluslararası standarttır. Yönergeler, test edilebilir başarı ölçütlerinden oluşur ve her ölçüt A, AA ya da AAA düzeyinde sınıflandırılır. A en temel gereksinimleri, AA kurumsal siteler için yaygın olarak kabul gören hedefi, AAA ise her içerik türü için ulaşılması her zaman mümkün olmayan en ileri düzeyi ifade eder.

WCAG'nin bütün ölçütleri dört ilke etrafında toplanır. Bu ilkeler, bir sitenin erişilebilirliğini değerlendirirken kullanılabilecek basit bir zihinsel çerçeve sunar.

• Algılanabilir: Bilgi ve arayüz bileşenleri, kullanıcıların algılayabileceği biçimde sunulur; örneğin görsellerin metin karşılığı ve videoların altyazısı vardır.
• İşletilebilir: Bütün işlevler klavyeyle kullanılabilir ve kullanıcıya içeriği okuyup kullanması için yeterli zaman tanınır.
• Anlaşılabilir: Metinler okunaklı, arayüz öngörülebilir ve formlardaki hatalar açık biçimde anlatılır.
• Sağlam: İçerik, ekran okuyucular dahil farklı yardımcı teknolojiler tarafından güvenilir biçimde yorumlanabilir.

Standart zaman içinde yeni sürümlerle genişler ve her sürüm bir öncekinin ölçütlerini büyük ölçüde korur. Yeni bir proje için güncel sürümün AA düzeyini hedeflemek, hem bugünkü beklentileri karşılar hem de ileride yapılacak denetimlerde sağlam bir dayanak oluşturur.

Renk kontrastı nasıl sağlanır?

Renk kontrastı, metin ile arka planı arasındaki parlaklık farkıdır ve okunabilirliğin en temel koşuludur. WCAG'nin AA düzeyi, normal boyuttaki metin için en az 4.5:1, büyük metin için en az 3:1 kontrast oranı ister. Düğme kenarlıkları, form alanı çerçeveleri ve simgeler gibi metin dışı arayüz öğeleri için de en az 3:1 oranı beklenir. Açık gri metin ve soluk düğmeler, tasarımda zarif görünse de bu eşiklerin altında kalmanın en yaygın nedenidir.

Kontrastın yanı sıra rengin tek başına bilgi taşımaması da önemlidir. Hatalı bir form alanının yalnızca kırmızı çerçeveyle, zorunlu alanların yalnızca renkle ya da grafik serilerinin yalnızca renk farkıyla belirtilmesi, renk körlüğü olan kullanıcılar için bilgiyi görünmez kılar. Rengin yanına bir simge, bir metin ya da bir desen eklemek bu sorunu çözer.

Kontrast kararlarını tek tek sayfalarda değil, renk paletinde ve tasarım sisteminde vermek en sürdürülebilir yoldur. Her metin ve arka plan renk çiftinin oranı palet oluşturulurken bir kez ölçülür ve bileşenler yalnızca onaylanmış çiftlerle kullanılır. Sitenin koyu tema seçeneği varsa, aynı kontrol koyu tema renkleri için de ayrıca yapılmalıdır.

Klavye ile kullanım nasıl sağlanır ve test edilir?

Fare kullanamayan kullanıcılar, ekran okuyucu kullananlar ve hızlı çalışmayı tercih eden pek çok kişi, siteyi klavyeyle kullanır. Bu nedenle bağlantılar, düğmeler, menüler, açılır pencereler ve form alanları dahil bütün etkileşimli öğelere klavyeyle ulaşılabilmeli ve bunlar klavyeyle çalıştırılabilmelidir. Tıklama olayı eklenmiş sıradan kutular yerine gerçek düğme ve bağlantı öğelerinin kullanılması, bu gereksinimin büyük kısmını kendiliğinden karşılar.

Klavye erişilebilirliğinin en sık ihmal edilen parçası odak göstergesidir. Kullanıcının o anda hangi öğede olduğunu gösteren çerçeve, görsel nedenlerle kaldırıldığında klavye kullanıcısı sayfada nerede olduğunu kaybeder. Odak göstergesi kaldırılmamalı, gerekiyorsa sitenin tasarım diline uygun, belirgin bir biçimde yeniden tasarlanmalıdır.

Klavye testi için özel bir araç gerekmez. Fareyi bir kenara bırakıp aşağıdaki adımları izlemek, en kritik sorunların çoğunu birkaç dakika içinde ortaya çıkarır.

• Sekme tuşuyla sayfanın başından sonuna gidin ve odağın mantıklı bir sırayla ilerlediğini kontrol edin.
• Her adımda odaklanan öğenin açıkça görülebildiğinden emin olun.
• Sayfanın başındaki «içeriğe geç» bağlantısının menüyü atlayıp ana içeriğe götürdüğünü doğrulayın.
• Açılır menüleri ve pencereleri klavyeyle açıp kapatın ve odağın pencere kapandığında doğru yere döndüğünü kontrol edin.
• Hiçbir öğenin odağı içine hapsedip kullanıcının çıkmasını engellemediğini doğrulayın.
• Formları yalnızca klavyeyle doldurup gönderin ve hata mesajlarına ulaşabildiğinizi kontrol edin.

Alternatif metin ve form etiketleri nasıl yazılır?

Alternatif metin, görseli göremeyen kullanıcıya görselin işlevini ve anlamını aktaran kısa açıklamadır. İyi bir alternatif metin görseli tarif etmekten çok, sayfadaki amacını anlatır. Bir kongre afişinin alternatif metni «afiş» değil, afişin taşıdığı bilgi olmalıdır; bağlantı olarak kullanılan bir logonun alternatif metni ise gittiği sayfayı söylemelidir. Yalnızca süsleme amaçlı görsellerde alternatif metin boş bırakılır, böylece ekran okuyucu onları atlar.

Grafik ve tablolar gibi karmaşık görsellerde kısa bir alternatif metin yeterli olmaz; görselin hemen yanında ya da altında, gösterdiği sonucu özetleyen bir metin bulunmalıdır. Bağlantı metinleri de aynı mantıkla yazılmalıdır: ekran okuyucu kullanıcıları sayfadaki bağlantıları çoğu zaman bir liste olarak dinler ve art arda gelen «buraya tıklayın» ifadeleri bu listede hiçbir anlam taşımaz.

Formlar, erişilebilirlik sorunlarının en çok kullanıcı kaybettirdiği yerlerdir; çünkü bir üyelik başvurusu, kongre kaydı ya da iletişim formu tamamlanamadığında kullanıcı işini yapamaz. Form alanlarında şu kurallar uygulanmalıdır.

• Her alanın, alanla programatik olarak ilişkilendirilmiş görünür bir etiketi vardır.
• Alan içindeki örnek metin, etiketin yerine kullanılmaz; çünkü yazmaya başlanınca kaybolur.
• Zorunlu alanlar yalnızca renkle değil, metinle de belirtilir.
• Hata mesajları hangi alanda ne sorun olduğunu ve nasıl düzeltileceğini açıkça söyler.
• Hata oluştuğunda kullanıcının girdiği bilgiler silinmez ve odak ilk hatalı alana taşınır.

Erişilebilirlik, siteye sonradan eklenen bir özellik değil, her bileşenin baştan doğru yapılmasıdır.

Erişilebilirlik nasıl test edilir ve sürdürülür?

Otomatik test araçları, eksik alternatif metin, düşük kontrast ya da etiketsiz form alanı gibi sorunları hızla bulur ve iyi bir başlangıç noktasıdır. Ancak bu araçlar WCAG ölçütlerinin yalnızca bir bölümünü güvenilir biçimde denetleyebilir. Bir alternatif metnin anlamlı olup olmadığına, odak sırasının mantıklı olup olmadığına ya da bir hata mesajının anlaşılır olup olmadığına ancak bir insan karar verebilir.

Bu nedenle sağlıklı bir test süreci üç katmandan oluşur: geliştirme sırasında otomatik denetim, yayın öncesinde klavye ve ekran okuyucuyla elle yapılan kontroller ve mümkün olduğunda yardımcı teknoloji kullanan gerçek kullanıcılarla yapılan denemeler. Ekran okuyucular işletim sistemlerinde yerleşik olarak bulunur ve birkaç temel komutu öğrenmek, sayfanın bir ekran okuyucu kullanıcısına nasıl ulaştığını anlamak için yeterlidir.

Erişilebilirlik yayından sonra da korunmalıdır. İçerik editörlerinin alternatif metin yazmayı, başlık düzeyini doğru seçmeyi ve bağlantı metnini anlamlı yazmayı öğrenmesi, yüklenen PDF belgelerin ve videoların da erişilebilir olması ve sitenin erişilebilirlik durumunu, bilinen eksiklerini ve iletişim yolunu anlatan bir beyan sayfasının yayımlanması, bu sürekliliğin parçasıdır.

Sık sorulan sorular

Erişilebilirlik araç çubukları siteyi erişilebilir yapar mı?

Hayır. Yazı boyutunu büyüten ya da renkleri değiştiren eklentiler, sitenin kendi kodundaki eksik etiketleri, bozuk klavye kullanımını ya da anlamsız alternatif metinleri düzeltmez. Yardımcı teknoloji kullananların çoğu zaten kendi araçlarını kullanır; asıl ihtiyaç sitenin kendisinin doğru kodlanmasıdır.

Mevcut bir site sonradan erişilebilir hale getirilebilir mi?

Evet, ancak kapsam sitenin yapısına bağlıdır. Kontrast, alternatif metin ve form etiketleri çoğu zaman görece kolay düzeltilir. Menüler, açılır pencereler ve özel bileşenler klavye ve ekran okuyucu desteği olmadan yapılmışsa, bu bileşenlerin yeniden yapılması gerekebilir.

Sitede yayımlanan PDF belgeler de erişilebilir olmalı mı?

Evet. Taranmış görüntüden oluşan bir PDF, ekran okuyucu için boş bir sayfadır. Belgelerin metin tabanlı, başlık yapısı işaretlenmiş ve okuma sırası doğru olarak üretilmesi gerekir. Mümkün olduğunda önemli bilgiyi PDF yerine doğrudan web sayfasında sunmak daha erişilebilir bir çözümdür.

Erişilebilirlik tasarımı kısıtlar mı?

Kısıtlamaz, belirli kararları netleştirir. Yeterli kontrast, okunaklı yazı boyutu ve belirgin odak göstergesi, iyi bir tasarımın zaten taşıması gereken özelliklerdir. Erişilebilirlik ölçütleri baştan tasarım sistemine dahil edildiğinde, görsel kimlikten ödün vermeden uygulanabilir.

Erişilebilirliğe nereden başlanmalı?

En verimli başlangıç, sitenin en çok kullanılan sayfalarında ve formlarında kontrast, klavye kullanımı, alternatif metin ve form etiketlerini kontrol eden kısa bir denetimdir; bu dört başlık en sık karşılaşılan engellerin büyük bölümünü kapsar. Ardından düzeltmeler tasarım sistemine ve içerik editörlerinin alışkanlıklarına taşınmalıdır. Bir Web Ajans olarak geliştirdiğimiz sitelerde kontrast, klavye kullanımı ve form etiketlerini tasarım aşamasında, bileşen düzeyinde ele alıyoruz.