WCAG Başarı Kriterleri · Level AA

WCAG 1.3.5: Girdi Amacını Belirleme

WCAG 1.3.5, kişisel bilgi toplayan her bir giriş alanının amacının programatik olarak belirlenebilmesini, böylece tarayıcıların ve yardımcı teknolojilerin alanları otomatik olarak doldurmasını, etiketlemesini veya uyarlamasını mümkün kılmayı gerektirir. Bu, manuel girişi azaltmaktan fayda sağlayan bilişsel engelli ve motor bozukluğu olan kullanıcılar için hayati önem taşır.

Bu Kuralın Anlamı

WCAG 1.3.5 — Girdi Amacını Belirleme, WCAG 2.1’de tanıtılan ve WCAG 2.2’ye taşınan Seviye AA ölçütüdür. Kullanıcı hakkında bilgi toplayan herhangi bir <input>, <select> veya <textarea> öğesinin amacının, tarayıcıların ve yardımcı teknolojilerin bu amacı otomatik olarak tanıyıp buna göre hareket edebilmesi için programatik olarak iletilmesini gerektirir.

Bu ölçütü karşılamanın mekanizması, HTML spesifikasyonunda tanımlanan resmi listeden doğru jeton değeri ile birlikte kullanılan autocomplete özniteliğidir. Bir alan kullanıcının adını, e-posta adresini, telefon numarasını, posta adresini, kredi kartı numarasını veya benzeri kişisel verileri topladığında, autocomplete özniteliği bu alanın amacını doğru şekilde tanımlayan bir değer taşımalıdır — örneğin, ad alanı için autocomplete="given-name" veya e-posta alanı için autocomplete="email" gibi.

Bu ölçüt, özellikle kullanıcının kendisi hakkında bilgi toplayan girdilere uygulanır. Kullanıcının başka biri hakkında veri girdiği alanlara (örneğin, kullanıcının başka bir kişi adına rezervasyon yaptığı bir seyahat rezervasyon formunda yolcunun adının istendiği alanlar) uygulanmaz; ayrıca, otomatik doldurmanın güvenlik riski oluşturacağı alanlara da uygulanmaz — tek kullanımlık parolalar veya CAPTCHA tarzı doğrulamalar gibi; bu alanlar meşru olarak autocomplete="off" veya autocomplete="one-time-code" kullanabilir.

Başarılı sayılmak için: (1) kapsam içindeki her girdi alanının bir autocomplete özniteliği taşıması; ve (2) bu özniteliğin değerinin HTML otomatik doldurma spesifikasyonunda tanınan geçerli bir jeton olması gerekir — rastgele bir dize değil, anlamlı bir değerin gerektiği yerde boş bir değer değil ve yanlış yazılmış bir jeton değil. Kapsam içindeki bir girdinin autocomplete özniteliği olmaması, gerekçe olmaksızın autocomplete="off" kullanması veya autocomplete="firstname" (doğru jeton given-name’dir) ya da autocomplete="phone" (doğru jeton tel’dir) gibi geçersiz bir jeton kullanması durumunda başarısızlık oluşur.

Geçerli otomatik doldurma jetonlarının tam listesi WHATWG HTML Living Standard tarafından tutulur ve adlar (given-name, family-name, additional-name), adresler (street-address, address-line1, postal-code, country-name), iletişim bilgileri (email, tel, tel-national), kimlik bilgileri (username, current-password, new-password), ödeme detayları (cc-name, cc-number, cc-exp, cc-csc) ve daha fazlası için değerler içerir. Jetonlar ayrıca tek bir sayfada birden fazla adres grubunu yönetmek için bölüm tanımlayıcıları (ör. section-billing) ve gönderim veya faturalama anahtar sözcükleri ile öneklenebilir.

Neden Önemlidir

