Veri görselleştirme erişilebilirliği

Erişilebilir grafik ve infografik, sayılarını herkesin ulaşabileceği biçimde taşır: kısa bir alt metin, uzun bir açıklama, gerçek bir veri tablosu, grafiğin üzerine yazılmış etiketler, kontrastı yeten renkler ve renge ek ikinci bir ipucu. Faaliyet raporlarında, sürdürülebilirlik raporlarında, kamu istatistik sayfalarında, web sitelerinde, sunumlarda ve PDF’lerdeki grafikleri WCAG 2.2 AA düzeyine göre erişilebilir yapıyorum; web’de erişilebilir SVG, PDF’te etiketli şekil olarak. Her iş, ölçümler ve denetim araçlarının neyi değerlendiremediğini söyleyen açık bir listeyle teslim edilir.

Aşağıdakilerden biri sizin durumunuzsa doğru yerdesiniz:

• Sürdürülebilirlik ya da faaliyet raporu yayımlıyorsunuz; rapor web’de ya da PDF olarak duruyor ve grafikleri arkasında hiçbir metin olmayan resimler.
• Bir kamu kurumunda, belediyede ya da üniversitede istatistik ve bülten yayımlıyorsunuz; erişilebilirlik değerlendirmesi grafiklerinizi işaretledi: alt metin yok, yalnızca renkle ayrılan seriler, düşük kontrast.
• Ajans ya da tasarımcısınız; müşterinizin raporunu siz hazırlıyorsunuz ve şartnamede WCAG 2.2 AA ya da EN 301 549 geçiyor.
• İhracat yapıyorsunuz; AB’deki müşteriniz kataloğunuzun, sunumunuzun ya da raporunuzun erişilebilir olmasını istiyor.
• İnfografikleriniz tek parça resim; ana rakamlar seçilemiyor, çevrilemiyor, aranamıyor, sesli okunamıyor.

• Sayıyı seçmeyi deneyin. Web sayfasında ya da PDF’te bir değeri veya eksen etiketini fareyle seçin. Seçilemiyorsa o sayılar yalnızca pikseldir.
• Siyah beyaz yazdırın. İki seri ya da iki çubuk yalnızca renkle ayırt ediliyorsa grafik WCAG 1.4.1’i (Rengin Kullanımı) karşılamıyor.
• Pencereyi telefon genişliğine daraltın. Sayfa yana kayıyorsa ya da grafik yazıları gri bir lekeye dönüşüyorsa yeniden akış sağlanmıyor ya da metin okunamıyor demektir.
• Tabloyu arayın. Aynı sayıları veren bir veri tablosu ya da indirilebilir dosya var mı? Yoksa ekran okuyucu kullanan biri en fazla tek bir cümle duyar.

Teknik ayrıntılar için okumaya devam edin. Aşağıda: bir grafiği neyin erişilebilir yaptığı, NASA’nın gerçek sıcaklık verisi üzerinde ölçülmüş bir öncesi–sonrası örneği (bütün dosyalar indirilebilir), Chromium’un PDF yazdırırken grafiklere ne yaptığı ve Türkiye ile AB’deki düzenlemeler. Doğrudan başlamak isterseniz bir rapor gönderin, grafiklerinde neyin yanlış olduğunu söyleyeyim.

Erişilebilir bir grafik, onu göremeyen, renklerini ayırt edemeyen ya da yakınlaştıramayan birine de aynı bilgiyi verir: metin olarak, tablo olarak ve yalnızca renge dayanmayan bir görüntü olarak.

Grafik karmaşık bir görseldir. Alt metni grafiğin türünü ve ana mesajını tek cümlede söyler; yanındaki uzun açıklama eğilimi, uç değerleri ve önemli rakamları verir; veri tablosu bütün değerleri verir (W3C WAI karmaşık görseller rehberi). Alt metin 146 değeri taşıyamaz; kimse de onları tek nefeste dinlemek zorunda kalmamalı.

“Yeşil = yıllık, kırmızı = 10 yıllık ortalama” diyen bir gösterge, o yeşille o kırmızıyı ayırt edemeyen herkesi dışarıda bırakır. WCAG 1.4.1 ikinci bir ipucu ister: çizginin ya da çubuğun yanına yazılmış etiket, farklı çizgi kalınlığı, noktalar, tarama deseni. Doğrudan etiketler gören okuru da göstergeyle grafik arasında gidip gelmekten kurtarır.

