Erişilebilirlik Testi ile Web Sitenizi Nasıl Değerlendirirsiniz (Ve İyileştirirsiniz)

Pek çok insan, web'de gezinmeyi doğal karşılıyor. Tabii ki, herhangi bir engeliniz yoksa, modern web sitelerinde gezinmek basit bir iştir. Sorun şu ki, herkes web'i aynı şekilde deneyimlemiyor. Daha da önemlisi, bazı engeller bir siteye göz atmayı düşündüğünüzden daha karmaşık hale getirir.

Mümkün olduğunca çok kişinin web sitenizden faydalanmasını istiyorsanız, erişilebilirlik testi bir zorunluluktur. Bu makalede, erişilebilirlik testinin neden önemli olduğu hakkında biraz daha konuşacağız. Ardından, web sitenizi nasıl değerlendireceğinizi dört adımda size öğreteceğiz. Hadi çalışalım!

Erişilebilirlik Testi Neden Önemlidir?

Erişilebilirlik testi, web sitenizin engelli kişiler tarafından kullanılabilir olduğundan emin olmak için değerlendirme sürecidir. Örneğin, renk körü bir kişinin web sitenizde gezinmesini zorlaştıran bir renk paleti kullanıyorsanız, uygun erişilebilirlik testi bunu tespit etmelidir.

Erişilebilirlik testinin birincil amacı, mümkün olduğunca çok kişinin web sitenizden yararlanabilmesini sağlamaktır. Bununla birlikte, bundan faydalandığınız için tamamen özgecil bir arayış değildir. İşte nasıl:

• Başka türlü ulaşamayacağınız kullanıcılara ulaşmanızı sağlar. Web siteniz engelli kullanıcılar için ne kadar iyi optimize edilmişse, o kadar fazla kişiye ulaşabilirsiniz. Bu kitleler, nüfusun düşük bir yüzdesini oluştursalar bile toplanabilir.
• Profesyonellik gösterir. Erişilebilirlik söz konusu olduğunda pek çok insan ekstra yol kat etmez. Bu, yaptığınız iyileştirmelerin daha iyi bir deneyim sunmaya kararlı olduğunuzu gösterdiği anlamına gelir.

Çoğu durumda, herkes için erişilebilir bir web sitesi oluşturmak mümkün değildir. Ancak, web sitenizin tasarımına birkaç basit ayarlamalar yaparak birçok insan deneyimini geliştirmek mümkündür.

Ayrıntılara girmeden önce, World Wide Web Consortium (W3C) tarafından bir araya getirilen Web İçeriği Erişilebilirlik Yönergelerine (WCAG) bir göz atmanızı öneririz. W3C'ye aşina değilseniz, daha iyi deneyimler için web standartları geliştirmeye çalışan uluslararası bir topluluktur.

Adil olmak gerekirse, WCAG biraz kuru bir okuma olabilir, ancak biraz zaman harcamak erişilebilirlik standartları hakkında daha fazla bilgi edinmenin en iyi yoludur. Bir sonraki bölümde, web sitenizin kullanılabilirliğini test etmek ve iyileştirmek için birkaç somut adımın üzerinden geçeceğiz ve neden gerekli olduklarını açıklayacağız.

Erişilebilirlik Testi ile Web Sitenizi Nasıl Değerlendirirsiniz (Ve İyileştirirsiniz) (4 Adımda)

Web sitenizin WCAG ile uyumlu olup olmadığını hızlı bir şekilde test etmek için kullanabileceğiniz birçok çevrimiçi araç vardır. Ancak, bu tür araçlar, yalnızca kapsamlı testler yoluyla öğrenebileceğiniz birçok şeyi kaçırır. Bunlar mükemmel başlangıç ​​noktalarıdır, ancak bunları kullanmak uygun erişilebilirlik testi anlamına gelmez. Bunu akılda tutarak, ayrıntılara girelim.

1. Adım: Web Sitenizi Renk Görme Bozukluğuyla İlgili Sorunlar İçin Test Edin

Nüfusun bir dereceye kadar önemli bir kısmı, fiziksel sorunlar nedeniyle renkleri ayırt etmekte zorlanıyor. Bu engellilik renk körlüğü olarak bilinir ve erkeklerde daha sık görülür.

Tahmin edebileceğiniz gibi, renk körlüğü bazı durumlarda bir web sitesinde gezinmeyi zorlaştırabilir. Örneğin, insanlar genellikle bir sayfadaki temel öğeleri vurgulamak için web tasarımında kontrast kullanır. Renk körlüğü olan biri, kullandığınız renklere bağlı olarak pek bir fark görmeyebilir. Bazı aşırı durumlarda, insanlar nesneleri yalnızca 'tam tek renklilik' olarak adlandırılan gri tonlarında algılayabilirler.