Bu ölçüt, başta disleksi, hafıza bozuklukları, dikkat eksikliği durumları ve öğrenme güçlükleri olan kişiler dahil olmak üzere bilişsel engelliliği olan kullanıcıların yararına vardır. Bu kullanıcılar için, ad, soyad, sokak adresi, şehir, posta kodu, telefon ve ödeme detayları için ayrı alanları olan karmaşık bir ödeme formunu doğru şekilde doldurmak önemli bir bilişsel yük olabilir. autocomplete jetonları doğru olduğunda, tarayıcılar tek bir etkileşimle alanları kullanıcının kayıtlı profilinden önceden doldurabilir, bu da sürtünmeyi ve hata riskini dramatik biçimde azaltır.

Motor engelliliği olan kullanıcılar — sınırlı el fonksiyonuna sahip olup anahtarlı erişim, göz izleme yazılımı veya nefesle çalışan cihazlar kullanan kişiler dahil — aynı derecede fayda görür. Bu kullanıcılar için yazı yazmak yavaş, zahmetli ve bazen acı vericidir. Güvenilir şekilde çalışan otomatik doldurma, on dakikalık bir eziyeti neredeyse anlık bir göreve dönüştürebilir. Dünya Sağlık Örgütü’ne göre, dünya genelinde yaklaşık 1,3 milyar insan önemli bir engellilik biçimiyle yaşamaktadır ve ince el kontrolünü etkileyen motor engellilikler en yaygın olanlar arasındadır.

Otomatik doldurmanın ötesinde, doğru autocomplete jetonları tarayıcıların ve yardımcı teknolojilerin özel simgeler, etiketler veya artırılmış girdi arayüzleri sunmasına olanak tanır — örneğin, bir mobil cihazda tel alanı için otomatik olarak bir telefon tuş takımının gösterilmesi veya cc-number alanı için bir kredi kartı görselinin gösterilmesi gibi. Hafıza bozukluğu olan kullanıcılar için kritik erişilebilirlik araçları olan parola yöneticileri de kimlik bilgisi alanlarını doğru şekilde tanımlayıp doldurmak için bu jetonlara güvenir.

Gerçek bir senaryoyu düşünün: Serebral palsili bir kullanıcı, devlet yardımı başvurusu dolduruyor. Formda ad, adres, ulusal kimlik ve iletişim detaylarını kapsayan on iki alan var. Doğru autocomplete değerleri olmadan her alanın elle yazılması gerekir. Yanlış yazılmış tek bir jeton — örneğin, autocomplete="family-name" yerine autocomplete="surname" kullanılması — tarayıcının alanı tanımasını engellemeye yeter ve kullanıcı soyadını karakter karakter yazmak zorunda kalır. Doğru jetonlarla, formun tamamı saniyeler içinde otomatik doldurulabilir, hem çabayı hem de hata oranlarını azaltır.

Ayrıca kuruluşlar için kullanılabilirlik ve dönüşüm oranı açısından da faydalar vardır: Araştırmalar, otomatik doldurma ile uyumlu formların terk edilme oranlarının daha düşük, tamamlama oranlarının daha yüksek olduğunu tutarlı biçimde göstermektedir; bu da otomatik doldurma jetonlarını düzeltmenin yalnızca bir erişilebilirlik iyileştirmesi değil, aynı zamanda doğrudan bir iş iyileştirmesi olduğu anlamına gelir.

