Herkes bir noktada formlarla uğraşmak zorunda kalmıştır. Geçmişte daha çok kağıt üzerindeydi. Günümüzde, bir web sitesi ile kullanıcı etkileşimi için kullanıldıkları için giderek daha fazla dijital formlar haline geliyorlar. İster çevrimiçi iletişim kurarken ister bir ürün sipariş ederken olsun, bunları her yerde bulabilirsiniz. Örneğin Google ile yapılan internet aramaları da bundan etkilenmektedir. Bu formları doldurmak, fiziksel veya bilişsel engelli kişilerin yanı sıra görme engelli kişiler için de zordur. Herkesin kamusal yaşama katılabilmesi için bu formların erişilebilir olacak şekilde tasarlanması gerekmektedir. Peki ama erişilebilir form öğelerini gerçekte nasıl oluşturursunuz?
Bunun için çeşitli teknikler vardır. Ancak, teknikleri öğrenmeden önce form öğelerini tanımanız gerekir. Bunlar farklı türlerde kategorize edilebilir. Diğerlerinin yanı sıra aşağıdaki türler de vardır
- Tek satırlı giriş alanları
- çok satırlı giriş alanları
- Seçim listeleri
- Radyo düğmeleri
- Onay Kutuları
- Gönderme/iptal etme düğmeleri
Form alanlarının etiketlenmesi
Formlarda erişilebilirliği sağlamak için çeşitli kontrol unsurları etiketlenmelidir. Bu etiketler, yardımcı teknolojilerin kontrollerin işlevlerini tanımasını ve bunları kullanıcıya aktarmasını sağlar. Etiketlerin kontrollerle açık bir şekilde bağlantılı olması önemlidir, aksi takdirde ekran okuyucular öğelerle bağlantı kuramayacaktır. Sonuç olarak, kullanıcılar formu anlamakta zorluk çekecektir. Hangi alanlara hangi bilgilerin girilmesi gerektiğini anlayamazlar. Sonuç olarak, formu doğru bir şekilde dolduramazlar ve sıklıkla hata yaparlar. Ancak, açıklamaların hepsi aynı şekilde etiketlenmemiştir. Belirleyici faktör, bunların herkes tarafından görülebilmesi gerekip gerekmediğidir. Bu nedenle HTML programlama dilinde etiket öğesi ile aria nitelikleri arasında bir ayrım yapılır. Etiket öğesi giriş alanları, seçim listeleri, radyo düğmeleri ve onay kutuları için kullanılır ve buna göre konumlandırılmalıdır. Giriş alanları ve seçim listeleri için etiket, kontrol elemanlarından önce yerleştirilir. Ancak radyo düğmeleri ve onay kutuları için kontrol elemanından sonra yerleştirilir. Etiketlerin de ilgili elemana bağlanabilmesi için for niteliği eklenmelidir.
aria niteliği HTML'de düğmeler için kullanılır. Düğmeler, örneğin bir formdaki gönder veya iptal işlevini temsil edebilir. aria nitelikleri ile, ilgili öğelerin açıklamaları yalnızca yardımcı teknolojiler için tanınabilir. Bu nedenle, yalnızca ekran okuyucu tarafından görülebilmesi gereken giriş alanları için de kullanılabilirler. İnternette erişilebilirliği geliştirmek için kullanılan birçok aria niteliği vardır. Ancak bunlar türleri ve işlevleri bakımından farklılık gösterir. Sözde aria-label, bir öğeyi etiketlemek için kullanılır. Elbette, aynı etiketi birkaç öğe için kullanmak da mümkündür. Bu, bir aria-labelledby ile mümkün kılınır.
Tek ve çok satırlı giriş alanları
Giriş alanları formlarda en sık kullanılan öğeler arasındadır. Tek satırlı veya çok satırlı olabilirler. Tek satırlı alanlar kısa sorgular için kullanılır, örneğin bir kişinin adı, bir e-posta adresi, bir sokak veya bir şehir için.
HTML'de input etiketi ve type niteliği ile oluşturulurlar.
Ek nitelikler de eklenebilir, örneğin çizgi uzunluğunu tanımlamak için.
Çok satırlı alanlar genellikle metin mesajları gibi daha büyük metin alanları için kullanılır. Bunlar daha sonra textarea etiketi ile oluşturulur. Burada da geliştirici satır sayısını ve satır uzunluğunu belirleyebilir. Ancak bu alanları erişilebilir kılmak için label etiketinin eklenmesi gerekir. Ancak, bunlar açıkça atanmamışsa etiket ve öğeler arasında bir bağlantı oluşturmak mümkün değildir. Bu durumda bunlar for niteliği ve id niteliği aracılığıyla birbirlerine bağlanmalıdır. Aşağıdaki HTML örneğinde, bu tür girdi alanlarında basit etiketler uygulanmıştır.
<label for=“vorname“>Ihr Vorname: </label>
<input type“text“ name=“vorname“ id=“vorname“ />
<br />
<label for=“nachricht“>Ihre Nachricht: </label>
<textarea name=“nachricht“ id=“nachricht“> </textarea>
Burada ilk olarak "text" türünde ilk ad için tek satırlık bir giriş alanı oluşturulur. "Adınız:" etiketi, label elemanı tarafından herkes tarafından görülebilir hale getirilir. Bu, girdi alanından önce çıktılandığı için girdi öğesinden önce yerleştirilir. Bu alanlar label etiketindeki for niteliği ve input elementindeki id niteliği ile birbirlerine bağlanırlar. Burada her iki içeriğin de aynı olması önemlidir, aksi takdirde bağlanamazlar. name niteliği bu alan için bir tanımlayıcı görevi görür ve verilerin bir sunucu sayfasına aktarılması için gereklidir.
Ardından, "textarea" etiketi kullanılarak çok satırlı bir giriş alanı oluşturulur. Ardından label öğesi "Mesajınız:" başlığını görüntüler. Burada da aynı metin içeriğine sahip iki alan for ve id nitelikleri kullanılarak birbirine bağlanır.
Genel bilgi
Genel olarak, formlar açık ve net olmalıdır. Tahmin edilebilirlik de çok faydalıdır. Bu, kullanıcıların kendilerinden ne istendiğini hızlı bir şekilde anlamalarını sağlar. Açık ve mantıklı bir yapı da çok önemlidir. İlgili içerik unsurları birlikte gruplandırılabilir. Mantıksal olarak ayrılmış birimler görsel olarak da ayrılabilir. Bu oryantasyonu kolaylaştırır. Ayrıca renklerle de birbirlerinden ayrılabilirler. Minimum 4,5:1 kontrastın korunması önemlidir.
Klavye çalışabilirliği
Form alanlarının erişilebilir tasarımı için en önemli özelliklerden biri klavye üzerinden çalıştırılabilmeleridir. Engelleri nedeniyle fare kullanamayan insanlar var. Bu durum, formların klavye kullanılarak da yönlendirilebilecek şekilde tasarlanmasını daha da önemli hale getirmektedir. Etiket öğelerinin ve aria niteliklerinin kullanılması formların anlaşılmasını ve kullanılmasını kolaylaştırır. Klavye üzerinden kullanımı kolaylaştırmanın bir diğer yolu da klavye kısayollarını kullanmaktır. Form elemanlarına burada tuş kombinasyonları atanabilir. Bu, belirli alanlara daha hızlı ulaşmaya veya işlevleri daha hızlı çalıştırmaya yardımcı olabilir. HTML'de accesskey niteliği bu amaçla kullanılır. Bu nitelik, kullanılacağı elemana eklenir. Daha sonra klavye komutu için kullanılan tuş basitçe buraya atanır. Örneğin, bir alana veya düğmeye "n" tuşunu atarsanız, Windows'ta klavye kısayolu (Alt + n) kullanılarak çalıştırılabilir.
Ancak, bu kısayolun tarayıcıda başka bir komut için zaten kullanılmadığından emin olmak önemlidir.
Minimuma indirgeme
Engelli bireylere gereksiz bir yük getirmemek için tüm sürecin temel unsurlara indirgenmesi de tavsiye edilir. Bu nedenle, yalnızca kesinlikle gerekli olan veriler talep edilmelidir. Mevcut veriler talep edilmemelidir. Buna ek olarak, form alanlarının görünürlüğü duruma göre uyarlanabilir. İsteğe bağlı giriş alanlarının veya koşullarla bağlantılı alanların görünür olması gerekmez. Gerekli olmaları halinde görüntülenebilirler. Örneğin, daha önce çocuk olmadığını seçtiyseniz çocukların yaşını sormanın bir anlamı yoktur.
Yardım ve hata mesajları
Giriş yardımı da sağlanmalıdır. Bu, bir diyalog penceresi veya bir araç ipucu şeklinde olabilir. Bunlar girişi daha ayrıntılı olarak açıklamak için kullanılabilir. Başka bir seçenek de ayrı bir yardım sayfasına bağlantı vermek olabilir. Bu başarı oranını büyük ölçüde artıracaktır. Yine de hatalar olabilir. Bu durumda anlamlı hata mesajları önemlidir. Örneğin, oturum açarken parola yanlış girilmişse, "Kullanıcı adı veya parola yanlış" mesajı görünmemelidir. Hatayı filtrelemek daha iyidir. Burada doğru olan şu olacaktır: "Girdiğiniz parola yanlış. Lütfen doğru şifreyi girin".
Farklı hata türleri vardır. İlk olarak, format hatası. Burada şifre yanlış formatta girilmiştir. Örneğin, rakamlar yerine harfler girilir. Değer hataları da oluşabilir. Bu, geçerli bir biçime rağmen yanlış bir değer girilirse meydana gelebilir. Buna örnek olarak tarihin bir günü için 34 değerinin girilmesi verilebilir. Bu durumda mesaj şöyle olacaktır: "Mart ayının 31 günü vardır. Lütfen günü tekrar girin".
Bir başka hata türü de geçersiz girişlerdir. Burada, geliştirici geçersiz olan değerleri belirtir. Son olarak, zorunlu alanlar için hiçbir giriş yapılmamışsa hata türü vardır. Bu, örneğin e-posta adresi sorgusu zorunlu bir alansa ve giriş unutulmuşsa ortaya çıkar. Ancak, bu durum genellikle genel hüküm ve koşullarda da meydana gelir. Birçok web sitesinde, bu beyanı kabul etmeden devam edemezsiniz.
Zorunlu alanlar
Formlar genellikle zorunlu alanlar içerir. Bunlar bu şekilde etiketlenmelidir. Zorunlu bir alanı belirtmek için sıklıkla kullanılan bir sembol, form alanının yanında görüntülenen bir "*" işaretidir. Ancak bu durumda, formun başında yıldızla işaretlenmiş alanların zorunlu olduğu belirtilmelidir. Diğer bir seçenek de bu zorunlu alanları farklı bir renk veya tonda görüntülemektir. Ancak bunlar herkes için erişilebilir değildir. Ekran okuyucu kullanıcılarının da bunları tanıyabilmesi için required veya aria-required niteliği de kullanılmalıdır. Bu, ekran okuyucuya bunun zorunlu bir alan olduğunu bildirir.
Yer tutucu
Formları daha kolay anlaşılır ve daha kullanıcı dostu hale getirmenin bir yolu da form alanlarında yer tutucular kullanmaktır. Yer tutucular, kullanıcıya ne tür bilgilerin girilmesi gerektiğini belirtmek için bir form alanı içinde görüntülenen geçici metinlerdir. Bu metinler form alanına tıklandığında veya odaklanıldığında kaybolur ve form alanının gerçek içeriği ile değiştirilebilir. Yer tutucular, yer tutucu niteliği kullanılarak bir form alanının HTML giriş öğesine kolayca eklenebilir.
Girişleri kaydet
Tüm kullanıcılar girişlerini kaydetme seçeneğine sahip olmalıdır. Uzun formlarda her zaman sorunlar yaşanır. Veri kaybını önlemek için bunlar kaydedilebilir. Bu amaçla, mevcut durumu kaydeden bir düğme uygulanabilir. Bu, karmaşık formların doldurulmasını kolaylaştırır. Bu aynı zamanda eksik girişlerin daha sonraki bir tarihte eklenebilmesi avantajına da sahiptir. Bu girişlerin tekrarlanması bazı kullanıcıların formu tamamlamamasına neden olur. Bu durum hem web sitesi operatörü hem de kullanıcı için can sıkıcı olabilir.
Kimlik doğrulama ve zaman sınırı
Kimlik doğrulama internette güvenliği artırır. Ancak, aynı zamanda zaman zaman ortaya çıkan engellerden biridir. Bunlar genellikle oturum açmanın gerekli olduğu web sitelerinde ortaya çıkar. Ancak bunların herkes tarafından erişilebilir olmasını sağlamak için formlar engelsiz olacak şekilde tasarlanmalıdır. Birçok durumda, kimlik doğrulama prosedürleri zaman sınırlıdır. Bu durumda oturum açmak için çok az zamanınız olur. Bu süre genellikle sadece 30 ya da 60 saniyedir. Engelli birçok kişi için bu süre oturum açmak için yeterli değildir. Bu nedenle oturum açmak için bir zaman sınırı belirlememek önemlidir.
Captcha'lar başka bir sorun teşkil etmektedir. Kullanıcıyı bir bilgisayar olarak değil, bir kişi olarak tanımlamak için kullanılırlar. Burada, kullanıcıdan çarpıtılmış bir görüntüyü tanımlaması ve sonucu bir form alanına girmesi istenir. Ancak, örneğin bir arabayı gösteren tüm görüntülere tıklamak genellikle gereklidir. Ancak bunlar her zaman erişilebilir değildir. Kör veya görme engelli kişiler bu görüntüleri tanıyamaz. Bu engeli aşmak için sesli bir seçenek sunulmalıdır.
Özetlemek gerekirse, form alanlarının erişilebilir tasarımının erişilebilir bir dijital ortama yönelik önemli bir adım olduğu söylenebilir. Doğru etiketleme, açık ve yapılandırılmış bir düzen, klavye üzerinden işlem ve ilgili hata mesajlarının kullanılması, engelli kişilerin de formları bağımsız olarak doldurabilme olasılığını artırır.
