Erişilebilirlik beyanı

Klavye

Sitedeki her denetim öğesi yerleşik bir HTML öğesidir: bağlantı, düğme, giriş alanı, onay kutusu, seçenek düğmesi. Kendi odak modelini kuran özel bir bileşen yoktur; dolayısıyla klavye davranışı bizim değil, tarayıcının davranışıdır. Yapının hiçbir yerinde pozitif tabindex bulunmaz; sekme sırası belge sırasıdır. Odak alabilen tek kaydırma alanı ana sayfadaki kart şerididir: ok tuşlarıyla kaydırılabilmesi için tabindex değeri 0 olarak verilmiştir. Betik çalışırken ana sayfadaki küre de odak alır: ok tuşları 31 yetki alanı arasında adım adım ilerler ve her birinin adı seslendirilir. Dar ekran menüsü tarayıcının kendi kipli iletişim penceresidir: açıkken arkadaki sayfa etkisizleşir ve odak pencerenin içinde kalır; Escape tuşu pencereyi kapatır ve odak menü düğmesine döner.

Odak göstergesi

Tasarım sisteminde bir kez tanımlanan tek bir kural: --ink renginde 2 piksel kalınlığında, 3 piksel boşluklu çerçeve — sahnede 16,17:1 ile krem; vermiyon ve mermer bantlarda ise bandın kendi mürekkebi. Böylece çerçeve, çevrelediği şeyin rengini asla almaz. Yapının hiçbir yerinde klavye odağının çerçevesi kaldırılmaz.

Atlama bağlantıları

Her sayfanın başında iki tane: içeriğe ve menüye. Sekme sırasının ilk iki durağıdır ve odaklandıklarında görünür hâle gelirler. “Menüye geç” geniş ekranda çubuktaki bağlantılara, dar ekranda menü düğmesine, betiğin kapalı olduğu dar ekranda ise alt bilgideki dizine götürür.

Başlıklar

Sayfa başına tek h1, atlanan seviye yok — yalnızca açtığımız sayfalar değil, bu yapıdaki her sayfanın üretilmiş HTML’i denetlendi. Bölüm başlıkları gerçek başlıktır; başlık gibi biçimlendirilmiş paragraf değil.

Dil

lang özniteliği her sayfada <html> üzerinde tanımlıdır ve rotayla birlikte değişir. Mevzuat okuyucusunda her sütun lang="tr" veya lang="en" olarak işaretlenir; böylece ekran okuyucu Türkçeyi İngilizce sesle okumak yerine katlama noktasında ses değiştirir.

Görseller

Bu sitede hiçbir bilgi görselle aktarılmaz. Üretilmiş görsel, ikon yazı tipi ve logo görseli yoktur: oklar ve simgeler aria-hidden işaretli satır içi SVG’dir; logo ise yazıdır. Tuvale çizilen iki şey vardır — gerçek bir heykelin taraması olan mermer figür ve ana sayfadaki noktalı küre — ikisi de aşağıda anlatılmıştır.

Renk

Hiçbir durum yalnızca renkle anlatılmaz. Değişik bir madde “Değişik” kelimesini ve tarihi taşır; mülga bir hüküm, renginin yanı sıra resmî şerhini kelimelerle taşır: Türkçede “(Mülga: …)”, İngilizcede “(Repealed: …)”; zorunlu alan “zorunlu” yazar; yurt dışına aktarım işareti etiketlidir; okuyucudaki renk kodlu şerit, erişilebilir adları madde numarasını, başlığı ve durumu kelimelerle söyleyen bağlantılardan oluşur.

Tablolar ve listeler

Gerçek <table>; <caption>, <thead> ve satır başlıklarıyla. Gerçek <dl>, <ol>, <ul>. Burada tablo taklidi yapan bir div yoktur. Dar ekranda yeniden dizilen tablolarda her parça tablo rolünü açıkça taşır; böylece yeniden dizilme anlam yapısını bozmaz.

Yakınlaştırma ve yeniden akış