İlgili Axe-core Kuralları

  • autocomplete-valid — Bu, WCAG 1.3.5 için birincil axe-core kuralıdır. <input>, <select> ve <textarea> özniteliği autocomplete olan her öğeyi inceler ve öznitelik değerinin HTML otomatik doldurma spesifikasyonundan tanınan, geçerli bir jeton olup olmadığını kontrol eder. Jetonun yanlış yazıldığı (ör. tire yerine boşluk içeren given name), standart dışı tescilli bir değerin kullanıldığı (ör. autocomplete="first-name") veya çok jetonlu bir değerde jeton sırasının yanlış olduğu (ör. alan adının gerekli bölüm önekinden önce yerleştirilmesi) durumlarda öğeleri işaretler. Kural, tamamen autocomplete özniteliği eksik olan alanları işaretlemez — bu durum manuel inceleme gerektirir — çünkü axe-core, bir alanın ölçüt kapsamına girip girmediğini (yani kullanıcı hakkında bilgi toplayıp toplamadığını) programatik olarak belirleyemez.
  • Neden manuel test de gereklidir — axe-core gibi otomatik araçlar yalnızca mevcut bir autocomplete değerinin sözdizimsel olarak doğru olduğunu doğrulayabilir; seçilen jetonun alanın amacını doğru şekilde tanımlayıp tanımlamadığını belirleyemez. Örneğin, autocomplete="email" değerine sahip bir fatura telefonu alanı, email geçerli bir jeton olduğu için otomatik kuraldan geçer, ancak jeton alanın gerçek amacıyla eşleşmediğinden ölçütten kalır. Benzer şekilde, otomatik araçlar, autocomplete özniteliği eksik olup aslında sahip olması gereken alanları tespit edemez; çünkü bir alanın kullanıcı hakkında kişisel bilgi toplayıp toplamadığını belirlemek, bağlama dayalı insan yargısı gerektirir. Bu nedenle, kullanıcıya özgü veri toplayan her form alanının manuel olarak incelenmesi, 1.3.5 ile tam uyum için zorunludur.

Nasıl Test Edilir

  1. axe DevTools veya Lighthouse ile otomatik tarama çalıştırın. Formu içeren sayfayı Chrome veya Firefox’ta açın. axe DevTools’ta “Analyze”a tıklayın ve sonuçları autocomplete-valid kural kimliğine göre filtreleyin. Lighthouse’ta bir erişilebilirlik denetimi çalıştırın ve autocomplete ile ilgili ihlallere bakın. İşaretlenen her öğeyi not alın ve bildirilen geçersiz jeton değerlerini kaydedin. Her işaretli öğeyi düzeltin ve düzeltmeyi doğrulamak için yeniden tarama yapın.
  2. Tüm kapsam içi girdi alanlarını manuel olarak belirleyin. Formu inceleyin ve mevcut kullanıcı hakkında bilgi toplayan her alanı listeleyin — ad alanları, adres alanları, e-posta, telefon, ödeme detayları, kimlik bilgileri. Her alan için bir autocomplete özniteliğinin mevcut olduğunu ve jetonunun HTML otomatik doldurma jeton listesine göre alanın gerçek amacıyla eşleştiğini doğrulayın. Başkaları hakkında bilgi toplayan alanlar kapsam dışıdır ve hariç tutulabilir.
  3. Tarayıcı otomatik doldurma davranışını test edin. Chrome veya Firefox’ta tarayıcının kayıtlı bir profili olduğundan emin olun (Ayarlar > Otomatik Doldurma). Form sayfasına gidin ve ilk kişisel bilgi alanına tıklayın. Tarayıcının bir otomatik doldurma önerisi sunduğunu ve bu öneriyi seçmenin doğru alanları doğru değerlerle doldurduğunu doğrulayın. Adres alanları, ödeme alanları ve kimlik bilgisi alanları için tekrarlayın. Otomatik doldurma değer önermiyorsa veya yanlış alanları dolduruyorsa, autocomplete jetonları muhtemelen yanlıştır.
  4. Ekran okuyucu ve tarayıcı kombinasyonu ile test edin. NVDA ve Firefox ile, Tab tuşunu kullanarak her form alanına gidin. NVDA alanın etiketini ve amacını duyurmalıdır; bazı ekran okuyucu ve tarayıcı kombinasyonları otomatik doldurma amacını da duyurur. macOS’ta (Safari) VoiceOver ile, Tab kullanarak alanlar arasında gezinin ve VoiceOver’ın otomatik doldurma kullanılabilirliğini duyurmasını dinleyin. JAWS ve Chrome ile benzer şekilde alanlar arasında sekme ile gezinin ve JAWS’ın beklenen alan bağlamını duyurduğunu doğrulayın. Ekran okuyucular her zaman autocomplete jetonlarını açıkça duyurmasa da, otomatik doldurmanın klavye gezintisiyle birlikte doğru çalıştığını doğrulamak, programatik amacın açığa çıkarıldığını doğrular.
  5. Tarayıcı DevTools’ta autocomplete özniteliklerini inceleyin. Her form alanına sağ tıklayın ve “Inspect”i seçin. Elements panelinde, autocomplete özniteliğinin mevcut olduğunu ve değerinin geçerli bir jetonla tam olarak eşleştiğini doğrulayın. Özellikle çok jetonlu değerlere dikkat edin — örneğin, autocomplete="shipping street-address" — ve jeton sırasının spesifikasyonu takip ettiğini (bölüm adı, ardından “shipping” veya “billing”, ardından alan adı) doğrulayın.