Çizgiler, çubuklar ve grafiği anlamak için gereken bütün parçalar zeminine karşı en az 3:1 kontrast sağlamalı (WCAG 1.4.11). Grafikteki yazı da yazıdır ve 4,5:1 ister (WCAG 1.4.3). En sık görülen hatalar pastel seri renkleri ve açık gri eksen etiketleridir.

320 CSS piksel genişlikte içerik yatay kaydırma olmadan kullanılabilmeli (WCAG 1.4.10). 960 piksellik resim olarak dışa aktarılmış bir grafik ya sayfayı yana kaydırır ya da etiketleri okunamayacak kadar küçülür. SVG ile çizilmiş bir grafik dar ekran için yeniden düzenlenebilir; yazılar tasarlandıkları boyutta kalır.

Bu, kamu malı gerçek veri üzerinde yapılmış, ölçülmüş bir örnek çalışmadır; bir müşteri işi değildir. Üç grafikli, bilerek sık görülen hatalarla dolu bir “öncesi” rapor sayfası kurdum, grafikleri erişilebilir olarak yeniden yaptım, iki sayfayı da PDF’e yazdırdım ve her şeyi aynı betiklerle ölçtüm. “Climate report 2025” çerçevesi örnek bir yerleşimdir, gerçek bir yayın değildir.

• Veri: NASA GISS Yüzey Sıcaklığı Analizi (GISTEMP v4), Küresel Kara-Okyanus Sıcaklık Endeksi; 1951–1980 ortalamasına göre yıllık ortalama sapma, °C. 146 yıl, 1880–2025.
• Alındığı yer ve tarih: 6 Ekim 2026, datasets/global-temp veri paketi (annual.csv, main dalı, yalnızca Source = GISTEMP satırları), SHA-256 c9f98d4d…628c296e20.
• Lisans: GISTEMP, ABD hükümeti çalışması olarak kamu malıdır; veri paketinin yeniden düzenlenmiş hâli CC BY 4.0 lisanslıdır. Türetilen değerler: 10 yıllık geriye dönük ortalama (1889–2025) ve 15 on yıl ortalaması (2020’ler 2020–2025’i, yani altı yılı kapsıyor).

“Öncesi” durumu: bir HTML sayfasına gömülmüş matplotlib PNG grafikleri; sayfa başsız (headless) Chromium ile etiketleme açıkken PDF’e yazdırıldı. Böylece hatalar etiketlemenin kapalı olmasından değil, içerikten geliyor. Yalnızca göstergeyle ayrılan açık yeşil ve açık kırmızı bir çizgi grafik; on yılları yalnızca göstergede yazan gökkuşağı renkli bir çubuk grafik; ana rakamları bir renk geçişli resmin parçası olan bir “infografik”. Alternatif metin yok, sabit 960 piksellik yerleşim, sayfa başlığı yok, dil tanımı yok.

İki grafik de elle kurulmuş SVG olarak, üç genişlik seçeneğiyle (260, 600 ve 880 px) yeniden çizildi; seçimi CSS kapsayıcı sorguları (container queries) yapıyor, böylece grafik yazıları tasarlandıkları boyutun altına hiç küçülmüyor. Çizgi grafikte role="img", kısa alt metin olarak bir başlık ve bir açıklama var; yıllık değerler noktalı ince turuncu, 10 yıllık ortalama kalın lacivert çizgi. İki çizginin de ucunda değeriyle etiketi var; en sıcak yıl (2024, +1,29 °C) ve en soğuk yıl (1909, −0,49 °C) grafik üzerinde işaretli.

Çubuk grafik yataya çevrildi ve her çubuğa on yılı ile değeri yazıldı; ortalamanın altındaki çubuklar taralı lacivert, üstündekiler düz turuncu. Web sayfasında klavyeyle gezilebiliyor: tek Tab durağı, ok tuşları, Home ve End, görünür bir değer satırı. Her grafiğin, sayıları veriden üretilmiş görünür bir uzun açıklaması ve başlıklı, başlık hücreli, açılır bir veri tablosu (146 ve 15 satır) var. İnfografik, canlı HTML metninden oluşan üç rakam kartına dönüştü.