Bu yapıdaki her sayfa 320 CSS piksel genişliğinde açıldı; hiçbirinde sayfa gövdesi yatay kaymadı. Düzen bu genişliğe kadar akışkan kaldığından, 1280 piksellik bir pencerede %200 yakınlaştırma — ki 640 piksellik bir görüntü alanına denktir — aynı biçimde yeniden akar. Saklama tablosu ve yukarıdaki kontrast tablosu tek sütunlu satırlara yeniden dizilir, mevzuatın paralel sütunları tek sütuna iner, ana sayfadaki kart şeridi ise sayfayı peşinden sürüklemek yerine kendi kabı içinde kayar.

Formlar

Her alanın <label for> etiketi vardır. Gruplanan alanlar <legend> başlıklı bir <fieldset> içindedir. Zorunlu alanlar, öznitelik yanında “zorunlu” kelimesini de taşır. Sayfadaki doğrulama tarayıcının kendi doğrulamasıdır; böylece hata davranışı, ziyaretçinin yardımcı teknolojisinin zaten bildiği davranıştır. Sunucunun reddettiği her şey ise uyarı olarak duyurulan bir özet içinde, her satırı tam bir cümle olacak biçimde listelenir.

Yazdırma

Mevzuat sayfalarında yazdırma stili vardır: sahne beyaz kâğıda döner, denetimler ve süsleme kaldırılır, maddeler düzgün bölünür, durum kelimeleri fotokopiden sağ çıkar.

Yüksek kontrast

prefers-contrast: more altında iki ikincil mürekkep açılır ve bilgi taşıyan çizgiler mürekkebe yaklaşır; süsleyici ince çizgiler yalnızca küçük bir adım belirginleşir, çizim ızgarasının yapı çizgileri ise hiç çizilmez; böylece hiçbir süs metnin üzerinden geçmez.

Sitedeki içerik betiğe bağlı değildir. Normalde betikle yazılacak davranışlar bilinçli olarak betiksiz kurulmuştur:

Paralel Türkçe ve İngilizce katlama

İki sütun ve aralarındaki ortak bent harfleri bir CSS alt ızgarasıdır. Hiçbir genişlikte düzenin arkasında betik yoktur; #m9, #m9-3, #m22-1-l gibi derin bağlantılar da betiksiz çözülen sıradan bağlantı çıpalarıdır.

2024 değişiklik izleri

“2024 değişikliklerini göster”, bir onay kutusudur; izler CSS’in :has(:checked) kuralıyla çizilir. Betikler kapalıyken de anahtar, değişiklik şerhlerini ve üzeri çizili mülga metinleri açar.

Dil geçişi

1180 pikselin altında her fıkranın ikinci dili yine bir onay kutusu ve aynı :has(:checked) kuralıyla açılır; belge düzeyindeki “her iki dili birden göster” anahtarı da bir onay kutusudur. Kanunun tamamı, iki dilde, JavaScript kapalıyken erişilebilir durumdadır. Betiğin eklediği tek şey, tercihin ziyaretler arasında hatırlanmasıdır.

Belirme animasyonları

Kaydırdığınızda yerine yükselen bloklar ve başlık kelimeleri yalnızca belirme betiği tarafından ve yalnızca betik çalıştığı anda görüntü alanının altındaysa gizlenir. Betik hiç yüklenmezse hiçbir şey gizlenmemiş olur: durağan stil dosyası, bitmiş sayfanın kendisidir.

Figür ve küre

Mermer figür ile ana sayfadaki küre, betikle çizilen iki şeydir ve ikisi de süstür: yanlarındaki her kelime belgede gerçek metindir. Figürün çizilemediği yerde yerinde durağan bir görüntü durur; betik kapalıyken küre, derleme sırasında bir kez çizilmiş aynı çizim olarak hareketsiz durur; yanındaki Atlas bağlantısı ise bundan etkilenmez.

Ana sayfanın açılışı

Geniş ekranda ana sayfanın açılış bölümü sabitlenir ve kaydırma konumuyla oynatılır; bunu yapan betiktir. Betik olmadığında — dar ekranlarda ve azaltılmış hareket tercihinde de — aynı içerik, aynı sırayla ve eksiksiz olarak, alt alta dizilmiş olağan bölümler hâlinde yer alır.

Betiğe ihtiyaç duyanlar

