HTML5, ARIA Uloge, i Screen Readers Mart 2011

Izvornik: HTML5, ARIA Roles, and Screen Readers in March 2011

Prošle godine, u HTML5, ARIA Uloge, i Screen Readers Mar 2010, uzeo sam pogled na to kako onda čitateljima trenutni ekran ponašao s nekim od sekcija elemenata HTML5 i srodne WAI-ARIA dokument i orijentir uloge. Sada kada je glavni čitače ekrana su svi vidjeli neke značajne promjene, kao i Firefox 4 i Internet Explorer 9 su službeno puštena, shvatio sam da je vrijeme da ponovite pregled i vidjeti što, ako ništa drugo, promijenio.

Update (21 Avgusta 2011): Vidi Steve Faulkner nedavne update na čitača ekrana i ARIA znamenitosti.

The Screen Readers

Ovaj put, ispitivanja su izvršena pomoću sljedeće čitači ekrana:

Svaki od čitača ekrana na bazi Windows su testirani u oba FF4 i IE9, sa izuzetkom SAToGo, koji radi samo s Internet Explorer.

Najnovija verzija VoiceOver u Mac OS X 10.6.7 je testiran u Safari 5.0.4.

Slučajevi The Test

Kao što je bio slučaj s prethodnim istraživanjima, postoje dva slučaja test. Prvi ima jednostavan stranice koristeći samo HTML5 sekcioniranje i nekoliko drugih semantičkih elemenata. Drugi efikasno reproducira istoj stranici, ali se odnosi ARIA orijentir uloge, a dva strukture dokumenta uloge.

Konkretno, HTML5 elemente zaposleni u slučajevima test su:

  • header
  • nav
  • section
  • article
  • aside
  • footer

Aria uloge se koristi u drugom test su:

  • application
  • article
  • banner
  • complementary
  • contentinfo
  • main
  • navigation
  • region

Ja uključuje jedan orijentir ulogu koju sam izostavio zadnji put, naime, applicationPored toga, jer je HTML5 Napomene za pomoćne proizvode tehnologija određuje regionkao zadani implicira ARIA ulogu section element, sam izričito dodijeljena ovaj dokument strukture uloga u jednoj od section au drugom testu slučaj. To je sumnjivo da ova uloga ćete mnogo korištenje, ali zbog testiranja šta se dešava kada se koristi, sam otišao naprijed i dodao je. Također imajte na umu da, kao što je predloženo u specifikaciji zaregion sam dodao aria-labelledby atribut koji referencira region ‘s povezanim naslovom.

Konačno, sam obrubljen mnogo od nevažnih teksta i nepotrebno dupliciranje pojedinih elemenata koji je bio prisutan u prethodnim verzijama ovih slučajeva test.

Rezultat Sažeci

U nastavku predstavlja neke komentare na FF4 novom ponašanje, uz sažeti mišljenja od glavnih zaključaka za svaki čitač ekrana. Detaljni rezultati za svaki test slučaj su dostupne dalje ispod.

Firefox 4 je novo ponašanje

Stvari sa FF4 su donekle zanimljiv, jer sada otkriva, preko IAccessible2 pristupačnost API, sve nav header i footer elemenata kao navigation banner i contentinfoznamenitosti, respektivno. Iako je ovo ponašanje je u redu za nav elemente, to je nije sasvim tačno za header i footer

Specifikacija ARIA jasno napominje da svaki dokument treba imati samo jednu banner i jedan contentinfo orijentir. Izlaganjem svaki header i footer na ovaj način, stranice s više od jedne od bilo koje od ovih, što nije neuobičajeno, efikasno imati više banner i / ilicontentinfo orijentira koliko podržavaju pomoćne tehnologije je u pitanju. Takav je slučaj sa NVDA 2011.1.