Nasıl Düzeltilir

Ad alanları — Hatalı

<!-- Geçersiz: 'given-name' yerine standart dışı 'firstname' jetonunu kullanıyor -->
<label for='fname'>First Name</label>
<input type='text' id='fname' name='first_name' autocomplete='firstname'>

<label for='lname'>Last Name</label>
<input type='text' id='lname' name='last_name' autocomplete='surname'>

Ad alanları — Doğru

<!-- Geçerli: WHATWG tarafından belirtilen 'given-name' ve 'family-name' jetonlarını tam olarak kullanıyor -->
<label for='fname'>First Name</label>
<input type='text' id='fname' name='first_name' autocomplete='given-name'>

<label for='lname'>Last Name</label>
<input type='text' id='lname' name='last_name' autocomplete='family-name'>

Faturalama ve gönderim bölümleri olan adres formu — Hatalı

<!-- Geçersiz: adres alanlarında autocomplete öznitelikleri tamamen eksik -->
<fieldset>
  <legend>Billing Address</legend>
  <input type='text' name='bill_street' placeholder='Street Address'>
  <input type='text' name='bill_city' placeholder='City'>
  <input type='text' name='bill_postal' placeholder='Postal Code'>
</fieldset>

Faturalama ve gönderim bölümleri olan adres formu — Doğru

<!-- Geçerli: autocomplete jetonları 'billing' öneki ve doğru alan adlarını içeriyor -->
<fieldset>
  <legend>Billing Address</legend>
  <input type='text' name='bill_street' autocomplete='billing street-address' placeholder='Street Address'>
  <input type='text' name='bill_city' autocomplete='billing address-level2' placeholder='City'>
  <input type='text' name='bill_postal' autocomplete='billing postal-code' placeholder='Postal Code'>
</fieldset>

Telefon alanı — Hatalı

<!-- Geçersiz: tanınan bir autocomplete jetonu olmayan 'phone'u kullanıyor -->
<label for='tel'>Phone Number</label>
<input type='text' id='tel' name='telephone' autocomplete='phone'>

Telefon alanı — Doğru

<!-- Geçerli: 'tel' tam bir telefon numarası için doğru autocomplete jetonudur -->
<label for='tel'>Phone Number</label>
<input type='tel' id='tel' name='telephone' autocomplete='tel'>

Giriş kimlik bilgileri — Hatalı

<!-- Geçersiz: autocomplete='off' parola yöneticilerinin ve otomatik doldurmanın çalışmasını engeller -->
<label for='user'>Username</label>
<input type='text' id='user' name='username' autocomplete='off'>

<label for='pass'>Password</label>
<input type='password' id='pass' name='password' autocomplete='off'>

Giriş kimlik bilgileri — Doğru

<!-- Geçerli: 'username' ve 'current-password' parola yöneticilerinin doğru çalışmasını sağlar -->
<label for='user'>Username</label>
<input type='text' id='user' name='username' autocomplete='username'>

<label for='pass'>Password</label>
<input type='password' id='pass' name='password' autocomplete='current-password'>

