WordPress ile Erişilebilir Web Siteleri Oluşturmak İçin En İyi Araçlar ve İpuçlarının Nihai Listesi.
Yayınlanan: 2016-10-08Erişilebilir Web tasarımı oluşturmak için web erişilebilirlik yönergelerini okuyun. Hızlı ve çok kolay web siteleri ve bloglar oluşturmak için kullanılabilecek çok sayıda ücretsiz CMS vardır ancak erişilebilir web siteleri oluşturmak zor ve karmaşık olabilir. Web sitelerinizi test etmek için web erişilebilirlik kontrol araçlarını kullanmayı unutmayın.
Bu yazıda, WordPress ile kullanıcı dostu ve erişilebilir web siteleri oluşturmak için en iyi uygulamaları, teknikleri ve eklentileri paylaşacağım.
Dünya nüfusunun yaklaşık %15'i veya tahminen 1 milyar insan engelli yaşıyor. Dünya Sağlık Örgütü tarafından bir milyar insanın engelli olduğu tahmin ediliyor ve %80'i gelişmekte olan ülkelerde yaşıyor.
Uygun İnternet araçları mevcutsa, engelliler topluma eşit olarak katılabilir ve ekonomiye önemli katkılarda bulunabilirler. İnternetTopluluğu
Erişilebilir web siteleri ne anlama geliyor?
Engelliler için erişilebilirlik, bir web sitesini veya mobil uygulamayı engelli olmayan bir kişi kadar etkin bir şekilde kullanabilmek anlamına gelir.
Web Erişilebilirliğinin Önemi
Bu, nüfusun daha geniş bir kesimi tarafından kullanılabilen web siteleri, ürünler, uygulamalar ve hizmetler oluşturmak için kapsayıcı tasarım ilkelerini, önerilen en iyi kodlama uygulamalarını ve araçlarını kullanmak anlamına gelir.
Bazı durumlarda bu mümkün değildir ve boşluğu doldurmak için yardımcı teknolojilere başvurulabilir. Eğer öyleyse, ana akım teknolojiler, hem birlikte çalışabilirlik hem de veri taşınabilirliği açısından yardımcı cihazın yazılım veya donanım bağlantısını sorunsuz bir şekilde sağlamalıdır.
Basit bir deyişle, Erişilebilir Web Siteleri, engelli kişiler tarafından sorunsuz bir şekilde kullanılabilir. İşitme engelliler seslerin ve videoların dökümlerini okuyabilir ve insanlar klavye aracılığıyla (fareyi kullanmadan) web sitenizin farklı bölümlerine gidebilir ve renk körleri de web sitenizi görebilir.
Engelliler için Web Erişilebilirliği
Erişilebilir Web Siteleri Oluşturma: En İyi Uygulamalar ve WordPress Eklentileri
Bir web sitesi oluşturmak için bir CMS'ye ihtiyacınız var ve web sitenizi internette barındırmak için güvenilir bir web barındırma sağlayıcısına ihtiyacınız var.
1. Hızlı ve Güvenilir Bir WebBarındırma Sağlayıcısı Seçin
Paylaşılan barındırma planları da çok popüler ve uygun fiyatlı. Büyük bir bütçeniz yoksa ve küçükten başlamak istiyorsanız. WestHost.com gibi güvenilir ve uygun fiyatlı bir barındırma sağlayıcısına kaydolun.
Bir işletme web sitesi veya blog kuracaksanız. Fazladan dolar harcamaktan çekinmeyin. Daha güvenilir ve Yönetilen bir WordPress Barındırma sağlayıcısına kaydolun.
FlyWheel, harika WordPress barındırma ve yönetim hizmetleri sunar. Tasarımcılar ve ajanslar için sıfırdan tasarlandı. Temel plan yalnızca ayda 15 ABD dolarından başlar.
2. Bir Accessibi1e CMS seçin
Sıfırdan web siteleri oluşturmak veya kendi CMS'nizi oluşturmak pahalıdır ve çok zaman alır. WordPress gibi harika, güçlü ve güvenilir bir İçerik Yönetim Sistemi seçin.
WordPress geliştiricileri web erişilebilirliğini çok ciddiye alır. WordPress Erişilebilirlik ekibinin resmi bir WordPress erişilebilirlik blogu vardır.
Erişilebilir web sitelerini hızlı ve kolay bir şekilde oluşturmak için çok sayıda ücretsiz ve premium WordPress eklentisi ve teması da mevcuttur. Varsayılan WordPress temaları erişilebilirliğe hazırdır ve kendi erişilebilir WordPress Temalarınızı oluşturmak için belgeleri okuyabilirsiniz.
WordPress yalnızca basit bir blog oluşturma aracı değildir, bu güçlü CMS'yi 35'ten fazla türde web sitesi ve blog oluşturmak için kullanabilirsiniz.
Tasarımcılar için Web Accessibi1ity Yönergeleri Mükemmel web erişilebilirliği tasarımda başlar.
Tasarım, herhangi bir web sitesinin en önemli bölümlerinden biridir. Bu en iyi uygulamaları takip etmeyi unutmayın. WordPress kullanacaksanız, Erişilebilirliğe Hazır Temaları da yükleyebilirsiniz.
1 Başlık Yapısını Erken Planlayın : Tüm içeriğin ve tasarımın mantıksal bir başlık yapısına uyduğundan emin olun.
2 Okuma Sırasını Düşünün : Okuma sırası görsel sıra ile aynı olmalıdır.
3 İyi Kontrast Sağlayın : Özellikle açık gri, turuncu ve sarı tonlarında dikkatli olun.
4 Mümkün Olduğunda Gerçek Metin Kullanın : Görüntülerden kaçının ve metin kullanın. Gerçek metin daha iyi büyür, daha hızlı yüklenir ve çevrilmesi daha kolaydır. Görsel stil eklemek için CSS kullanın.
5 BÜYÜK HARF Kullanımını İzleyin : Tüm büyük harflerin okunması zor olabilir ve ekran okuyucular tarafından yanlış okunabilir.
6 Yeterli Yazı Tipi Boyutu Kullanın : Yazı boyutu seçilen yazı tipine göre değişebilir, genellikle en az 10 punto olmuştur. Okunabilirliği sağlamak için web sitenizdeki yazı tipi boyutunun en az tarayıcı varsayılan boyutu olan 16 piksel (%100) olması gerekir.
Video: Web Erişilebilirlik Perspektifleri: Özelleştirilebilir Metin
7 Satır Uzunluğunu Hatırla : Çok uzun veya çok kısa yapmayın
8 Bağlantıların Tanınabilir Olduğundan Emin Olun : Sayfanın gövdesindeki bağlantıları, altı çizili veya yalnızca renkten başka bir şeyle ayırt edin.
Web Erişilebilirlik Perspektifleri hakkında daha fazla bilgi edinmek için aşağıdaki videoyu izleyin: Büyük Bağlantılar, Düğmeler ve Kontroller.
9 Tasarım Bağlantı Odak Göstergeleri : Klavye kullanıcılarının bir klavyeyle gezinirken bağlantıları görsel olarak tanımlayabilmelerini sağlayın.
10 Bir "Ana İçeriğe Atla" Bağlantısı Tasarlayın : Kullanıcıların gezinmeyi atlayabilmeleri için klavyeden erişilebilir bir bağlantı sayfanın üst kısmında olmalıdır.
11 Bağlantı Metninin Kendi Başına Anlamlı Olduğundan Emin Olun : “Burayı Tıklayın” veya “Daha Fazla” veya “Devam” gibi diğer belirsiz bağlantı metinlerinden kaçının.
12 Animasyonu, Videoyu ve Sesi Dikkatli Kullanın : Bir oynat/duraklat düğmesi sağlayın. Nöbetlere neden olabilecek yanıp sönen veya yanıp sönen içerikten kaçının. Tüm videolarınız ve ses içeriğiniz için altyazılar ve dökümler sağlayın.
13 İçeriği Tek Başına Renk İle Aktarmayın : Kullanıcılar genellikle sayfa renklerini ayırt edemez veya geçersiz kılabilir.
14 Erişilebilir Form Kontrolleri Tasarlayın : Form kontrollerinin açıklayıcı etiketlere, talimatlara ve doğrulama/hata mesajlarına sahip olduğundan emin olun.
15 Duyarlı Gezinme Menüleri : Gezinme menülerinizin tamamen duyarlı ve mobil uyumlu olduğundan emin olun. Gezinme menüsü öğelerini mantıklı ve tutarlı bir şekilde konumlandırın. Bunları klavye aracılığıyla erişilebilir hale getirin.
16 Bağlantılar ve Resimler İçin Alternatif Metin : Resimlerinizi her zaman web için optimize edin. Resim boyutunu küçültmek için resimlerinizi sıkıştırmak için WordPress resim optimizasyon eklentilerini veya tinypng gibi çevrimiçi hizmetleri kullanın.
Sitenizin daha hızlı yüklenmesine yardımcı olacaktır. Tüm resimler ve bağlantılar için alternatif metin sağlayın ve resimlerinizi doğru bir şekilde adlandırın.
17 Web Sitesini Duyarlı Hale Getirin : Kullanıcıların web sitenize mobil cihazlardan erişebildiğinden ve tüm içeriğinizi kolayca okuyabildiğinden emin olun. Web sitenizi CSS3 medya sorgularıyla duyarlı hale getirin veya web sitenizi duyarlı hale getirmek için bir WordPress eklentisi kullanın.
Web Erişilebilirlik Perspektifleri Video Serisi
W3C Web Erişilebilirlik Girişimi (WAI), erişilebilir web tasarımı hakkında 11 video yayınladı. Bu, her web tasarımcısı ve blog yazarı için erişilebilir web siteleri ve blog oluşturmayı ve daha iyi bir kullanıcı deneyimi oluşturmayı öğrenmek için çok izlenen bir oynatma listesidir.
Bu YouTube oynatma listesinde, aşağıdaki konular hakkında bilgi edinebilirsiniz.
- Video Altyazıları
- İyi Kontrastlı Renkler
- Büyük Bağlantılar, Düğmeler ve Kontroller
- Özelleştirilebilir Metin
- Klavye Uyumluluğu
- Düzeni ve Tasarımı Temizle
7 Bildirimler ve Geri Bildirim - Konuşma metni
- Anlaşılabilir İçerik
- Ses tanıma
- 10 Konunun/Videonun Derlenmesi
Erişilebilir Web Siteleri Oluşturma – WordPress Eklentileri ve Temaları
WordPress web sitelerinizi ve blogunuzdaki içeriği daha erişilebilir hale getirmenize yardımcı olan birçok ücretsiz eklenti ve tema mevcuttur.
Erişilebilirliğe Hazır WordPress Temaları:
WordPress geliştiricilerinin tüm Varsayılan WordPress temaları Erişilebilirliğe Hazırdır. Ayrıca WordPress tema dizininde çok sayıda ücretsiz Erişilebilirliğe Hazır Temalar bulabilirsiniz.
Web Erişilebilirlik Denetleyicisi WordPress Eklentileri
1. WP Erişilebilirlik , WordPress temalarındaki çeşitli yaygın erişilebilirlik sorunlarına yardımcı olan en popüler ücretsiz ve güncel eklentilerden biridir.
Aktif temanızın ihtiyaçlarına göre tüm özellikleri devre dışı bırakabilirsiniz. İleri düzey kullanıcılar için, stil sayfalarını değiştirmeye dayalı tüm işlevler, uygun stil sayfasını tema dizininize yerleştirerek kendi özel stilleriniz kullanılarak özelleştirilebilir.
2. WordPress için Erişilebilirlik Tema Kalıpları : Erişilebilirliğe hazır WordPress temaları oluşturmak için Github'da bir dizi ücretsiz kalıp mevcuttur.
Aşağıdaki Modeller ücretsiz olarak indirilebilir.
- ARIA yanıtına etiketi dahil etmek için JS Aria ile Yorum Formu
- Açılır Menüler, WordPress temanız için erişilebilir açılır menüler için ücretsiz bir kalıptır.
- Genesis Bağlantıyı Atla
- Menü klavyesi Ok Gezinme: Gezinme menülerine nasıl ok ekleneceğini öğrenmek için bu makaleyi okuyun.
- Daha Fazla Bağlantıyı Okuyun: Daha fazla oku bağlantısını nasıl özelleştireceğinizi ve WordPress Gönderi Alıntılarını Göster'i okuyun.
- Duyarlı Menü, WordPress temalarınıza ekleyebileceğiniz bir kalıptır.
- Bağlantıyı Atla
WordPress için Erişilebilirlik Tema Kalıpları, erişilebilirliğe hazır WordPress temaları oluşturmanıza yardımcı olur. Kodun tam bir tema olması amaçlanmamıştır, ancak alt dizinlerdeki her kalıp, temanızı daha erişilebilir hale getirmenize yardımcı olabilir.
3. Theme-a11y-Tester : Erişilebilirliğe hazır gereksinimler için WordPress temalarını test etmek için bir ortam.
A11y-Theme-Unit-Test : Bu, daha verimli erişilebilirlik testi için ayarlanmış WordPress Tema Birimi Testinin bir sürümüdür.
4. Duyarlı Menü Eklentisi , 120'den fazla özelleştirilebilir seçeneğe sahip, popüler, ücretsiz ve WordPress için son derece Özelleştirilebilir Duyarlı Menü Eklentisidir.
5. İletişim Formu 7: Erişilebilir Varsayılanlar , varsayılan İletişim Formu 7 formunu erişilebilir bir eşdeğerle değiştirmek için ücretsiz bir eklentidir ve bir dizi seçilebilir temel form sağlar.
6. Yerçekimi Formları için WCAG 2.0 form alanları, form alanlarını değiştirebilir ve formların WCAG 2.0 erişilebilirlik gereksinimlerini karşılaması için doğrulamayı iyileştirir.
7. Erişilebilir Video Kitaplığı , her video için altyazılar, transkriptler ve altyazılar dahil olmak üzere videoları yönetmek için ücretsiz bir WordPress eklentisidir.
Web Erişilebilirlik Denetleyicisi Araçları ve Tarayıcı Uzantıları
İşte Chrome için birkaç ücretsiz Erişilebilirlik testi
- Erişilebilirlik Geliştirici Araçları
A-Tester – WCAG 2.0 web erişilebilirlik aracı
WAVE Değerlendirme Aracı
balta
ChromeVox
Daha fazla kaynak
Erişilebilir web siteleri oluşturmak için daha fazla bilgi edinmek için birkaç harika kaynak.
WordPress ve erişilebilirlik hakkında daha fazla bilgi edinmek için WordPress erişilebilirlik blogunu ve WordPress erişilebilirlik el kitabını ziyaret edin.
Ayrıca Pagely blogunda Erişilebilir WordPress Web Siteleri Nasıl Oluşturulur başlıklı bir makale yazdım.
Renk Körlüğü ve Web Tasarımı, usability.gov'da harika bir makaledir.