Srećom, Mozilla je dobro svjestan ove situacije, za koje postoji izvještaj bug, a to je vjerojatno za očekivati da će to biti upućena uskoro u predstojećem izdanju. U idealnom slučaju, samo header i footer elemenata naći na korijen sekcioniranje element dokument će biti izložena kao banner i contentinfo znamenitosti. U svakom slučaju, Mozilla zaslužuje pohvale za pokretanje implementirati ovu vrstu dostupnosti podrške za HTML5 osnovne elemente sa default implicira ARIA semantiku.

Kako Screen Readers Do

NVDA 2011.1

NVDA je opet jasan pobjednik ovog puta. Dok je njegovo ponašanje u FF4 sa header ifooter elemenata, odnosno identifikaciju svako kao banner i contentinfo znamenitosti, je manje od idealnog, važno je napomenuti da je ovo Firefox problem, a ne NVDA problem. U suprotnom, NVDA sretno čita sav sadržaj iz oba testa slučaja u FF4.

NVDA u IE9 nije loše, ali stvari su jedva super. Uz Uloga HTML5 Plus ARIA test, NVDA u IE9 kaže da je riječ “Edit” prije nego što pročitate svaku liniju teksta, npr, Edit, Heading Level Two, članovi Odjela; Uredi, Link, Skoči na link Član A; Uredi, Heading Level 3, člana A ….

NVDA također pruža navigacije po orijentir (preko D ključ), kreće fokus i najavljuje implicirane navigation banner i contentinfo znamenitosti u HTML5 samo test slučaj, kao i sve je izričito naveden znamenitosti u drugom HTML5 Plus ARIA Uloga test .

Update (21 Avgusta 2011): Imajte na umu da NVDA 2011.1 u FF4 (i NVDA 2.011,2 u FF6 po tom pitanju) ne daje orijentir za navigaciju ili objaviti application orijentira.

JAWS 12

JAWS ponaša identično u oba FF4 i IE9. To ne čini ništa posebno s jednostavnim HTML5 elemente iz prvog testa predmet, ali se, u drugom test, objaviti sve eksplicitno identifikovane orijentir uloge: application banner complementary contentinfo maini navigation Nadalje, JAWS također najavljuje ARIA dokument strukture uloga, article iregion kao orijentire.

Kao i NVDA, u drugom test, JAWS nudi orijentir za navigaciju (preko, ključ) za sve eksplicitno identifikovane ARIA orijentir uloge, kao i na dva strukture dokumenta uloge,article i regionkoji JAWS jednako smatra znamenitosti.

Ono što je najvažnije, JAWS 12 rešava Firefox i header bug iz kojih JAWS 10 i 11 patiti, pri čemu sav sadržaj sadržane u tom elementu bio praktično nevidljiv u čeljusti kada se koristi sa Firefox.

Window-Eyes 7.5

Sa svojim najnovija verzija, Window-Eyes se i dalje bori s HTML5. U FF4, rezultati su bili u redu sa oba test slučajeva, u tom sav sadržaj bio dostupan i čitati kao što se očekivalo, čak i ako Window-Eyes ne najavljuje ni HTML5 elemente ili ARIA uloge.

Gdje Window-Eyes u IE9 je u pitanju, međutim, rezultati su vrlo uznemirujuće. Dakle uznemirujuće, u stvari, da bih veoma zahvalan njihove potvrde od strane drugih korisnika.Ukratko, pojavljuje se prozor-Eyes trpe ozbiljne poteškoće u oba slučaja test. Sa samo test HTML5, to potpuno pogrešno liste na stranici, od kojih postoje samo dva, dok Window-Eyes nalazi pet. Također pronalazi samo jedan tarifni broj, koji nije zapravo naslov, dok je stranica zapravo sadrži šest naslova.

Uz drugi test slučaj sa ARIA ulogama, Window-Eyes ispravno identificira dvije liste, ali ne sasvim ispravno prepoznati sadržaj te liste ‘. On pronalazi dva naslova na stranici u ovom testu slučaju, ali opet, ni od naslova identificira su stvarne naslove na stranici. Konačno, on pronalazi tri nepostojeća okvire, na samo dva od kojih pruža navigacijske pristup.

