Web Sitesine Erişilebilirliği Artırma Araçları
Hiç şüphe yok ki web sitenize mümkün olduğunca çok sayıda kullanıcı için erişilebilir olması gerektiğini anlıyorsunuz. Ancak tüm yönergeleri ve standartları okumak biraz zor olabilir. En son W3C önerilerini burada bulabilirsiniz, ancak her kelimeyi bilmeniz ve her kılavuzu takip etmeniz mi gerekiyor?
Bugün, web sitesi erişilebilirliğini artırmanıza yardımcı olacak bazı araç ve kaynaklarla biraz daha kolaylaşmaya çalışacağız (ve belki de radarınızda olmadığını düşünmek için bazı kontroller bile!).
Yeterli görsel kontrastınız olduğundan, ekran okuyucuları tarafından erişilebilen bir siteden veya hatta erişilebilir e-postalar oluşturduğunuzdan emin olmak istiyorsanız, sizi ele aldık!
1. renk güvenli
Renk Kasası, metin ve arka plan rengi kontrastı için WCAG Yönergelerine dayalı olarak erişilebilir renk paletlerini kontrol etmenize (ve hatta oluşturmanıza) yardımcı olur. Araç ve standartlar, herkes tarafından okunabilen renk kombinasyonlarını belirlemek için oran tabanlı bir formül kullanır.
WCAG Yönergeleri, küçük (gövde) metinler için 4, 5 ve büyük metinler için (24 noktadan fazla olan) kontrast oranını önerir.
Sadece renklerinizi - HEX koduna göre - yazı tipi seçimi ve boyutuna girin ve bir palet oluşturun. Kontrol etmek için hemen bir oran alırsınız ve diğer benzer renkleri görebilirsiniz. Yazıcınıza ve boyutunuza bağlı olarak benzer bir şeyin daha iyi bir seçenek olup olmadığını kontrol edin.
2. Kahve Yok
NoCoffee, tasarımınızı görme engelli bir kişinin göreceği şekilde görselleştirmenize yardımcı olan bir Google Chrome tarayıcı uzantısıdır. (Hiçbir şey erişilebilirliği bu şekilde görmek gibi önemini vurgulamaz.)
Aşağıdakileri kontrol edebilir ve gösterebilir:
- Küçük metin veya tıklama hedefleriyle düşük keskinlik
- Metin ve arka plan öğeleriyle düşük kontrast sorunları
- Renk körlüğü
- Görsel kar, parlama, gölgelenme ve katarakt
- Gözlerin hızlı istemsiz hareketi olan nistagmus
- Engellenmiş görme alanları
3. Kontrast Denetleyicisi
Kontrast Denetleyicisi, arka plan ve ön plan renklerini ekrana girmenize ve anında, renk kodlu geçiş / başarısızlıkla çeşitli görsel standartlara karşı anında kontrol almanıza olanak tanır.
Aracın güzel özellikleri arasında renk ve gri tonlama seçenekleri arasında geçiş yapma, çeklerinizin örneklerini paylaşma ve görüntülerden renkler çekme özelliği bulunur. Ayrıca bir PDF örneği de kaydedebilirsiniz. Herkesin hızlı bir şekilde kullanabileceği birçok özelliğe sahip kolay bir araçtır.
WCAG Yönergeleri'nde belirtildiği gibi renk oranını da sağlar.
4. Toplam 11y
Tota11y, belgelerin alt köşesine küçük bir düğme yerleştiren bir JavaScript dosyasıdır. Farklı erişilebilirlik kontrolleri için birden fazla eklenti içeren bir araç çubuğu ile genişler.
- Başlıklar ve başlık sırası ihlalleri
- Kontrast (veya eksikliği)
- Eksik veya kafa karıştırıcı metin bağlantısı
- Girişlerde eksik olan etiketler
- Alternatif metin içermeyen resimler
- Etiketler ARIA yer işaretleridir
- Ekran okuyucu “değnek” ile siteyi ekran okuyucu gibi “okuyabilirsiniz”
5. DALGA
WAVE veya web erişilebilirlik değerlendirme aracı, tek bir yerde sağlam bir kontrol koleksiyonudur.
Araç, renk kontrastından yedek başlıklara, HTML ve yapısal öğelere bağlantılara kadar her şey hakkında ayrıntı sağlamak için kenar çubuğundaki bilgilerle ilgili simgelerin görsel bir katmanını kullanır.
Ücretsiz denetleyici size tek bir sayfa hakkında bilmeniz gereken hemen hemen her şeyi sağlar, ancak WAVE aynı zamanda birden fazla site sahibi veya bir kerede birden fazla sayfa isteyen kullanıcılar için ücretli, kurumsal düzeyde araçlar içerir. Ayrıca, intranet, şifre korumalı, dinamik olarak oluşturulmuş veya hassas web sayfalarını özel bir ortamda kontrol edebilen Chrome ve Firefox tarayıcı uzantılarını da içerir.
6. 508 Denetleyici
508 Denetleyicisi, bir web sitesinin federal fon alan herhangi bir kuruluş için yasalarca gerekli olan ABD 508 Uyumluluğu kurallarına uygun olup olmadığını belirlemek için URL'leri test eder.
Bu araç ücretsizken, taramanın tüm sonuçlarını görmek için kaydolmanız gerekir.
Site, kuruluşların 508 Uyumluluğuna tabi olup olmadıklarını ve yüksek öğrenim, kar amacı gütmeyen kuruluşlar ve devlet kurumları için belirli kaynakları öğrenmelerine yardımcı olacak bir sınav da dahil olmak üzere diğer araçları ve kaynakları da içermektedir.
7. HTML_CodeSniffer
HTML_CodeSniffer, kaynak kodunu kontrol eden ve tanımlı standartların ihlallerini arayan bir istemci tarafı komut dosyasıdır. Hem Web İçeriği Erişilebilirlik Yönergeleri 2.0'ı hem de ABD Bölüm 508'i denetler.
Bir kontrol için kodu doğrudan web sitesine yapıştırın veya yer imini kullanın.
Kullanımı kolaydır ve hangi tür bilgilerin görüntüleneceğini seçebilirsiniz - hatalar, uyarılar veya bildirimler ve çekle ilgili endişelerin ayrıntılarını veren bir rapor görüntüleyin.
8. Erişilebilir E-posta
Erişilebilir E-posta, göndermeden önce bir e-posta bülteninin kodunu geliştirmenize yardımcı olacak bir çevrimiçi denetleyici ve HTML düzenleyicisidir. (Ayrıca geçmiş / gönderilen kampanyaları da kontrol edebilirsiniz.)
E-postadan gelen çok fazla dijital iletişim ve potansiyel müşteri oluşturma ile erişilebilirlik açısından unutulmuş web sitesi öğelerinden biri olmamalıdır, ancak genellikle öyledir. Web'de erişilebilirlik için aynı kurallar e-posta gönderileri için de geçerlidir.
Araç kullanımı ücretsizdir ve e-posta pazarlama erişilebilirliğini ve kullanılabilirliğini desteklemek için tasarlanmıştır.
9. Amara
Amara, video için altyazı ve altyazı oluşturmak için bir araçtır.
Ses olmadan veya başka bir dilde bağlantı kurmanın bir yolunun sağlanması, özellikle video tasarımın önemli bir öğesiyse, tasarım öğelerinizi daha fazla kişiye açabilir.
Bu araç, dili ekrana, YouTube gibi web sitelerinde ve video akış platformlarında çalışan okunabilir bir biçimde yerleştirmeyi kolaylaştıran ücretsiz ve kurumsal seçenekler içerir.
10. MobiReady
MobiReady, görsel bir formatta ve sonuç raporuyla birlikte bir mobil erişilebilirlik testi sunar, böylece web sitenizin en küçük cihazlarda nerede yetersiz kalabileceğini görebilirsiniz.
Sitenizi, dünyanın en iyi web sitelerinin sıralaması olan Alexa 1000 ile karşılaştırabilirsiniz; önerilerle ayrıntılı teknik sonuçlar alın ve web sitenizin yüksek, orta ve düşük seviyeli cihazlar da dahil olmak üzere farklı ekranlardaki görüntülemelerini görün.
Bu testin en iyi kısımlarından biri, düzinelerce alanda puanlanması ve herhangi bir "başarısızlık" ile iyileştirme önerileri olmasıdır.
Sonuç
Web sitesi erişilebilirliği söz konusu olduğunda, her tür kullanıcı için kullanılabilirliği ve okunabilirliği dikkate almak önemlidir. Mümkün olduğunca çok kişiye mümkün olan en iyi deneyimi sunabilmek için öğelerin, altyazıların ve altyazıların rengini, boyutunu ve yerleşimini, uygun HTML ve yapıyı ve hatta e-postayı düşünün.
Ayrıca, yukarıda belirtilen 508 Uyumluluk standartları gibi, projeleriniz için geçerli olabilecek bölgesel veya ulusal uyumluluk kurallarını kontrol etmek de önemlidir.
Şüphe duyulduğunda, erişilebilirlik tarafında hata yapmak daha iyidir. Bir paletten bir renk ayarlamak veya bir yazı tipi boyutunu artırmak, böylece daha fazla insanın ekranda ne olduğunu kolayca anlayabilmesi için sorun yok.
