Kayıt, Giriş ve Ödeme Formları için Otomatik Tamamlama

Tarayıcıya bir alanın ne için olduğunu söylemek

Bir kayıt, yardım veya fatura formu aynı birkaç şeyi tekrar tekrar ister: ad, adres, telefon, e-posta, kart bilgileri. Titremesi, bellek güçlüğü veya disleksisi olan biri için elle yazılan her alan hata yapma ya da vazgeçme noktasıdır. Tarayıcılar ve yardımcı araçlar bunları doldurabilir, bazıları alanın yanında tanıdık bir simge de gösterebilir; ama yalnızca alan ne için olduğunu söylerse.

WCAG 1.3.5 (AA seviyesi), kullanıcıyla ilgili bilgi toplayan her girdi alanının amacının, alan WCAG'ın girdi amaçları listesindeki bir amaca hizmet ediyorsa ve teknoloji destekliyorsa programatik olarak belirlenebilmesini ister. Web'de bu, değerleri sabit ve dilden bağımsız olan autocomplete özniteliğidir.

Hangi alanlar kapsamdadır?

• Kapsamda: kullanıcıyla ilgili bilgi toplayan ve listelenen bir amaca uyan alanlar; ad, kullanıcı adı, adres, telefon, e-posta, doğum günü ve ödeme kartı bilgileri gibi.
• Kapsam dışı: kullanıcıyla ilgili bilgi toplamayan alanlar; arama kutusu, ruhsat numarası veya işlem tutarı gibi.
• Başka bir kişinin bilgileri: değer, kullanıcının kendi verisini tanımlar. Çocuğunun adını giren bir veli, başka birinin bilgisini giriyordur.
• type ile aynı şey değildir: type="email" adresin kullanıcıya mı başkasına mı ait olduğunu söylemez; tek başına fazla geniştir.

Tarayıcının gerçekten otomatik doldurup doldurmaması uygunluğu belirlemez; önemli olan amacın erişilebilir olmasıdır. Her alan değerini korurken form için otomatik doldurma yine de kapatılabilir.

Okul kaydı, yardım ve fatura ödeme formları

Sakinlerin en sık doldurduğu formlar aynı zamanda en uzunlarıdır: okul bölgesi kaydı, yardım yenileme, fatura ödeme, kütüphane kartı başvurusu. Aynı kişisel bilgileri tekrarlarlar ve çoğu kez kullanması zor bir klavyeyle telefonda doldurulurlar. ABD Adalet Bakanlığı'nın (DOJ) yaygın engeller listesi erişilemeyen formları içerir; alan amaçlarını işaretlemek, otomatik doldurmaya veya simge ve daha açık etiket ekleyen araçlara güvenenler için formları kolaylaştırmanın düşük maliyetli bir yoludur. Formlarda yinelenen diğer sorunlar için yaygın engeller sayfasına bakın.

Web: kayıt, giriş ve ödeme için değerler

Veriyi adlandıran değeri, onu toplayan alanda kullanın.

<label for="ad">Veli veya vasinin adı</label>
<input id="ad" name="ad" type="text">
<label for="eposta">E-posta</label>
<input id="eposta" name="eposta" type="email">
<label for="pk">Posta kodu</label>
<input id="pk" name="pk" type="text">

<label for="ad">Veli veya vasinin adı</label>
<input id="ad" name="ad" type="text" autocomplete="given-name">
<label for="eposta">E-posta</label>
<input id="eposta" name="eposta" type="email" autocomplete="email">
<label for="pk">Posta kodu</label>
<input id="pk" name="pk" type="text" autocomplete="postal-code">

Giriş formlarının, parola yöneticilerine de yardım eden kendi değerleri vardır.

<label for="abone">Abone numarası veya e-posta</label>
<input id="abone" name="abone" type="text">
<label for="parola">Parola</label>
<input id="parola" name="parola" type="password">

<label for="abone">Abone numarası veya e-posta</label>
<input id="abone" name="abone" type="text" autocomplete="username">
<label for="parola">Parola</label>
<input id="parola" name="parola" type="password" autocomplete="current-password">

Ödeme bilgilerinin özel bir değer kümesi vardır.

<input name="sahip" aria-label="Kart üzerindeki ad">
<input name="kart" aria-label="Kart numarası" inputmode="numeric">
<input name="skt" aria-label="Son kullanma tarihi">

<input name="sahip" aria-label="Kart üzerindeki ad" autocomplete="cc-name">
<input name="kart" aria-label="Kart numarası" inputmode="numeric"
       autocomplete="cc-number">
<input name="skt" aria-label="Son kullanma tarihi" autocomplete="cc-exp">

Yerel uygulamalar: otomatik doldurma ipuçları

Yerel araç setleri aynı fikri içerik türleri veya otomatik doldurma ipuçları olarak sunar.

TextField("E-posta", text: $eposta)
    .keyboardType(.emailAddress)

TextField("E-posta", text: $eposta)
    .keyboardType(.emailAddress)
    .textContentType(.emailAddress)

OutlinedTextField(
    value = eposta,
    onValueChange = { eposta = it },
    label = { Text("E-posta") }
)

OutlinedTextField(
    value = eposta,
    onValueChange = { eposta = it },
    label = { Text("E-posta") },
    modifier = Modifier.semantics {
        contentType = ContentType.EmailAddress
    }
)

Nasıl kontrol edilir?

1. Formda kullanıcının kendi bilgisini toplayan tüm alanları listeleyin.
2. Her birini inceleyin ve autocomplete değerini okuyun. HTML belirtimindeki değer listesiyle karşılaştırın.
3. Yazım hatalarını, farklı bir amacı adlandıran değerleri ve değeri eksik alanları arayın.
4. Formu tarayıcının otomatik doldurması veya bir parola yöneticisiyle deneyin. Çalışan bir doldurma iyi bir işarettir, ama uygunluğu kanıtlamaz.

Otomatik araçlar değerleri doğrulayabilir ve eksikleri işaretleyebilir; bir alanın gerçekten kullanıcının verisini toplayıp toplamadığı insanın vereceği bir karardır.

Formlarda görülen hatalar

• autocomplete="fname" gibi uydurma değerler.
• Amacını belirtmesi gereken alanlarda autocomplete="off" kullanmak.
• Başkasının e-postası için olan alana email gibi bir kullanıcı değeri koymak.
• Kart numarasını etiketsiz birkaç kutuya bölmek; hiçbir değer uygulanamaz.
• div olarak görünen ve hiçbir amacı açığa çıkarmayan özel denetim yapmak.

Şu durumda yayına alın

• Kullanıcıyla ilgili her alan eşleşen autocomplete değerini taşıyor.
• Kullanıcıyla ilgili olmayan alanlar hiçbir değer taşımıyor.
• Özel denetimler amacı yerel girdiler kadar iyi açığa çıkarıyor.

Kaynaklar

• Understanding SC 1.3.5: Identify Input Purpose (W3C), İngilizce, yeni sekmede açılır
• H98: Using HTML autocomplete attributes (W3C), İngilizce, yeni sekmede açılır
• 28 CFR Part 35, Subpart H: Accessibility of Web Information and Services (eCFR), İngilizce, yeni sekmede açılır

Standart sürümü: WCAG 2.1 (W3C Tavsiye Kararı, 5 Haziran 2018); Title II web kuralında adı geçen sürüm. Bu sayfa bilgilendirme amaçlıdır ve hukuki tavsiye niteliği taşımaz. Bağlayıcı metin için ADA yasasının ve yönetmeliklerinin resmî metinlerini esas alın ve size nasıl uygulandığını bir avukata sorun.