Doğal olarak, tam tek renklilik etrafında tasarım yapmak neredeyse imkansızdır. Yapabileceğiniz şey, web sitenizi optimize etmektir, böylece kırmızı ve yeşili, ardından mavi ve sarıyı hedefleyen en yaygın renk körlüğü biçimleri için erişilebilir olur. İlk adımınız, web sitenizi renk körü bir kişinin göreceği şekilde oluşturmanıza olanak tanıyan Toptal Renk Körlüğü Filtresi gibi bir araç kullanmak olmalıdır:

Aracı kullanmak için, test etmek istediğiniz URL'yi URL yazın kutusuna yapıştırmanız yeterlidir. ardından sağdaki menüden bir filtre seçin. Bu, üç farklı renk körlüğü türü için seçenekler ve bir hepsini yakalama seçeneği içerir:

Mümkün olan en iyi sonuçları elde etmek için, test ettiğiniz sayfayı her bir filtreyi ayrı ayrı kullanarak oluşturmak isteyeceksiniz. Ardından, belirli bir renk körlüğü biçimine sahip kullanıcılar için sayfanızın öğelerinden herhangi birinin daha zor olup olmadığını kontrol edin. Yeniden işlemeniz gereken öğeler olduğunu fark ederseniz, bunları daha erişilebilir hale getirmenin anahtarı, genellikle doğru renkleri seçmeye bağlı olan kontrastlarını artırmaktır.

2. Adım: Genel Görme Bozukluğu Olan Kullanıcıları Etkileyen Sorunları Kontrol Edin

Renklerle ilgisi olmayan pek çok görme engeli vardır. Örneğin uzağı görememe, uzaktaki nesneleri görmede zorluklara neden olarak bulanık görünmelerine neden olur. Katarakt ise, buzlu bir pencereden bakıyormuşsunuz gibi görüşünüzü bulanıklaştırabilir.

Öğelere mesafelerine göre odaklanamıyorsanız, bir web sitesinin tasarımını bunu dikkate alacak şekilde optimize edebilirsiniz (makul dahilinde). Öte yandan, görüşünüzü engelleyen bir rahatsızlığınız varsa, bununla baş etmeniz daha zordur.

Ancak, bir web sitesini ileri görüşlülükten muzdaripmiş gibi deneyimlemenin nasıl bir şey olduğunu simüle etmek için kullanabileceğiniz pek çok araç yoktur. Bizim favorimiz, gördüğünüz her sayfaya filtreler yerleştirmenize ve istediğiniz kadar ince ayar yapmanıza olanak tanıyan NoCoffee adlı bir Chrome uzantısıdır:

Kötü haber şu ki, diğer tarayıcılar için NoCoffee kadar işlevsellik sunan başka bir araç yok. Ancak, Google Chrome tüm büyük platformlarda kullanılabilir ve Geliştirici Araçları her zaman kullanışlıdır.

Uzantıyı yükledikten sonra menünüzdeki simgeye tıklayabilir, ardından Bulanıklaştırma filtresini etkinleştirebilirsiniz. Bu sayede ileri görüşlü kullanıcıların sitenizi ziyaret ettiklerinde ne gördüklerini pratik olarak deneyimleyebileceksiniz. Çoğu durumda, deneyimlerini geliştirmek için yapabileceğiniz yalnızca iki şey vardır:

1. Birinci adımda tartıştığımız gibi kontrastı daha iyi kullanın.
2. Yazı tipi boyutunu artırın, böylece görme engelli kişiler için bile metninizin okunması daha kolay olur.

Doğal olarak, metin boyutu söz konusu olduğunda, web sitenizin tasarımını olumsuz etkilemeden önce gidebileceğiniz bir adım var. Örneğin, bu ekran görüntüsünde, blog gönderilerimizin başlıklarını görebilir, ancak özetlerini göremezsiniz:

Biz bu metin boyutlarını artırabilir, ancak bir sınırı ve azalan getiriler var. Bu, metin tabanlı sorunları kapsarken, bize bir sonraki adıma geçmemizi sağlayan görüntüler kalıyor.

Adım #3: Tanımlayıcı 'Alt' Ekleyin Görme Engelli Kullanıcılar İçin Resimlerinize İlişkin Nitelikler

alt nitelikler – veya 'etiketler' – bir görüntünün içeriğini tanımlayan öğelerdir. Arama motorları, bir görüntünün ne hakkında olduğunu anlamak ve onu çevreleyen içeriği daha iyi anlamak için bilgileri kullanabilir.

Daha da önemlisi, alt metin, görme engelli kullanıcıların içeriğinizdeki resimlerin ne olduğunu anlamalarını sağlar. Bu tür kullanıcılar için özel olarak tasarlanmış birkaç tarayıcı vardır ve çoğu durumda, insanların gözleri yerine kulaklarına güvenebilmeleri için materyalleri yüksek sesle okurlar.