Dar ekran menüsü, künye kopyalama, madde arama kutusu, ana sayfadaki yükleme perdesi, hizmet sekmeleri ve kart şeridinin okları ile saklama sayfasındaki silme düğmeleri. Betik kapalıyken menü düğmesi, her sayfada gezinmenin tamamını taşıyan alt bilgideki dizine giden bir bağlantıdır; arama kutusu, yükleme perdesi, sekmeler ve oklar gösterilmez, şerit ise kendi başına kayar; her künye yine fıkrasına giden kalıcı bir bağlantıdır, yalnızca kopyalama betik ister; silme düğmeleri devre dışı olarak yayımlanır ve sebebini yazar.

Bu yapıdaki zamana bağlı her geçiş ve animasyon calc(var(--motion) * Nms) biçiminde yazılır ve prefers-reduced-motion: reduce altında --motion sıfırlanır. Dolayısıyla azaltılmış hareket, yeni bir bileşenin katılmayı unutabileceği bir istisnalar listesi değildir: tek bir tokendır; hareket eden ama buna uymayan bir bileşen, sistemi bilerek dolanmak zorunda kalırdı. Betikle hareket eden şeyler — kaydırma belirmeleri ve sayaçlar, mermer figür, ana sayfanın kaydırmayla oynatılan açılışı ve küresi — başlamadan önce aynı tercihi okur ve bu tercih altında hiç başlamaz.

Her animasyon bir başlangıç durumundan öğenin kendi durağan CSS’ine doğru ilerler; giriş kare tanımları yalnızca “from” yazıldığı için hedef, yapısı gereği bitmiş tasarımın kendisidir. Azaltılmış hareket durumunu bozuk değil tamamlanmış bir tasarım yapan şey budur: --motion sıfırken boyanan ilk kare, bitmiş sayfadır. Sitede hiçbir öğe stil dosyasında sıfır saydamlıkta bırakılmaz. Belirme betiği yalnızca çalıştığı anda görüntü alanının altında kalanı gizler, her öğeyi geldiğinde serbest bırakır, azaltılmış hareket altında hiçbir şeyi gizlemez ve hiç yüklenmezse hiçbir şey gizlenmemiş olur.

Azaltılmış hareket durumu, kendi başına değerlendirilebilsin diye: her başlık ve blok çoktan yerinde; mermer figür durağan bir karede; ana sayfa alt alta dizilmiş olağan bölümler hâlinde, sektör adları şeridi ve küresi durağan; mevzuat okuyucusunun katlama çizgisinde durağan bir çizgi; okuyucunun bent harfleri çoktan durağan renklerinde.

Belirmelerin dışında üç şey kaydırmaya karşılık verir. Okuyucunun bent harfleri görüntü alanını geçerken griden durağan renklerine ısınır — kaydırma dinleyicisi olmayan, prefers-reduced-motion: no-preference sorgusunun içinde duran saf bir CSS view() zaman çizelgesi; desteklemeyen tarayıcı bitmiş harfi gösterir. Geniş ekranda ana sayfanın açılışı sabitlenir ve kaydırma konumu onu oynatır — başlık, rakamlar, altı hizmet ve figürün kamerası; geri kaydırmak aynı sırayı tersinden oynatır. Ana sayfa dışındaki her sayfanın altında ise figür, görüntüye girerken logonun ardında yükselir. Hiçbiri kaydırmayı devralmaz: fare tekerleği, klavye ve kaydırma çubuğu sayfayı her zamanki gibi kaydırır.

Üç şey kendiliğinden hareket eder: mevzuat okuyucusunda, sayfa açılırken katlama çizgisinin görünen kısmı boyunca bir kez, beş saniyede inen ve sonra duran ince bir ışık; ana sayfadaki sektör adları şeridi; ve ekranda olduğu sürece yavaşça dönen ana sayfa küresi. Üçü de süstür ve üçü de azaltılmış hareket tercihinde durur; şerit ayrıca imleç üzerindeyken duraklar. Ana sayfadaki kart şeridini okuyucu hareket ettirir — kaydırarak, ok tuşlarıyla veya iki düğmesiyle; şerit kendiliğinden ilerlemez. Kendiliğinden başlayan ses veya video yoktur. Geniş ekranda ana sayfayı, figür hazır olana kadar ve en fazla yaklaşık üç saniye boyunca bir yükleme perdesi örter; herhangi bir tuş, tekerlek hareketi veya tıklama onu daha erken kaldırır. Dar ekranlarda, azaltılmış hareket tercihinde ve betik kapalıyken bu perde gösterilmez. Hiçbir içeriğin anlaşılması harekete bağlı değildir. Belirme animasyonları yalnızca ilk ekranın altında uygulanır, öğe geldiğinde bir kez çalışır ve tekrarlanmaz.