“Sonrası” PDF’i veraPDF PDF/UA-1 profilinden 0 başarısız denetimle geçiyor; “öncesi” PDF’i 9 denetimde kalıyor. İkisini de Chromium etiketleme açıkken yazdı; “sonrası” dosyasına ayrıca PDF/UA’nın istediği üst verileri ekledim ve etiketsiz süs öğelerini artifact olarak işaretledim. Bu adım ekrandaki piksellerin 0 baytını değiştirdi.

Öncesindeki 9 başarısız denetim: alternatif metni olmayan üç şekil (7.3-1), etiketsiz iki içerik parçası (7.1-3), PDF/UA tanımlayıcısı yok (5-1), üst veride belge başlığı yok (7.1-9) ve açıklaması olmayan bir bağlantı (7.18.1-2, 7.18.5-2). Nu Html Checker “sonrası” sayfasında hiçbir HTML ya da ARIA hatası bulmadı; bildirdiği 4 CSS hatası yalnızca kapsayıcı sorgularını tanımamasından.

Web sayfasında sorunsuz çalışan bir grafik, PDF’e geçerken alternatif metnini ya da etiketinin tamamını kaybedebilir. Bu çalışmada Chromium 141’de gördüklerim:

Bu örnek için ekran okuyucu testi (NVDA, JAWS, VoiceOver ya da TalkBack) yapmadım. Kılavuz çizgileri 1,25:1 ile bilerek süs düzeyinde bırakıldı; değerleri etiketler ve tablolar taşıyor.

Örnek sayfalar, PDF’ler ve raporlar İngilizcedir.

Bilgisini metin olarak, tablo olarak ve renk olmadan da çalışan bir görüntü olarak taşıyan grafikler ve bunu gösteren ölçümler teslim ediyorum.

• Her grafik için kısa alt metin, uzun açıklama ve veri tablosu; sayılar verinizle karşılaştırılmış olarak.
• Raporun nerede üretildiğine göre web için erişilebilir SVG grafikler ya da mizanpaj dosyanızda düzeltilmiş şekiller ve tablolar.
• PDF yayımlıyorsanız etiketli PDF; PDF/UA-1 sonucu ve kalan başarısızlığın nedeniyle birlikte.
• Bir renk notu: grafik renklerinizden hangileri 3:1’i geçiyor, hangi çiftler renk görme benzetiminde birbirine karışıyor ve önerdiğim en küçük değişiklik.
• Denetimlerin neyi göremediğini de anlatan bir bulgu raporu.

Önce gerçek bir rapor ya da grafik seti gönderirsiniz; fiyat, iş başlamadan sabitlenir.

1. Bir dosya gönderin, mümkünse grafiklerin arkasındaki veriyle (Excel ya da CSV). Neyin yanlış olduğunu, düzeltmeye değmeyecek kısımlar dahil söylerim.
2. Kapsamı ve sabit fiyatı alırsınız; o rapor ya da setin tamamı için.
3. İşi yaparım. Önizleme olduğu belirtilmiş bir kopya; ölçümler, incelemenize sunulan açıklamalar ve önerilen renk değişiklikleriyle birlikte size gelir.
4. Onayınızla son dosyalar, PDF ve bulgu raporu teslim edilir.

Her işi malzemeyi gördükten sonra fiyatlandırıyorum. Grafik sayısı tek başına emeği belirlemez: aynı şablondan çıkmış yirmi çubuk grafik, tek bir yoğun infografikten ya da bir haritadan daha kısa sürebilir. İş başlamadan set için sabit fiyat alırsınız; saat ölçen bir sayaç yok. Grafikler tek bir şablondan ya da stil dosyasından çıkıyorsa önce onu düzeltmek genellikle daha ucuzdur; öyleyse söylerim.

Türkiye’de kurumların web siteleri için bir erişilebilirlik genelgesi var, sürdürülebilirlik raporlaması pek çok şirket için zorunlu hâle geldi ve AB’de erişilebilirlik kuralları genişliyor. Bunların sizin için ne anlama geldiği hukuki bir sorudur.

Hukuki not: Bu sayfa işin teknik tarafını anlatır; kendi durumunuz için hukuk danışmanınıza başvurun.