Kısacası, gönderilerinize ve sayfalarınıza ekleyeceğiniz herhangi bir görsel, açıklayıcı alt etiketleri içermelidir. Örneğin bu çiçeği alın:

Aceleniz varsa, sadece "bir çiçek" yazabilirsiniz. görüntünün alt etiketi olarak. Ancak, “Tarla ortasında kırmızı bir çiçek” gibi bir seçenekle gitmek çok daha iyi olur. Tabii ki, fazla açıklayıcı olmak gibi bir şey var ve kısa bir alt etiketinin yeterli olacağı durumlar var. Ancak, genel olarak konuşursak, daha uzun açıklamalar görme engelli kullanıcılar için deneyimi iyileştirecektir.

Bildiğiniz gibi WordPress, görselinizin alt etiketlerini kolayca değiştirmenizi sağlar. Medya kitaplığınızdan veya bir gönderi veya sayfa içinden bir resim seçin ve Düzenle düğmesini tıklayın. Bir sonraki ekranda Alternatif Metin alanını bulun ve açıklamanızı yazın:

Şimdi değişiklikleri kaydedin ve hazırsınız. Yine de unutmayın – bu, web sitenizdeki her resim için geçmeniz gereken bir süreçtir. Çok iş gibi görünebilir, ancak zamanla ikinci doğa haline gelecektir.

4. Adım: Videonuzun Altyazılarını İnceleyin

Şimdiye kadar tamamen görsel engellere odaklandık, çünkü çoğu web sitesi tabiri caizse gözlerden tüketiliyor. Ancak günümüzde sitelerin bazı sayfalarında video içeriği kullanması yaygın ve bu da işitsel engellerle uğraşmak zorunda kalma sorununu gündeme getiriyor.

Videoyu görme bozukluğu olan kişiler için optimize etmek çoğu durumda sizin elinizde değildir. Ancak, yapabileceğiniz şey, sesinizin anlaşılmasının kolay olmasını sağlamaktır. Bazı kullanıcılarınız işitme güçlüğü çekiyor olabilir, bu durumda altyazılara başvurmanız gerekir.

Videolarınıza altyazı eklemek, işitme engellilerin içeriğinizden en iyi şekilde yararlanmalarını sağlamanın en etkili yoludur. Ancak, kısa videolara bile tam altyazı koymak çok fazla iş olabilir. Bu yapamayacağınız bir şeyse YouTube'un altyazı aracı gibi özellikleri her zaman deneyebilirsiniz:

Tabii ki, herhangi bir video altyazı özelliğine baktıysanız. teknolojinin mükemmel olmadığını anlayacaksınız. Ancak, alternatifte altyazı yoksa bu geçerli bir seçenektir. Videolarınızı YouTube'a yüklerseniz, WordPress, bağlantılarını gönderilerinizin ve sayfalarınızın hemen hemen her yerine yapıştırarak bunları web sitenize yerleştirmenize olanak tanır:

Bu şekilde, kullanıcılarınız gerekirse altyazıyı açmayı seçebilir. Ancak, içeriğinizin çoğu video etrafında dönüyorsa, özel altyazı seçeneklerini araştırmaya başlamanın akıllıca olacağını unutmayın. Bu şekilde içeriğinizin doğru bir şekilde temsil edilmesini ve işitme engelli kullanıcıların içeriğin keyfini çıkarmasını sağlarsınız.

Çözüm

Erişilebilirlik, pek çok insanın web sitesi tasarımı üzerinde çalışırken göz önünde bulundurduğu bir şey değildir. Ancak, kullanıcılarınız için en uygun deneyimi sağlamak istiyorsanız bu dikkate alınması gereken önemli bir faktördür. Ayrıca, web sitenizin kullanımını daha kolay hale getirmek yalnızca engelli kullanıcılara değil, tüm hedef kitlenize fayda sağlayacaktır.

Erişilebilirlik testine dalmanın en etkili yolu, neyi amaçlamanız gerektiğine dair bir fikriniz olması için WCAG'ı kontrol etmektir. Ardından, karşılaşabileceğiniz birincil erişilebilirlik sorunlarını çözmek için şu dört temel adımı izleyin:

1. Renk görme bozukluğu ile ilgili sorunlar için web sitenizi test edin.
2. Genel görme bozukluğu olan kullanıcıları etkileyebilecek sorunları kontrol edin.
3. Resimlerinize açıklayıcı alt nitelikler ekleyin.
4. Videonuzun altyazılarını inceleyin.

Web sitenizi nasıl daha erişilebilir hale getirebileceğiniz hakkında sorularınız mı var? Aşağıdaki yorumlar bölümünde onlar hakkında konuşalım!

E.Druzhinina / Shutterstock.com'dan makale resmi küçük resmi.