Ļaujiet vienas lapas lietotnēm darboties ar ekrāna lasītājiem

Autors: Monica Porter
Radīšanas Datums: 13 Martā 2021
Atjaunināšanas Datums: 15 Maijs 2024
Anonim
Rick Giner: Accessibility in Single Page Applications
Video: Rick Giner: Accessibility in Single Page Applications

Vienas lapas lietojumprogrammas rada ievērojamu pieejamības problēmu, kad jāinformē par skata izmaiņām. Bez lapas atsvaidzināšanas ekrāna lasītāji neuztver šīs svarīgās lietotāja saskarnes izmaiņas, atstājot redzes invalīdus nesaprašanā un neziņā.

Viens no risinājumiem ir izveidot ziņojumu, pamatojoties uz lapas virsrakstu, un izmantot ARIA tiešraides reģionu, lai ar noderīga ziņojuma starpniecību skaidri paziņotu, ka ir ielādēts jauns skats. Vispirms izveidojiet funkciju, kas tiek izsaukta, kad tiek atjaunināts viewContent. Šim nolūkam AngularJS nodrošina notikumu $ viewContentLoaded. Kontroliera kodā klausieties notikumu un izsauciet funkciju (pakalpojumā CoffeeScript):

app.controller 'PageController', ($ sfēra, $ atrašanās vieta, $ http) -> $ sfēra. $ uz '$ viewContentLoaded', announce_view_loaded

Funkcijā announce_view_loaded atjauniniet lapas nosaukumu un paziņojiet ziņojumu. Kaut arī vienas lapas ietvari automātiski neatjaunina lapu nosaukumus, lapas nosaukuma sinhronizēšana ar pašreizējo skatu uzlabo lietotāju izpratni par skatu.


Viens no veidiem, kā to izdarīt, ir skata nosaukuma saglabāšanai kaut kur skatā izmantot datu atribūtu:

document.title = $ (’[data-viewtitle]’). dati ’viewtitle’

Tagad izveidojiet ziņojumu, izmantojot atjaunināto lapas nosaukumu, un paziņojiet par to:

$ .announce (document.title + ’, skats ielādēts’)

$ .announce () ir funkcija jQuery, kas satura paziņošanai izmanto vienu, neredzamu tiešraides reģionu. Šī pieeja palīdz vienkāršot koda un atkļūdošanas pasākumus salīdzinājumā ar dzīvo reģionu ad hoc izmantošanu. Tomēr ir jāatceras dažas labākās prakses.

Vispirms izveidojiet savā lapā vienu “diktora” tiešraides reģionu, lai paziņotu par saturu, izmantojot aria-live = "polite | assertive". Neizmantojiet citus tiešraides reģionus, ieskaitot tiešā reģiona lomas (piem., Role = "alert | taimeris | log"). Dzīvā reģiona piemērs:

div aria-live = "pieklājīgs" id = "diktors"> (Šeit tiks paziņots par pievienoto vai atjaunināto tekstu) / div>

Otrkārt, neilgi pēc satura atjaunināšanas notīriet tiešraides reģiona saturu. Tas neļauj lietotājiem paklupt uz veciem ziņojumiem.


Visbeidzot, tāpat kā ar jebkuru pieejamības tehniku, saprātīgi izmantojiet $ .announce (). To vajadzētu izmantot tikai nozīmīgu lietotāja interfeisa atjauninājumu paziņošanai.

Vārdi: Patriks Fokss

Patriks Fokss ir Web UI tehnoloģiju direktors Razorfish pilsētā Ostinā. Šis raksts sākotnēji tika parādīts tīkla žurnāla 271. numurā.

Patika tas? Izlasiet šos!

  • Dizainera rokasgrāmata par digitālo pieejamību
  • Labākie bezmaksas skriptu fonti
  • Bezmaksas grafiti fontu izvēle
Mēs Iesakām Jūs Redzēt
Kā konvertēt PowerPoint uz MP4
Lasīt Vairāk

Kā konvertēt PowerPoint uz MP4

Izpētījuši dažu tiešaite forumu, mē nokaidrojām, ka daudzi cilvēki viā paaulē praa veidu, kā pārveidot pptx uz mp4, vai jautā, vai ta ir iepējam. Nu, ļaujiet mum nokaidrot ituāciju, ta ir iepējam, bet...
3 lieliski veidi, kā mainīt vai atiestatīt Twitter paroli (soli pa solim)
Lasīt Vairāk

3 lieliski veidi, kā mainīt vai atiestatīt Twitter paroli (soli pa solim)

Lielākā daļa cilvēku vēla atietatīt Twitter konta paroli, ja domā, ka viņu kontam ir piekļūt bez viņu atļauja, tāpēc viņi vēla to atietatīt, lai nodrošinātu lielāku drošību. Tikai daži no viņiem mēģin...
Kā viegli nomainīt Windows 10 produkta atslēgu
Lasīt Vairāk

Kā viegli nomainīt Windows 10 produkta atslēgu

Ir divi galvenie iemeli, kādēļ kādam būtu jāmaina viņa Window 10 produkta atlēga. Ja pašreizējā atlēga nav likumīga, jum ir jāmaina produkta atlēga, šajā gadījumā jum nav jāintalē ava operētājitēma no...