Sitede üç tür süsleme vardır. Hiçbiri bilgi taşımaz ve hiçbiri bir şeyin tek anlatım yolu değildir.

Mermer figür

Gerçek bir heykelin taraması; ana sayfa sahnesinde ve ana sayfa dışındaki her sayfanın altında logonun ardında WebGL ile canlı çizilir; figürü zaten sahnesinde taşıyan ana sayfanın altında ise onun durağan bir görüntüsü durur. Tuval aria-hidden taşır ve işaretçi olaylarını almaz: hiçbir zaman sizinle bir denetim öğesinin arasına girmez ve hiçbir zaman odak almaz. Ana sayfada çerçevesi, ne gösterdiğini söyleyen tek cümlelik bir adla görsel olarak tanıtılır; sayfanın altında ise hiç seslendirilmez. Kaynağı, lisansı ve işlenme süreci kaynak sayfasında yayımlanır.

İşaretçiye verdiği karşılık

Figür imlece karşılık verir: imleç, taşın altındaki tel kafesi açığa çıkarır; dokunmatik ekranda ise bir dokunuş figürün üzerinde tek bir dalga yayar. İkisi de bilgi taşımaz ve hiçbir işlev bunlara bağlı değildir; azaltılmış hareket tercihinde ikisi de gerçekleşmez.

Ne zaman durur

prefers-reduced-motion altında durağan bir karede tutulur. WebGL’in bulunmadığı, betiğin kapalı olduğu ya da tarayıcının ziyaretin veri tasarrufu modunda veya 3G ya da daha yavaş bir bağlantıda olduğunu bildirdiği yerde — ana sayfada da, sayfanın altında da — aynı figürün durağan bir görüntüsü yerine geçer; bilgi taşımadığı için alternatif metni boştur. Tuval yazdırmada kaldırılır.

Küre

Ana sayfanın Atlas bandında, iki boyutlu bir tuvale çizilen noktalı bir küre, Atlas’ın karşılaştırdığı 31 yetki alanını gösterir. Çizimin kendisi aria-hidden taşır: yanındaki başlık, rakamlar, yetki alanları dizini ve Atlas bağlantısı gerçek metindir. Ekranda olduğu sürece yavaşça döner, prefers-reduced-motion altında durur ve işaretçiyle sürüklenerek çevrilebilir. Betik çalışırken çerçevesi adlandırılmış bir grup olarak klavye odağı da alır: ok tuşları yetki alanları arasında adım adım ilerler, küreyi her birine doğru çevirir ve adını seslendirir; Escape tuşu seçimi bırakır. Hiçbir işlev bunlara bağlı değildir.

Üzerindeki yazı

Figürün üzerine büyük boy yazıdan küçüğü dizilmez; o da ancak ardında sahne görünürken. Daha küçük her ses düz sahne üzerinde durur.

Çizim çizgileri

Sayfa başlıklarının ve bantların ardındaki soluk ızgara, köşegenler ve + işaretleri tek bir satır içi SVG’dir; aria-hidden taşır ve --rule-quiet ile çizilir — yapısı gereği süstür, çünkü o kontrastta hiçbir şeyin bilgi taşımasına izin verilmez. forced-colors: active altında kaldırılır ve yazdırılmaz.

1440 piksel ve üzeri

Türkçe ve İngilizce, tek bir katlama çizgisini paylaşan paralel sütunlarda; yanında künye sütunu.

1180 pikselin altı

Sayfanın dilinde tek sütun. Diğer dil, her fıkranın hemen altına yerleşir — önce Türkçe belgenin tamamı, sonra İngilizcenin tamamı değil; o düzen paralel okumayı bitirirdi.

320 piksel

Tek sütun. Bent harfleri kenarda kalır; hiçbir şey kaybolmaz ve hiçbir şey yana kaymaz.

%200 yakınlaştırma

Dar ekran düzeniyle aynı davranır: aynı yeniden akış, içerik ve işlev kaybı olmadan.