• Türkiye, web siteleri: “Web Siteleri ve Mobil Uygulamaların Erişilebilirliği” konulu Cumhurbaşkanlığı Genelgesi; kamu kurumları, üniversiteler, belediyeler, bankalar ve elektronik ticaret hizmet sağlayıcıları gibi kuruluşlara web sitelerini ve mobil uygulamalarını erişilebilir hâle getirme talimatı veriyor. Bakanlığın kontrol listesi WCAG 2.2 temel alınarak hazırlanmış. İstatistik sayfalarındaki grafikler de sitenin içeriğidir.
• Türkiye, sürdürülebilirlik raporları: KGK’nın TSRS uygulama kapsamına ilişkin usul ve esasları, 1 Ocak 2024 ve sonrasında başlayan raporlama dönemlerinden itibaren belirli bankalar, halka açık şirketler ve eşikleri aşan büyük işletmeler için geçerli. TSRS raporun içeriğini düzenler, grafiklerin erişilebilirliğini değil; ama bu raporlar grafiklerle dolu ve çoğu web’de PDF olarak yayımlanıyor.
• Standart: EN 301 549 V3.2.1, (AB) 2021/1339 sayılı Uygulama Kararı ile atıf yapılmış uyumlaştırılmış standart; WCAG 2.1 başarı ölçütlerini web içeriğine (madde 9) ve belgelere (madde 10) uyguluyor. Ben WCAG 2.2 AA’ya göre çalışıyorum; şartname isterse ikisine göre de raporluyorum.
• AB: (AB) 2016/2102 sayılı Web Erişilebilirliği Direktifi kamu kurumlarının web sitelerini ve uygulamalarını kapsıyor. (AB) 2019/882 sayılı Avrupa Erişilebilirlik Yasası 28 Haziran 2025’ten bu yana listelediği ürün ve hizmetlere uygulanıyor; AB’deki tüketicilere satış yapan Türk ihracatçıları bu kurallarla satış kanalları üzerinden karşılaşıyor.

Birkaç değerden fazlasını taşıyan bir grafik için yetmez. Alt metin türü ve ana mesajı tek cümlede verir; ayrıntıyı uzun açıklama ve veri tablosu taşır. Örnek çalışmadaki çizgi grafikte 146 değer var ve 146’sının tamamı tabloda.

Yalnızca onayınızla. Her seri rengini zemine ve diğer serilere karşı ölçer, renk görme eksikliklerini benzetir, geçen en küçük değişikliği öneririm. Çoğu zaman tarama deseni ya da doğrudan etiket gibi ikinci bir ipucu, paletin büyük kısmını korumanızı sağlar.

Örnek çalışma grafik kütüphanelerini ve BI araçlarını kapsamıyor; her birinin kendi erişilebilirlik ayarları var. Dışa aktarılmış ve durağan grafiklerle elle kurulmuş SVG’yle çalışıyorum; kütüphaneye özgü iş için kurulumunuzu gördükten sonra ayrıca fiyat veririm.

PDF’i yazan araca bağlı; her dosya için ayrı ayrı söylerim. Örnek çalışmada Chromium’la yazdırılan PDF, yukarıda anlatılan düzeltmelerden sonra veraPDF PDF/UA-1 profilinden 0 başarısız denetimle geçti. Makine denetimleri PDF/UA’nın yalnızca bir kısmını kapsar; okuma sırası ve alternatif metnin niteliği insan incelemesi ister.

Raporu ya da sayfayı ve mümkünse her grafiğin arkasındaki veriyi, Excel ya da CSV olarak. Veri yoksa değerleri grafikten alırım; yayımlanmadan önce siz onaylarsınız.

Hayır ve aksini iddia etmiyorum. Bulgularım dosyalardan, standartlardan ve denetim araçlarından gelir. Yardımcı teknoloji kullanan kişilerle test ayrıca yaptırılmalıdır.

• Erişilebilir PDF (PDF/UA)
• Alt metin ve görsel betimleme
• Erişilebilir renk paleti
• Erişilebilir Word ve PowerPoint
• Erişilebilir Excel
• Erişilebilir EPUB
• Erişilebilir matematik (MathML)
• VPAT ve erişilebilirlik uyum raporu

Tek bir dosya: sizi en çok düşündüren rapor, istatistik sayfası ya da infografik; varsa verisiyle birlikte. Grafiklerinde neyin yanlış olduğunu, düzeltmeye değmeyecek kısımlar dahil açıkça yazarım.

Ali Karabüyük · Tekirdağ, Türkiye · dünyanın her yerindeki müşterilerle uzaktan çalışıyor · 2004’ten beri belge ve görsel üretimi, 2008’den beri profesyonel olarak.