Window-Eyes ne pruža prečice tipkovnice za navigaciju po orijentir.

Nepotrebno je reći, Window-Eyes 7.5 u IE9 je nesigurna kombinacija u kojoj HTML5 ili HTML5 u kombinaciji s ARIA ulogama su zabrinuti. Ono što se zapravo događa zahtijeva daljnje istraživanje, ali Window-Eyes ‘problem s listama, naročito kada se primjenjuju ARIA uloge, zabilježen je ranije.

SAToGo 3.2.197

Od SAToGo jasno objavljuje da može pružiti samo kompletne govornog upite ako koristite Internet Explorer, testirao sam ga u samo IE9. Uz prvu probu, to čitati i pruža jednostavan pristup svim sadržaja. Međutim, s Uloga stranice HTML5 Plus ARIA, prilikom čitanja kroz cijelu stranicu koristeći “kažu svi” naredba ili strelica, dva article elementi nisu pročitali, ali svaki je najavljen kao uređivati tekst, prazno. Ipak, ako koristite Tabključ za kretanje kroz focussable stavke na stranici, SAToGo zaustavlja na svakomarticle kaže njegov sadržaj kao da je sve samo jednostavan tekst, a zatim završava rekavši uređivati tekst, prazno.

SAToGo nudi orijentir za navigaciju (preko, ključ) za banner navigation mainapplication i contentinfo znamenitosti, ali ne i complementary orijentir. I to ne objavljuje vrstu orijentira kad tako navigacije.

VoiceOver 3

Uz prvu probu, VoiceOver čita i pruža pristup svim sadržajima, ali ne objaviti ili učiniti ništa posebno sa HTML5 elementima.

Njegovo ponašanje s drugi test slučaj je isti, osim što, prilikom čitanja kroz stranicu pomoću “Pročitaj sve” naredba (Ctrl + Opcija + A), aria-labelledby atribut nasection s role="region" izgleda izazvati VoiceOver u više navrata objaviti vrijednost predmetnog etiketa, u ovom slučaju, “Član članovi”, nakon što je praktično svaki čvor u tom section Uklanjanje aria-labelledby atribut to sprečava.

Dok VoiceOver u iOS 4 pruža orijentir za navigaciju, ova funkcionalnost ne izgleda da će biti dostupan u Mac OS X verzija VoiceOver.

Detaljne rezultate

Ako nije navedeno drugačije, čitač ekrana čita i pruža pristup svim sadržajima na stranici u svakom slučaju test.

HTML5 samo test

Screen Reader FF4 IE9 Safari 5.0.4
NVDA
  • najavljuje nav elementi kaoorijentir za navigaciju
  • najavljuje svaki header element kao orijentir banner
  • najavljuje svaki footer element kao orijentir contentinfo
  • ne objaviti section article iliaside elemenata
  • navigacije po orijentir za impliciranav header i footerznamenitosti
  • radi ništa posebno sa HTML5 elementima
N / A
JAWS
  • radi ništa posebno sa HTML5 elementima
  • radi ništa posebno sa HTML5 elementima
N / A
Window-Eyes
  • radi ništa posebno sa HTML5 elementima
  • Postoje samo dva liste na stranici, ali mi identificira pet lista:
    • prvu listu stavka pod “Test slučajevi” naslovom nije identificirano kao dio liste, dok je lista stavka drugi je (Lista 1 s 1 stavke)
    • listu pod “HTML5 Samo” tarifni se utvrdi da je popis od dva predmeta (Lista 2 sa 2 komada)
    • neposredno prije “Član A” naslovom, WE identificira prazan list (Popis 3 sa 0 komada)
    • neposredno prije aside u “Član A”, MI identificira praznu listu (List 4 sa 0 komada)
    • uoči posljednje footer na stranici, WE identificira praznu listu (List 5 sa 0 komada)
  • priznaje jedan ide na stranici, prazan prvog nivoa ide negdje između link i footer u “Član B”
