Jednostránkové aplikácie predstavujú významnú výzvu v oblasti prístupu, pokiaľ ide o komunikáciu zmien zobrazenia. Bez obnovenia stránky čítačky obrazovky nezachytia tieto dôležité zmeny používateľského rozhrania, takže používatelia so zrakovým postihnutím zostanú zmätení a nevedomí.
Jedným z riešení je vytvorenie správy založenej na názve stránky a využitie živej oblasti ARIA na výslovné oznámenie pomocou užitočnej správy o načítaní nového zobrazenia. Najskôr vytvorte funkciu, ktorá sa volá pri aktualizácii viewContent. AngularJS poskytuje na tento účel udalosť $ viewContentLoaded. V kóde radiča si vypočujte udalosť a zavolajte funkciu (v jazyku CoffeeScript):
app.controller ‘PageController‘, ($ scope, $ location, $ http) -> $ scope. $ on ‘$ viewContentLoaded‘ ,nounce_view_loaded
Vo funkciinounce_view_loaded aktualizujte názov stránky a oznámte správu. Zatiaľ čo jednostránkové rámce neaktualizujú automaticky názvy stránok, synchronizácia názvu stránky s aktuálnym zobrazením zlepšuje porozumenie zobrazenia používateľmi.
Jedným zo spôsobov, ako to urobiť, je použiť atribút údajov niekde v zobrazení na uloženie názvu zobrazenia:
document.title = $ (‘[data-viewtitle]’). data ‘viewtitle’
Teraz vytvorte správu pomocou aktualizovaného názvu stránky a oznámte ju:
$ .announce (document.title + ', view loaded')
$ .announce () je funkcia jQuery, ktorá na oznamovanie obsahu používa jednu neviditeľnú živú oblasť. Tento prístup pomáha zjednodušiť kód a úsilie pri ladení v porovnaní s ad hoc použitím živých oblastí. Je však potrebné pamätať na niekoľko osvedčených postupov.
Najskôr vytvorte na svojej stránke jediný aktívny región „oznamovateľa“ na oznamovanie obsahu pomocou aria-live = "polite | assertive". Nepoužívajte žiadne ďalšie živé oblasti vrátane rolí živých oblastí (napr. Role = "alert | timer | log"). Príklad živého regiónu:
div aria-live = "polite" id = "hlasateľ"> (text pridaný alebo aktualizovaný tu bude oznámený) / div>
Po druhé, krátko po aktualizácii obsahu vyčistite obsah aktívneho regiónu. To zabraňuje používateľom naraziť na staré správy.
Nakoniec, ako pri každej technike prístupnosti, používajte $ .announce () uvážlivo. Malo by sa používať iba na komunikáciu významných aktualizácií používateľského rozhrania.
Slová: Patrick Fox
Patrick Fox je technologický riaditeľ pre webové používateľské rozhranie v spoločnosti Razorfish v Austine. Tento článok sa pôvodne objavil v čísle 271 sieťového časopisu.
Páčilo sa vám to? Prečítajte si tieto!
- Sprievodca návrhára k digitálnej prístupnosti
- Najlepšie písma zdarma
- Bezplatný výber písma pre graffiti
