Bileşenler
ConsentBlock
Kaydırılabilir bir alanda okunacak metin, okuma çubuğu ve sona kadar bekleyebilen bir onay kutusu.
- Storybook
- Storybook
- Kaynak kod
- Kaynak kod
Rol ve anlam
Bölüm başlığı “Rol ve anlam”Başlık gerçek bir başlıktır (headingLevel, varsayılan h3). Metin alanı başlıkla adlandırılmış bir bölgedir (role="region") ve tabindex="0" ile odak alır; böylece klavyeyle kaydırılır. Okuma çubuğu ve solma aria-hidden taşır. Onay kutusu ipucunu ya da hatayı aria-describedby ile okur.
Klavye
Bölüm başlığı “Klavye”| Tuş | Davranış |
|---|---|
| Tab | Metin alanına, bağlantıya ve onay kutusuna. |
| Yukarı, Aşağı, Page Up, Page Down | Metin alanında kaydırır. |
| Space | Onay kutusunu işaretler. |
Metin alanı odak halkası gösterir. Onay kutusu açıldığında odak taşınmaz; durum bölgesi açıldığını söyler.
Ekran okuyucu
Bölüm başlığı “Ekran okuyucu”| Örnek | Okunan |
|---|---|
| Metin alanı | “Kullanım koşulları, bölge” |
| Kilitli onay | “Koşulları okudum ve kabul ediyorum, onay kutusu, devre dışı. Onaylamak için metni sonuna kadar kaydırın.” |
| Sona gelince | “Metnin sonuna geldiniz; artık onaylayabilirsiniz.” |
Kontrast
Bölüm başlığı “Kontrast”Metin 4,5:1; alan sınırı ve okuma çubuğu 3:1.
WCAG 2.2
Bölüm başlığı “WCAG 2.2”| Ölçüt | ConsentBlock nasıl karşılar | Ürün ekibi ne yapmalı |
|---|---|---|
| 2.1.1 Klavye | Kaydırma alanı odak alır ve klavyeyle kayar. | — |
| 3.3.2 Etiketler veya talimatlar | Kilit nedeni onay kutusunun altında yazar. | — |
| 3.3.1 Hata tanımlama | Hata onay kutusuna bağlıdır. | Gönderimde error verin. |