Web erişilebilirliği, bir sitenin ekran okuyucuyla, klavyeyle ve düşük kontrasta duyarlı kullanıcılar için de çalışmasıdır; Avrupa Erişilebilirlik Yasası kapsanan hizmetler arasında e-ticareti açıkça sayar. Uyum maliyetini, tonun tek bir tanım dosyasında mı yoksa bileşen dosyalarına dağılmış mı durduğu belirler. Algoriel’in denetimi buton görünümlü linkleri imzasına almadı ve düşük kontrastlı bir kenarlık rapor temiz derken hiç ölçülmedi.
Erişilebilirliğin maliyetini renk değil, rengin yazıldığı yer belirler
Bir sitede renk ya bileşenin içinde yaşar ya da ayrı bir tanım dosyasında. İkinci durumda araya bir yapı girer: ham değer katmanı tonları bir kez yazar ve doğrudan kullanılmaz; anlamsal katman o tonlara rol adları verir. Bileşen renge ham değeriyle hiç dokunmaz, yalnız rol adını çağırır.
Rol adı görünüşü değil işlevi söyler. Gövde metni, ikincil metin, başlık, bağlantı, vurgu ve odak halkası ayrı rollerdir. Aynı ham ton bunların birkaçına birden bağlanabilir ve bu bir tekrar değil, bir kayıttır: dosyaya bakan kişi tonun nerede metin, nerede çizgi, nerede vurgu olarak çalıştığını okur. Görünüş temaya ve zemine göre değişir; işlev değişmez. Adlandırmanın işlevi seçmesinin sebebi budur.
Pratik sonucu şu: bir rengi düzeltmek jeton tanımındaki tek satırı değiştirmektir. Bileşen dosyaları açılmaz, çünkü hiçbiri o rengi tanımıyor. Yardımcı sınıflar da değere değil ada bağlanır; sınıf yerinde durur, çözümlenen değer değişir.
Kendi sitenizde bu katmanın olup olmadığını ölçmek için erişilebilirlik bilgisine ihtiyacınız yok. Tek bir tonu bir kademe koyulaştırmak isteyin ve kaç dosyanın açıldığını sayın. Cevap tek dosyaysa katman var. Cevap “bakmamız lazım” ise katman yok ve bugünden sonra alacağınız her kontrast kararı o cevabın büyüklüğüne göre fiyatlanacak.
Sıfırdan kurulan bir sitede bu katmanı koymak ayrı bir kalem bile değildir; web yazılımı tarafında ilk ekran çizilmeden önce yapılır ve sonradan dokunulmaz. Getirisinin olmadığı bir hâl de var: bir kez üretilip bir daha değiştirilmeyecek, tek temalı, kapanacak bir sayfa kümesinde araya katman koymak yalnız dosya sayısını artırır. Ayrım yaşam süresindedir. Yıllarca bakılacak bir mağaza ile bir kampanya sayfası aynı kararı hak etmez.
Aynı renk açık ve koyu temada ayrı ayrı ölçülür
Tema, bileşenin gördüğü rol adını değiştirmez; o adın çözümlendiği değeri değiştirir. Kök öğedeki tek bir nitelik açık ve koyu tema arasında geçiş yapar, bileşen dosyalarının hiçbiri bunu bilmez. Temanın sayfa ilk boyanmadan önce hangi değere yerleşeceği ayrı bir konudur; onu Astro ile hızlı web sitesi kurma yazısında anlattık.
Bu yapının erişilebilirlik tarafındaki karşılığı sert: bir renk çiftinin kontrastı her temada yeniden ölçülür. Açık temada eşiği geçen bir çift, koyu temada geçmeyebilir.
Marka altını burada iyi bir örnek. Açık zeminde altın, metin olarak eşiği geçmez. Bu, altının siteden silinmesi anlamına gelmiyor; rolünün daralması anlamına geliyor. Ton büyük süs öğelerinde, ince ayraçlarda, ikon çizgilerinde ve görünümdeki tek vurgulu butonda kalır. Metin kaçınılmazsa o iş için ayrı bir mürekkep jetonu tanımlanır ve okunacak sözcükler onu alır. Koyu temada vurgu rolü daha açık bir altın tona bağlanır; mürekkep jetonu da o tona eşitlenebilir. Metin için ayrı bir ton gerekip gerekmediği temaya göre değişiyor, ama karar jeton dosyasında durduğu için bileşen bu ayrımdan hiç haberdar olmaz.
Ölçüm bazen kararı değiştirir. Etkileşimli kenarlıklar için seçilen ton açık temada eşiği geçiyordu; koyu temanın yükseltilmiş yüzeyinde aynı ton eşiğin altına düştü. Koyu tema için kenarlık bir kademe daha açık bir tona bağlandı. Vurgunun yönü de tersine dönüyor: açık temada bir kontrolün üstüne gelindiğinde kenarlık dinlenme hâlinden daha koyu olur, koyu temada daha açık.
Adında “metin” geçtiği hâlde metin için olmayan bir jeton da olabilir. Açık temada da koyu temada da eşiklerin altında kalıyor ve bu bilerek böyle. Meşru yeri, ekran okuyucudan gizlenmiş ayraçlar, süs çizimleri ve devre dışı kontrollerin etiketi. Okunması gereken her şey, durum bildiren her ok, sıradaki adımı gösteren her işaret ikincil metin jetonunu alır. Bu ayrımı yazılı tutmadığınızda jeton adı bir davet hâline geliyor: adında metin geçen jetonu bir gün biri metne veriyor.
Yeni bir renk çifti sisteme girdiğinde iş bir kez yapılmıyor. Her temada ayrıca denetleniyor ve geçen eşik bir hedef değil, taban çizgisi sayılıyor. Tek tema sunan siteler bu bölümü ucuz atlatır; ama koyu temayı sonradan ekleyen bir mağaza, o gün bütün çiftleri baştan ölçer.
Kenarlığı tek ipucu olan kontrol görünmez sayılır
Kenarlık jetonları renge göre değil işleve göre ayrılır ve ayrımı yapan soru tek: bu kutunun bir kontrol olduğu yalnız çerçevesinden mi belli?
Cevap evetse kenarlık etkileşimlidir. Form alanları, ikincil ve şeffaf butonlar, bir kontrole bağlı çipler ve filtreler, dosya yükleme alanları, dil değiştirici gibi segmentli kontroller, yalnız ikon taşıyan açma-kapama düğmeleri, sayfalama ve sekme linkleri, adım göstergeleri, dolgusu sayfa zeminiyle aynı olan her pill bu gruba girer. Cevap hayırsa kenarlık dekoratiftir: bölüm çizgileri, kart ve panel çerçeveleri, tablo çizgileri, ayraçlar, tıklanamayan rozetler, ekran okuyucudan gizlenmiş süsler ve devre dışı kontroller.
Sınırda duran hâller ayrımı test ediyor. Tüm yüzeyi tıklanabilir bir kartın çerçevesi dekoratif kalır, çünkü kartı tanıtan şey başlığı ve metnidir; üstüne gelindiğinde beliren vurgu bir tanımlama ipucu sayılmaz. Metin bağlantısının alt çizgisi de kenarlık jetonu almaz, ait olduğu metnin rengini miras alır; alt çizgi taşıdığı metinden zayıf görünemez. Kenarlığı olmayan, dolgusuyla ayrışan birincil buton ise bu bölümün tamamen dışında; onun sınavı dolgu ile üstündeki metnin kontrastıdır.
Etkileşimli kenarlığın tonu tahminle seçilmiyor. Renk rampasında eşiği geçen en açık kademe ölçümle bulunuyor ve yeni bir kenarlık değeri uydurulmuyor. Yanına başka güvenceler ekleniyor: her etkileşimli öğede görünür bir odak halkası ve klavyeyle tam kullanım. Odak dış çizgisi hiçbir koşulda kaldırılmıyor. Menü, akordeon, modal ve adım göstergesi klavyeyle baştan sona kullanılabiliyor; modal açıldığında odak içeride kalıyor ve Esc kapatıyor. Hareket imzası solma ile hafif bir yukarı kayma; kullanıcı hareket azaltma tercihini açtığında dönüşümler kapanıyor, opaklık ve anlık durum değişimleri kalıyor. Dokunmatik ekranda her hedef parmak için yeterli alan bırakıyor.
Bir kural da anlamın taşıyıcısıyla ilgili: anlam yalnız renkle taşınmıyor. Hata durumu renk ile birlikte bir yardımcı metin gösteriyor; altın bir ray bir durumu işaretliyorsa o durumun ikinci bir ipucu daha var.
Bu kontroller bir e-ticaret sitesine eşit dağılmaz. Ziyaretçinin donanım ve renk seçtiği bir satış akışında seçim adımları ile ödeme formu, bu yazının saydığı kontrollerin yoğunlaştığı yerdir. Elden geçecek alanı işaretlemek isteyen bir mağaza sahibi, önce satın alma yolunu açıp bu soruyu her kutuya sorabilir.
Denetim “temiz” dediğinde neyi taramadığını sorun
Kendi sitemizde renk kontrastını otomatik bir denetim ölçüyor. Denetimin öğrettiklerinin çoğu, ne yakaladığıyla değil neyi kaçırdığıyla ilgili.
Otomatik denetim bir imzayla çalışır. Hangi seçicilerin etkileşimli sayılacağını bir liste belirler ve o listeye girmeyen kontrol denetimin gözünde yoktur. Bizde şöyle oldu: mega menüdeki ve gezinme çekmecesindeki “tümünü gör” bağlantıları tasarım sisteminde ikincil butondu, ama sınıf adları imzanın aradığı işaretleri taşımıyordu. Denetim onları hiç görmedi. Rapor temiz derken düşük kontrastlı bir kenarlık koda girdi; onu denetim değil, ayrı bir erişilebilirlik incelemesi yakaladı. Kör noktanın bir şekli vardı: zemini şeffaf, etiketi gövde metniyle aynı renkte, adı bir liste bağlantısı gibi kurulmuş öğeler. İmzayı sonradan genişlettik.
Bu olaydan sonra denetimin kendisine bir borç yükledik: ne kadar taradığını raporlamak. Aradığı jeton hiçbir dosyada geçmiyorsa “temiz” demiyor, hiç çalışmadığını söyleyen bir hata üretiyor. Jeton dosyasını bulamazsa kontrastın hiç hesaplanamadığını yazıyor. Hiçbir şeyle eşleşmeyen ölü bir muafiyet kalmışsa onu da uyarı olarak basıyor. Sıfır bulgu ile sıfır tarama artık aynı ekranda aynı şekilde görünmüyor.
İkinci ders daha sinsi. Doğru jeton yanlış değer taşıyabilir. Yüzey rampası bir gün ayarlanır ya da biri kenarlık tonunu bir kademe açar; her kullanım hâlâ doğru rol adına bakmaktadır, oran eşiğin altına düşmüştür ve ad üstünden çalışan hiçbir denetim ötmez. Bu yüzden oranları yorumdan okumuyoruz. Jeton dosyasındaki ham değerden, her temada, her etkileşimli kenarlık rolü ile her zemin ve yüzey rolünün eşleştiği her çift için yeniden hesaplıyoruz.
Bir kör nokta da dosya filtresindeydi. Denetim bir dönem yalnız stil ve şablon dosyalarına bakıyordu; istemci tarafında çalışan bileşenlerin bulunduğu klasör kapsamın dışındaydı. O gün orada bir ihlal yoktu. Ama bunu garanti eden şey filtre değil tesadüftü ve tesadüf bir denetim sonucu değildir.
Muafiyetler de duruyor, koşullu olarak. Tıklanamayan bir rozet çip imzasına yanlış takıldığı için muaf; devre dışı bir arama alanı dekoratif kalabiliyor, ama o alan etkinleştiği gün muafiyet düşüyor. Her muafiyet gerekçesiyle birlikte yazılı.
Bu denetimin göremediği bir alan daha var ve onu ayrı sayıyoruz. Stil dosyasında görünmeyen hiçbir şeyi ölçmüyor: klavye sırası, modaldaki odak tuzağı ve ekran okuyucunun bir düğmeye verdiği ad statik denetimin dışında kalıyor.
Sonradan eklenen erişilebilirlik neden pahalı
Yayındaki bir sitede erişilebilirlik düzeltmesi elbette yapılabilir. Sorulması gereken soru şu: aynı düzeltme kaç yerde yapılır. Aşağıdaki tablo aynı işi jeton katmanı olan ve olmayan sitede karşılaştırıyor.
| Soru | Jeton katmanı olan site | Rengi bileşende yazılmış site |
|---|---|---|
| Bir renk düzeltmesi nerede yapılır | Jeton tanım dosyasında, rolün karşısındaki tek satırda; bileşen dosyaları açılmaz | Tonun geçtiği her bileşen dosyasında ayrı ayrı; aynı ton metin, kenarlık ve süs rolünde karışık durur, hangi geçişin hangi rol olduğu dosyadan okunmaz |
| İkinci tema eklemek | Aynı rol adlarına yeni bir değer bloğu yazılır; bileşen dosyası değişmez | Her bileşene tema koşulu ve ayrı bir değer eklenir; eksik kalan bileşen tek temada kalır |
| Denetim nereye bakar | Tek jeton dosyasına; her tema için her kenarlık rolü ile her yüzey rolünün çifti ham değerden hesaplanır | Bileşenlere dağılmış çiftlere; ölçülecek çiftlerin listesi tamamlanamaz, “temiz” sonucu yalnız taranan kadarını söyler |
| Orantısız yük değerlendirmesinde ne yazar | Yeniden ölçülen roller ve tema başına sonuç; işin sınırı jeton dosyasıyla çizilir | Elden geçecek bileşen dosyaları ve her birinde tema başına ölçüm; yükü büyüten şey uyum değil düzeltmenin dağılmış olması |
Sağ sütundaki durum kötü bir haber gibi görünüyor, ama aynı zamanda somut bir envanter: elden geçecek dosyalar sayılabiliyor, tema başına ölçüm sayısı biliniyor. Yükün büyüklüğünü yaratan şey, düzeltmenin siteye dağılmış olması.
Rengin nerede yaşayacağı, koddan önce bağlanan kararlar arasında pek sayılmaz. Tablo onun neden orada olduğunu gösteriyor: karar bir görünüş tercihi gibi alınır, faturası yıllar sonra bambaşka bir başlık altında gelir.
Orantısız yük bir statü değil, sizin yazdığınız bir değerlendirmedir
Bu noktada masada sık duyulan bir cümle var: “orantısız yük deriz, geçeriz.” Cümlenin ne olduğu yanlış anlaşılıyor.
Avrupa Erişilebilirlik Yasası yükümlülüğün sınırını şöyle çiziyor: uyum, hizmetin temel niteliğini köklü biçimde değiştirmiyorsa ve orantısız bir yük doğurmuyorsa uygulanır. Buradaki sınır bir kapı değil, bir ölçü. Metnin öngördüğü ölçme işini de kimin yapacağı belli: hizmeti sunan işletmecinin kendisi. Değerlendirmeyi otorite yapıp size tebliğ etmiyor; siz yapıyorsunuz.
Yapılan değerlendirmenin sonrası da yazılı. İşletmeci ona dayandığını ilgili otoriteye bildiriyor ve değerlendirmenin kopyasını yalnız talep üzerine sunuyor. Yani ortada dosyada duran, istendiğinde masaya konabilecek bir belge var. Bu, sahip olunan bir sıfat değil; yazılan, saklanan ve gerektiğinde gösterilen bir metin.
Belgenin içeriğini de bu yazının teknik yarısı dolduruyor. “Bizim için orantısız” cümlesi tek başına bir gerekçe değildir; gerekçe, işin ne kadar olduğunu gösteren envanterdir. Elden geçecek dosyalar, her temada yeniden ölçülecek roller, düzeltmenin kaç yerde tekrarlanacağı. Tablonun sağ sütunundaki bir site için bu envanter uzundur ve uzunluğu belgeye yazılabilir bir olgudur. Sol sütundaki site için aynı envanter kısadır ve o da yazılabilir.
Sizin durumunuzda değerlendirmenin sonucunun ne olacağını bu yazı söyleyemez; o, kaynağın metnini sizin olgularınıza uygulayacak hukukçunun sorusu. Söyleyebileceğimiz şey belgenin maliyet tarafının kodda neye benzediği: rengin nerede yazıldığı, o belgede kaç satır tutacağınızı şimdiden belirlemiş oluyor.
Kapsamı sizin adresiniz değil, müşterinizin bulunduğu yer çizer
Geriye kapsam sorusu kalıyor ve genelde şöyle soruluyor: biz Türkiye’de yayın yapıyoruz, bu metin bizi neden ilgilendirsin?
Metnin hizmet sağlayıcı tanımı adrese bakmıyor. Tanım, hizmeti Birlik pazarında sunan kişiyi kapsadığı gibi, hizmeti Birlik’teki tüketicilere sunmayı teklif eden kişiyi de kapsıyor. Ölçüt işletmenin nerede kayıtlı olduğu değil, hizmetin kime sunulduğu ya da teklif edildiği. Bir mağazanın vitrini kime açıksa soru oradan başlıyor.
Hangi hizmetlerin kapsandığı da listelenmiş ve listede e-ticaret hizmetleri açıkça sayılıyor. Metnin e-ticaret tanımı dar da değil: uzaktan, web sitesi ve mobil cihaz tabanlı hizmetler yoluyla, elektronik araçlarla, tüketicinin bireysel talebi üzerine ve tüketici sözleşmesi kurma amacıyla sunulan hizmetleri anıyor. Bu tarif, çevrimiçi satış yapan bir mağazanın günlük işleyişinin tarifi.
Bir geçiş düzenlemesi de var. Belirli bir tarihten önce yapılmış hizmet sözleşmeleri, süreleri dolana kadar sınırlı bir süre değişmeden sürebiliyor. Tarihleri ve süreleri buraya yazmıyoruz, çünkü bunlar kaynağın kendi cümleleriyle okunması gereken şeyler. Kaynak metnin tamamı açık erişimde: Avrupa Erişilebilirlik Yasası’nın resmî metni.
Sitenizin bu tanım karşısında nerede durduğu hukuki bir okuma ve o okumayı hukukçunuz yapacak. Bizim söyleyebildiğimiz, o okumanın sonucu ne olursa olsun değişmeyen bir şey: uyumun bedeli marka renginizde değil, o rengin sitenizde nerede yazıldığında saklı.
AB’deki müşteriye satan bir mağaza kuruyor ya da mevcudunu elden geçiriyorsanız, e-ticaret hizmet sayfamızda satılabilir birim kararının katalogdan önce nasıl alındığını görebilirsiniz. Rengin nerede yaşayacağı da aynı turda kararlaşıyor.
