Enostranske aplikacije predstavljajo pomemben izziv za dostopnost pri sporočanju sprememb pogleda. Brez osveževanja strani bralniki zaslona ne poberejo teh pomembnih sprememb uporabniškega vmesnika, zaradi česar so uporabniki z motnjami vida zmedeni in se ne zavedajo.
Ena od rešitev je ustvariti sporočilo na podlagi naslova strani in izkoristiti območje ARIA v živo, da s koristnim sporočilom izrecno sporoči, da je naložen nov pogled. Najprej ustvarite funkcijo, ki se pokliče, ko se posodobi viewContent. AngularJS v ta namen ponuja dogodek $ viewContentLoaded. V kodi krmilnika poslušajte dogodek in pokličite funkcijo (v CoffeeScript):
app.controller 'PageController', ($ obseg, $ lokacija, $ http) -> $ obseg. $ na '$ viewContentLoaded', napovedi_pregled_naloženo
V funkciji napovedi_pregled_naložite posodobite naslov strani in objavite sporočilo. Čeprav okviri z eno stranjo ne posodabljajo samodejno naslovov strani, sinhronizacija naslova strani s trenutnim pogledom izboljša uporabnikom razumevanje pogleda.
Eden od načinov za to je uporaba atributa podatkov nekje v pogledu za shranjevanje naslova pogleda:
document.title = $ ('[data-viewtitle]'). data 'viewtitle'
Zdaj ustvarite sporočilo s posodobljenim naslovom strani in ga objavite:
$ .announce (document.title + ’, pogled naložen’)
$ .announce () je funkcija jQuery, ki za objavo vsebine uporablja eno, nevidno regijo v živo. Ta pristop pomaga poenostaviti napore kode in odpravljanja napak v primerjavi z ad hoc uporabo živih regij. Vendar si je treba zapomniti nekaj najboljših praks.
Najprej na svoji strani ustvarite eno regijo v živo za napovedovalce, ki bo objavila vsebino s pomočjo aria-live = "vljudno | asertivno". Ne uporabljajte nobenih drugih regij v živo, vključno z vlogami regij v živo (npr. Role = "alert | timer | log"). Primer žive regije:
div aria-live = "polite" id = "napovedovalec"> (Besedilo, dodano ali posodobljeno, bo objavljeno) / div>
Drugič, počistite vsebino območja v živo kmalu po posodobitvi vsebine. To preprečuje, da bi uporabniki naleteli na stara sporočila.
Končno, tako kot pri kateri koli tehniki dostopnosti, uporabite $ .announce () preudarno. Uporablja se lahko le za sporočanje pomembnih posodobitev uporabniškega vmesnika.
Besede: Patrick Fox
Patrick Fox je direktor spletnega uporabniškega vmesnika v podjetju Razorfish v Austinu. Ta članek se je prvotno pojavil v številki 271 revije net.
Je to všeč? Preberite jih!
- Oblikovalski vodnik po digitalni dostopnosti
- Najboljše brezplačne pisave pisav
- Brezplačna izbira pisav za grafite