N / A
SAToGo N / A
  • radi ništa posebno sa HTML5 elementima
N / A
Glas preko N / A N / A
  • radi ništa posebno sa HTML5 elementima

HTML5 Plus ARIA Uloge Test Case

Screen Reader FF4 IE9 Safari 5.0.4
NVDA
  • isto ponašanje kao HTML5 Samo
  • Osim toga najavljuje sve je
    izričito naveden orijentir uloge:
    application
    bannercomplementary
    contentinfomain inavigation
  • ne objaviti
    application
    orijentir
  • ne objaviti strukture dokumenta uloge:
    articleregion
  • navigacije po orijentir u implicirane navheader ifooterznamenitosti, kao i sve eksplicitno identifikovano znamenitosti
  • isto ponašanje kao HTML5 Samo
  • dodatno piše “edit” prije nego
    što pročitate svaku liniju teksta, npr,
    Edit, Heading Level Two,
    članovi Odjela;
    Uredi, Link, Skoči na link Član A;
    Uredi, Uredi, Heading Level 3, člana A …
N / A
JAWS
  • isto kao u IE9
  • najavljuje sve je izričito naveden orijentir uloge:
    application
    bannercomplementary
    contentinfo maini navigation
  • najavljuje strukture dokumenta uloge,article i region kao orijentire
  • navigacije po orijentir za sve orijentir uloge, kao i dva dokumenta strukturu uloga koje JAWS smatra znamenitosti
N / A
Window-Eyes
  • isto kao u HTML5 Only
  • WE identificira samo dvije liste, ali:
    • WE smatra prvu listu pod “test slučajeva” sadrži samo jednu stavku, onaj sa linka
    • druga lista je ispravno
      prepoznat kao dva stavka lista
  • WE pogrešno prepoznaje dva naslova na ovoj stranici: ne-naslovom teksta “Vivamus placerat” u “Član A” se smatra h3 kao što je tekst “Aliquam vehicula Justo ut metusčććšž” u “Član B”
  • Osim toga, dok smo mi najavljuje da stranica ima tri okvira, pruža samo navigacijske pristup dva, od kojih je jedan “Članci točki”section element, a jedan se nazivaaplikacije točki dugme koje ne radi ništa okvir
N / A
SAToGo N / A
  • isto kao i HTML5 Samo, osim što, prilikom čitanja kroz stranicu pomoću “, kažu svi” naredba ili strelica, svakiarticle sadržaj elemenata se ne čita, nego kolektivno najavljeno samo kaotekst koji se može uređivati, prazno
  • Međutim, ako koristiteTab ključ, SAToGo zaustavlja na svakom
    article kaže njegov sadržaj kao da je samo jednostavan tekst, završio sauređivati tekst, prazno
  • navigacije po orijentir u application
    banner
    content
    info
    maini navigationznamenitosti, ali ne icomplementaryorijentir
  • ne objavljuje vrstu orijentir prilikom navigacije po orijentir
N / A
Glas preko N / A N / A
  • isto kao i HTML5 Samo, osim da je u “Read All” modu, aria-labelledby
    na section s role="region" čini VoiceOver najavljuju vrijednost predmetnog etiketu nakon gotovo svaki čvor u tom section Na primjer, VoiceOver čita članovi Odjela; Idi na povezivanje u članu A, članovi Odjela, link; Član A, Vivamus placerat, članovi Odjela; libero ut convallis ELEMENTUM, članovi Odjela, link, članovi Odjela; Ovo je neki tekst u stranu, članovi Odjela …. Jednom kada dođe do kraja section piše riječ “region”, koja je ARIA strukture dokumenta uloga dodijeljena u section Uklanjanjearia-labelledby atribut sprečava VoiceOver iz radi ovo, a iz napomenuti da je section je “regija”

 

Ovo prevođenje HTML5, ARIA Roles, and Screen Readers in March 2011 je licenciran pod Creative Commons Nekomercijalno-ShareAlike 3.0 licencom .