Yaygın Hatalar

  • Doğru jeton given-name" yerine autocomplete="firstname" veya autocomplete="first-name" kullanmak. Bu standart dışı değerler mantıklı görünseler bile tarayıcılar veya yardımcı teknolojiler tarafından tanınmaz. Her zaman HTML otomatik doldurma spesifikasyonundaki tam jetonları kullanın.
  • autocomplete="tel" yerine autocomplete="phone" kullanmak. “phone” kelimesi geçerli bir jeton değildir. Spesifikasyon, tam bir telefon numarası için tel, telefon numarasının alt parçaları için ise tel-national, tel-area-code, tel-local kullanır.
  • Yanlış anlaşılmış bir güvenlik önlemi olarak kimlik bilgisi alanlarında autocomplete="off" ayarlamak. Modern tarayıcılar ve WCAG spesifikasyonu, giriş formlarında otomatik doldurmayı engellemenin engelli kullanıcılar için gerçek engeller yarattığını ve güvenliği anlamlı şekilde artırmadığını kabul eder. Bunun yerine autocomplete="username" ve autocomplete="current-password" kullanın.
  • Tarayıcının alan adından veya etiketinden amacı çıkaracağını varsayarak kişisel veri alanlarında autocomplete özniteliğini tamamen atlamak. Tarayıcılar alan amacını tahmin etmek için sezgisel yöntemler kullanır, ancak bunlar güvenilir değildir ve tarayıcılar arasında tutarsızdır. Garantili, erişilebilir bir deneyim için açık jetonlar gereklidir.
  • Belirli adres alt jetonları yerine autocomplete="address" kullanmak. Spesifikasyonda address jetonu yoktur. Bunun yerine street-address, address-line1, address-line2, address-level1 (eyalet/il), address-level2 (şehir) ve postal-code jetonlarını ayrı ayrı kullanmalısınız.
  • Çok jetonlu değerlerde gönderim veya faturalama anahtar sözcüklerini yanlış sıraya yerleştirmek. Doğru sıra: isteğe bağlı bölüm öneki (ör. section-billing), ardından isteğe bağlı shipping/billing anahtar sözcüğü, ardından alan adı jetonu. autocomplete="street-address billing" yazmak geçersizdir; doğru biçim autocomplete="billing street-address"’tir.
  • autocomplete özniteliğini yalnızca görünür alanlara uygulayıp gizli veya dinamik olarak gösterilen alanları yok saymak. Başlangıçta gizli olup kullanıcı etkileşimiyle gösterilen alanlar (ek adres satırları veya isteğe bağlı alanlar gibi) etkin hale geldiklerinde de doğru autocomplete jetonlarını taşımalıdır.
  • Sayfa yüklendikten sonra autocomplete özniteliğini dinamik olarak kaldırmak veya üzerine yazmak için JavaScript kullanmak. Bazı form kütüphaneleri veya UI çerçeveleri, bileşenler monte edildiğinde veya yeniden oluşturulduğunda girdi özniteliklerini sıfırlar ve istemeden autocomplete jetonlarını kaldırır. Tüm JavaScript çalıştıktan sonra özniteliğin canlı DOM’da kalmaya devam ettiğini her zaman doğrulayın.
  • Bir input üzerinde type="email" veya type="tel" kullanmanın, autocomplete olmadan amacı iletmek için yeterli olduğunu varsaymak. type bir miktar bilgi sağlasa da, autocomplete özniteliği WCAG 1.3.5 tarafından zorunlu tutulan ve tarayıcılar ile yardımcı teknolojiler tarafından farklı şekilde kullanılan ayrı, açık bir sinyaldir.
  • Farklı veriler toplayan iki farklı alanda aynı autocomplete jetonunu kullanmak. Örneğin, hem iş e-posta alanını hem de kişisel e-posta alanını autocomplete="email" ile etiketlemek tarayıcıları şaşırtır ve yanlış otomatik doldurmaya yol açabilir. Ayırt etmek için bölüm önekleri kullanın (ör. section-work email ve section-personal email).

