Materi
WAI-ARIA adalah spesifikasi W3C berisi atribut tambahan yang memberi makna kepada teknologi bantu. MDN membaginya menjadi tiga. Role menyatakan apa sebuah elemen, misalnya navigation atau tablist. Properti memberi makna tambahan yang tetap, misalnya aria-required atau aria-labelledby. State menyatakan kondisi yang bisa berubah lewat skrip, misalnya aria-disabled.
Dokumen W3C Using ARIA menulis aturan pemakaiannya. Aturan pertama: bila ada elemen HTML bawaan dengan makna dan perilaku yang dibutuhkan, pakai elemen itu, jangan membuat ulang dengan role. Aturan kedua: jangan mengubah makna bawaan kecuali terpaksa. Aturan ketiga: semua kontrol ARIA yang interaktif harus bisa dipakai dengan papan ketik. Aturan keempat: jangan memasang role="presentation" atau aria-hidden="true" pada elemen yang bisa difokus. ARIA Authoring Practices menyebut sebuah role sebagai janji: div dengan role="button" menjanjikan perilaku papan ketik sebuah tombol, dan penulisnya sendiri yang harus memenuhinya dengan JavaScript.
Dua cara memberi nama aksesibel: aria-label berisi nama langsung yang tidak tampil di layar, dan aria-labelledby berisi id elemen yang teksnya dijadikan nama. MDN meminta aria-labelledby dipakai bila sudah ada teks terlihat yang melabeli elemen itu. Bila keduanya dipasang, aria-labelledby yang dipakai; atribut itu juga mengalahkan label dan teks isi elemen.
Kriteria 4.1.3 Status Messages (tingkat AA) meminta pesan status, seperti "Berkas terunggah", bisa ditentukan lewat role atau properti tanpa memindahkan fokus. Caranya aria-live. MDN menjelaskan atribut itu dipasang pada elemen yang sudah ada dan kosong, lalu isinya diganti saat terjadi perubahan. Nilai polite diumumkan tanpa memotong kegiatan pengguna, assertive diumumkan segera dan bisa memotong antrean ucapan, dan off tidak diumumkan.
<section aria-labelledby="judul-promo">
<h2 id="judul-promo">Promo akhir bulan</h2>
</section>
<p id="pesan-keranjang" aria-live="polite"></p>