Gezinme

Okuyucunun şeridi, madde başına bir bağlantı içeren sıralı bir listedir ve klavyeyle dolaşılabilir; her bağlantının erişilebilir adı madde numarasını, başlığını, durumunu ve varsa maddenin yurt dışına aktarımla ilgili olduğunu taşır.

Bağımsız denetim yok

Bu siteyi büro dışından kimse değerlendirmemiştir. VPAT ve EN 301 549 değerlendirmesi bulunmamaktadır.

Ölçüt ölçüt rapor yok

A ve AA seviyesindeki başarı ölçütlerinin tamamını tek tek dolaşıp her biri için sonuç kaydetmedik. Yukarıda sayılanlar, denetlenenlerdir.

Ekran okuyucular

Bu yeniden tasarım henüz ekran okuyucuyla okunmamıştır. Önceki yapı, resmî bir test niteliği taşımayan bir denemeyle okunmuştu — Windows’ta NVDA, macOS ve iOS’ta VoiceOver ile; ana sayfa, mevzuat okuyucusu ve bu sayfa üzerinde — ve o okumanın dayandığı belge yapısı bu yapıda korunmuştur. JAWS, Ekran Anlatıcısı ve TalkBack ikisinde de kullanılmamıştır.

Ana sayfanın sabitlenen açılışı

Açılış sabitlenmişken klavye odağının altı hizmet paneli arasında nasıl ilerlediği bu yapıda sınanmamıştır.

Yeniden akış, öykünmeyle

320 CSS pikseli, masaüstü tarayıcıda o görüntü alanı genişliğinde doğrulandı; fiziksel bir cihaz matrisinde değil.

Okunabilirlik seviyesi

Mevzuat metni yürürlükteki hâliyle yayımlanır. Metnin okunabilirlik seviyesi bizim değil, yasa koyucunun seviyesidir; zaten AAA ölçütü olan 3.1.5 bakımından bir iddiada bulunmuyoruz.

Aşağıdaki süreler

Ölçüm değil, taahhüttür.

Atlas

atlas.gdpr.com.tr ayrı bir yayındır ve WebGL ile hazırlanmış bir küre sunar. Üç boyutlu olarak işlenen bir tuval ekran okuyucuya tam olarak aktarılamaz; aksini iddia etmiyoruz. Bu nedenle Atlas, aynı içeriğe eşdeğer ve tümüyle klavyeyle gezilebilir bir yol taşır: 31 yetki alanının tamamı yapılandırılmış metin olarak, her biri otoritesi, ceza üst sınırı, mevzuatı ve örnek kararlarıyla, küreye hiç dokunmadan okunabilir. Küre bileşeni bakımından kısmi uyum beyan ediyoruz.

Kendiliğinden başlayan hareket

Ana sayfadaki sektör adları şeridi ve ana sayfa küresi, istenmeden ve beş saniyeden uzun süre hareket eder. İkisi de prefers-reduced-motion altında durur, şerit ayrıca imleç üzerindeyken duraklar; ancak sayfada bunlar için ayrı bir duraklatma denetimi yoktur.

Üçüncü taraf sayfaları

Kuruma, EUR-Lex’e, Resmî Gazete’ye ve diğer dış sitelere verilen bağlantılar, üzerinde kontrolümüz bulunmayan ve düzeltemeyeceğimiz içeriklere yönlendirir.

Eski içerikler

Önceki siteden aktarılan az sayıda belge henüz her ölçütü karşılamıyor olabilir. Bunları tek tek gözden geçiriyoruz ve bize bildirilen her sorunu düzeltiyoruz.

Burada bir engelle karşılaşırsanız veya sitedeki herhangi bir belgeye başka bir biçimde ihtiyaç duyarsanız bize yazın. Erişilebilirlik bildirimini geri bildirim olarak değil, hata kaydı olarak ele alıyoruz: iki iş günü içinde dönmeyi, on iş günü içinde düzeltmeyi veya gerekçesini açıklamayı hedefliyoruz.

Hangi sayfa olduğunu, neyi kullandığınızı — tarayıcı ve yardımcı teknoloji — ve ne olduğunu yazmanız işimizi kolaylaştırır. Zorunlu değildir; bir cümle yeterlidir.