ARIA nedir? Ne zaman kullanılmalı, ne zaman kullanılmamalı?

Cevap

ARIA (Accessible Rich Internet Applications), HTML'in yetmediği durumlarda ekran okuyuculara ek anlam veren role ve aria-* niteliklerdir.

ARIA'nın birinci kuralı: mümkünse kullanmayın. Yerel HTML elemanı zaten doğru anlamı ve klavye davranışını sağlar.

<!-- Kötü -->
<div role="button" tabindex="0" onclick="kaydet()">Kaydet</div>

<!-- İyi: Enter/Space ve odak kendiliğinden çalışır -->
<button onclick="kaydet()">Kaydet</button>

ARIA'nın gerçekten gerekli olduğu durumlar:

  • aria-expanded, aria-controls: açılır menü ve akordeon durumu
  • aria-live="polite" / role="alert": dinamik bildirimleri okutmak
  • aria-label: yalnızca ikon içeren butonlar
  • aria-current="page": aktif menü öğesi
  • Sekme, combobox gibi karmaşık bileşenlerde WAI-ARIA desenleri

Yanlış ARIA, hiç ARIA olmamasından daha kötüdür.

  1. Bir modal (dialog) bileşenini erişilebilir yapmak için neler gerekir?OrtaErişilebilirlikFrontend
  2. Web erişilebilirliği (a11y) nedir, neden önemlidir?KolayErişilebilirlikFrontend

Bu konuda başka bir soru biliyor musun?

Mülakatta karşılaştığın soruları ekle, onaylandıktan sonra yayına alınsın.

Soru ekle