Türkiye’nin Erişilebilirlik Mevzuatıyla İlişkisi

Türkiye’nin 21 Haziran 2025’te 32933 sayılı Resmî Gazete’de yayımlanan 2025/10 sayılı Cumhurbaşkanlığı Genelgesi, Türkiye’de faaliyet gösteren geniş bir yelpazedeki kuruluş için bağlayıcı erişilebilirlik gereklilikleri getirir. Genelge, dijital hizmetler için temel standart olarak WCAG 2.2 Seviye AA’ya uyumu zorunlu kılar; bu da doğrudan WCAG 1.3.5 — Girdi Amacını Belirleme ölçütünü içerir.

Genelge kapsamındaki tüzel kişi türleri oldukça geniştir. Kamu kurum ve kuruluşları, tüm vatandaş odaklı dijital hizmetleri için bu standartları karşılamakla yükümlüdür. Kapsama giren özel sektör kuruluşları arasında e-ticaret platformları, bankalar ve finansal hizmet sağlayıcılar, hastaneler ve sağlık hizmeti sunucuları, 200.000 veya daha fazla abonesi olan telekomünikasyon işletmecileri, lisanslı seyahat acenteleri, özel yolcu taşımacılığı şirketleri ve Millî Eğitim Bakanlığı (MEB) tarafından yetkilendirilmiş özel eğitim kurumları yer alır. Pratikte bu, Türkiye’deki hemen her büyük tüketici odaklı dijital ürünün — bankacılık uygulamalarından çevrimiçi perakende ödeme sayfalarına ve sağlık randevu portallarına kadar — tüm kişisel veri girdi alanlarında doğru şekilde uygulanmış autocomplete jetonlarına sahip olması gerektiği anlamına gelir.

Özellikle WCAG 1.3.5 için bu, kullanıcının adı, adresi, telefon numarası veya ödeme detayları gibi bilgiler toplayan herhangi bir Türk e-ticaret ödeme formu, banka hesap açma formu, hastane hasta kayıt formu veya telekom abonelik formunun, ilgili her girdi alanında geçerli autocomplete öznitelik değerleri içermesi gerektiği anlamına gelir. Bunu yapmamak, Seviye AA uyumsuzluğu oluşturur ve bir kuruluşun, dijital hizmetlerinin erişilebilirlik standartlarını karşıladığını belgeleyen ve Aile ve Sosyal Hizmetler Bakanlığı tarafından verilen resmi işaret olan Erişilebilirlik Logosunu elde etmesini veya korumasını engelleyebilir.

Erişilebilirlik Logosu hem itibar hem de düzenleyici açıdan önem taşır ve e-ticaret ve bankacılık gibi rekabetçi tüketici pazarlarındaki kuruluşların bunu elde etmek ve sürdürmek için güçlü teşvikleri vardır. WCAG 1.3.5’in uygulanması görece basit olduğundan ( autocomplete öznitelik değerlerini eklemek veya düzeltmek mimari değişiklik gerektirmez) ve bilişsel ve motor engelliliği olan kullanıcılara önemli fayda sağladığından, 2025/10 sayılı Genelge kapsamında tam Seviye AA uyumu hedefleyen bir kuruluşun yapabileceği en yüksek değerli, en düşük çabalı erişilebilirlik iyileştirmelerinden birini temsil eder.

Kuruluşlar, mobil web arayüzleri ve duyarlı tasarımlar dahil olmak üzere dijital varlıkları genelindeki tüm formları denetlemeli ve herhangi bir form uygulamasının standart bir parçası olarak doğru autocomplete jetonlarını gerektiren bir geliştirme politikası oluşturmalıdır. Bu, axe-core gibi araçlar kullanılarak CI/CD hatlarında otomatik test yoluyla uygulanmalı, böylece gerilemeler üretime ulaşmadan önce yakalanmalıdır.