Erişilebilirlik

Bu sayfa, simgelerin ekran okuyucular, klavyeler, dokunmatik girdi ve hareketi azaltma ayarlarıyla nasıl çalıştığını açıklar.

Erişilebilir adlar

title olmadan bir simge aria-hidden olur ve ekran okuyucular onu atlar. Bir simge bir düğmenin veya bağlantının tek içeriğiyse denetime erişilebilir bir ad verin; bunu denetimde aria-label ile ya da simgede title ile yapabilirsiniz:

tsx

import { Settings } from "kubai-icons-react";

<button aria-label="Settings"><Settings /></button>

<button><Settings title="Settings" /></button>

<kubai-icon> web bileşeni erişilebilir adını label özniteliğinden alır.

Girdi ve hareket

prefers-reduced-motion ayarlıysa simgeler animasyon olmadan doğrudan bitiş pozuna geçer.
trigger="parent" ile klavye odağı, hareketi üzerine gelme gibi oynatır. Fare tıklamasından sonra kalan odak oynatmaz.
Dokunmatik ekranlarda bir dokunuş hareketi ileri ve geri oynatır. Düğme tipi simgeler ise bunun yerine durum değiştirir.
Bookmark gibi düğme tipi simgeler durumlarını yalnızca renk ve şekille gösterir. Ekran okuyucuların durumu duyurabilmesi için simgenin yanına görünür metin ekleyin ya da düğmede aria-pressed ayarlayın.