Ruudunlukuohjelman oppimispolut:
miten näkevät kehittäjät voivat saavuttaa sujuvuuden
”Testasin sen VoiceOverilla” on frontend-saavutettavuuden yliarvostetuin väite. Purimme auki sen, miltä sujuvuus todella näyttää — ei tuttuus, vaan sujuvuus — ja rakensimme vaiheistetun suunnitelman, joka vie näkevän kehittäjän aitoon varmuuteen noin neljänkymmenen harjoitustunnin kuluttua, alkaen ruudunlukijayhdistelmästä, joka todella kannattaa, ja päättyen kehittäjätilan pikanäppäimiin, joita lähes kukaan ei opeta.
1. Miksi vaivautua — ja mitä sujuvuus oikeasti tarkoittaa
Lähes jokainen auditoimamme saavutettavuusohjelma raportoi saman luvun: yli yhdeksänkymmentä prosenttia frontend-kehittäjistä sanoo “testaavansa ruudunlukuohjelmalla”. Pyydä heitä näyttämään, ja demo on yleensä sama kolme näppäinpainallusta — käynnistä, selaa sivua tabilla, sammuta. Se ei ole testaamista. Se on rastin laittamista ruutuun.
Tämä tapahtuu rakenteellisista syistä, ei laiskuudesta. Ruudunlukuohjelma ei ole työkalu, jonka voi ottaa käyttöön samoin kuin uuden lintterin. Se on erilainen vuorovaikutusmalli, jolla on oma modaalinen tilansa, oma pikanäppäinkielioppinsa ja joukko käytäntöjä, jotka alkavat olla mielekkäitä vasta useiden todellisen työn tuntien jälkeen. Ennen kuin ylität tuon kynnyksen, työkalu kertoo sinulle lähes mitään — ja mikä pahempaa, se kertoo sinulle vääriä asioita, koska kuulemasi ilmoitukset riippuvat lukijan tilasta, selaimen saavutettavuuspuusta ja alustan IME-kerroksesta tavoilla, jotka eivät ole ilmeisiä ulkopuolelta.
Sujuvuus tarkoittaa tässä yhteydessä pistettä, jossa voit antaa kollegalle rikkinäisen komponentin, ottaa heidän näppäimistönsä ja toistaa virheen ruudunlukuohjelman ollessa käynnissä — katsomatta näyttöä, viittaamatta huijauslappuun ja tekemättä ilmoitusta huonommaksi kuin se olisi oikeassa käytössä. Tuttuus on piste, jossa olet kuullut ruudunlukuohjelman. Näiden kahden välinen ero on suunnilleen kolmekymmentä tai kolmekymmentäviisi tuntia tietoista harjoittelua.
Tämä ei korvaa testaamista vammaisten käyttäjien kanssa. Ruudunlukuohjelmaa käyttävä näkevä kehittäjä approximoi työnkulkua, jonka päivittäinen käyttäjä on sisäistänyt vuosien aikana. Sujuvuuden tarkoitus ei ole korvata käyttäjätestausta; tarkoitus on napata ilmiselvät virheet ennen käyttäjätestausta, jotta testausistunto käytetään hienovaraisempiin ongelmiin.
2. Valitse ruudunlukuohjelmasi — ja jätä JAWS myöhemmäksi
Markkinoilla on kolme ruudunlukuohjelmaa, joilla on merkitystä desktop-verkkokehityksessä: NVDA Windowsilla, VoiceOver macOS:ssä ja iOS:ssä sekä JAWS Windowsilla. Jokaisella on riittävän suuri käyttäjäkunta, ettei sen sivuuttaminen olisi neutraali valinta, ja jokainen ilmoittaa saman merkinnän hieman eri tavalla. Sujuva kehittäjä osaa ajaa vähintään kahta niistä.
Suosituksemme, seurattuamme kymmeniä kehittäjiä kynnyksen ylittäessä, on yksiselitteinen: aloita NVDA:lla Windowsilla ja VoiceOverilla macOS:ssä. Molemmat ovat ilmaisia. Molemmat ovat esiasennettuja (VoiceOver) tai asennettavissa alle viidessä minuutissa (NVDA). Molempia käyttää riittävästi oikeita käyttäjiä — NVDA:lla on approx. 65 % Windowsin ruudunlukuohjelmien markkinaosuudesta tuoreimmassa WebAIM-kyselyssä, VoiceOver hallitsee mobiilia ja merkittävää osaa macOS:stä — että oppimasi siirtyy välittömästi virheisiin, joihin voit toimittaa korjauksen. JAWS on kolmas työkalu, ei ensimmäinen, vaikka sillä onkin edelleen suurin yritysasennuskanta. Kolme syytä.
Kolme syytä jättää JAWS alkuvaiheessa sivuun ovat pedagogisia, eivät poliittisia. Ensiksi JAWS ja NVDA jakavat saman mentaalimallin — Windowsin selaustila vs. kohdistustila, sama Insert-pohjainen komentojen etuliite, sama virtuaalipuskuri — joten kun olet oppinut ajamaan NVDA:ta, yhdeksänkymmentä prosenttia JAWS-komennoista, joita oikeasti tarvitset, löytyy sanastohakuna. Toiseksi JAWS on kertynyt vuosikymmenien “älykäs” päättely: se yrittää korjata huonon merkinnän ennen kuin käyttäjä kuulee sen, mikä tarkoittaa, että JAWS:n peittämä virhe toimitetaan silti NVDA-käyttäjille. NVDA:n tarkoituksellisen konservatiivinen käyttäytyminen tekee siitä paremman referenssilukijan kun yrität oppia, mikä on rikki. Kolmanneksi JAWS:n lisenssihankala — aktivointi, neljänkymmenen minuutin kokeilutila, joka muistuttaa joka uudelleenkäynnistyksen yhteydessä — on oppimisrasitus, jota sinun ei tarvitse maksaa ennen kuin olet riittävän varma käyttämään sen.
VoiceOver paritetaan NVDA:n kanssa eikä kilpaile sen kanssa, koska kaksi lukijaa edustaa kahta hallitsevaa vuorovaikutusmallia. NVDA (ja JAWS) käyttää “PC-kohdistin”-mallia: virtuaalipuskuri, joka esittää sivun lineaarisena dokumenttina, ja erillinen kohdistus, joka seuraa sarkkausjärjestystä. VoiceOver käyttää yhtä VoiceOver-kohdistinta, joka on kohdistuksen päällä ja navigoidaan roottorin ja VO+nuolinäppäinten avulla. Kehittäjä, joka on sujuva vain yhdessä mallissa, kirjoittaa koodia, joka kuulostaa hyvältä omassa lukijassaan ja huonolta toisessa. Molempien oppiminen samanaikaisesti on ainoa luotettava tapa tuntea ero.
”Valitse kaksi ilmaista lukijaa. Käytä neljäkymmentä tuntia. Löydät enemmän saavutettavuusvirheitä seuraavan kvartaalin aikana kuin kolmessa viimeisessä toimittajan auditoinnissa yhteensä.”
3. Viikko 1 — näyttö pois, kädet näppäimistölle
Ensimmäisen viikon ohjelmalla on yksi sääntö: sammuta näyttö. Ei himmennetty, ei minimoitu, ei “sulken silmäni” — fyysisesti pois päältä tai peitettynä pahvinpalalla jos näyttösi on huoneen ainoa. Tarkoitus on poistaa huijaamisen mahdollisuus. Näkevän kehittäjän vaisto, heti kun ruudunlukuohjelma sanoo jotain hämmentävää, on katsoa näyttöä ja ratkaista epäselvyys visuaalisesti. Tuo vaisto on suurin yksittäinen syy siihen, miksi “testasin ruudunlukuohjelmalla” ei nappaa oikeita virheitä.
Suunnittele ensimmäiselle viikolle kolme noin yhdeksänkymmenen minuutin istuntoa, vähintään päivän välein, jotta lihastottumuksella on aikaa vakiintua. Jokaisella istunnolla on yksi tehtävä. Ensimmäinen rakentaa perusnäppäinkielen. Toinen pakottaa todelliseen vuorovaikutukseen. Kolmas testaa pysyvyyttä pienen paineen alla.
Istunto 1 — asenna, konfiguroi, selaa etusivua
Asenna NVDA (tai avaa VoiceOver macOS:ssä). Sammuta puhesyntetiikan kohteliaisuus jos mahdollista — haluat nopeaa, mekaanista puhetta, et ystävällistä oletusta. Avaa suuri uutissivusto, näyttö pois. Käytä 45 minuuttia painellen nuolinäppäimiä ja kuunnellen. Käytä toinen 45 minuuttia painellen H (seuraava otsikko), K (seuraava linkki) ja F (seuraava lomakekenttä) ja huomioiden miten sivu on rakennettu. Älä navigoi vielä minnekään.
Istunto 2 — kirjoita nimesi lomakkeeseen
Avaa oman yrityksesi sivuston yhteydenottolomake, näyttö pois. Navigoi Tab-näppäimellä nimikenttään. Kirjoita nimesi. Navigoi sähköpostikenttään. Kirjoita väärä sähköpostiosoite. Navigoi lähetys-painikkeeseen. Paina välilyöntiä. Jos et löydä lähetys-painiketta katsomatta näyttöä, se on tietoa: lomakkeesi sarkkausjärjestys on rikki, tai sen nimilaput ovat rikki, tai molemmat. Kirjaa ongelma ylös. Älä korjaa sitä vielä — korjaaminen ennen kuin olet kuullut kymmenen muuta lomaketta on ennenaikaista optimointia.
Istunto 3 — osta jotain halpaa
Avaa verkkokauppa, jossa et ole ennen käynyt, näyttö pois. Etsi tuote, joka maksaa alle viisi dollaria. Lisää se ostoskoriin. Saavuta maksuvaihe. Pysähdy ennen maksamista — mutta mene kaikki tie maksulomakkeelle asti. Tämä on istunto, joka kaataa ihmiset. Huomaat, että “riittävän sujuva testaamiseen” ja “riittävän sujuva käyttämiseen” ovat eri kynnykset. Ensimmäinen pelkkä kuunteluistunto oli pelkkää harjoittelua; tämä on ensimmäinen tekemisen istunto.
Lopeta. Olet oppinut sen oppitunnin, jonka tarvitsit viikolta. Oppitunti ei ole “olen huono ruudunlukuohjelmissa” — se on “tämä sivusto on aidosti vaikea käyttää ilman näkökykyä”. Useimmat suuret verkkokaupat vievät ruudunlukuohjelman käyttäjältä kolmestakymmenestä kuuteenkymmeneen minuuttia enemmän kuin näkevältä käyttäjältä koko ostoksen loppuun saattamiseen. Tunnet nyt tuon eron.
4. Viikot 2–4 — lomakkeet, navigointi ja tilaansa
Toisen ja neljännen viikon harjoittelun pitäisi kertyä noin kaksikymmentä tuntia — kaksi yhdeksänkymmenen minuutin istuntoa viikossa sekä pieni määrä satunnaiskäyttöä päivätyön ohessa. Tämän jakson tavoite on sisäistää kaksi asiaa, jotka hämmentävät uusia ruudunlukuohjelmien käyttäjiä enemmän kuin mikään muu: ero selaustilan ja kohdistustilan välillä sekä ero sen välillä, mitä roottori näkee ja mitä sarkkausjärjestys näkee.
| Selaustila (NVDA, JAWS) | Kohdistustila (NVDA, JAWS) | VoiceOver (yksi tila) | |
|---|---|---|---|
| Nuolinäppäimet | Navigoi virtuaalipuskurissa | Lähetetään kohdistuneelle hallinnalle | Navigoi aina VoiceOver-kohdistinta |
| Tab | Siirtää kohdistusta ja pysyy selaustilassa | Siirtää kohdistusta ja pysyy kohdistustilassa | Siirtää kohdistusta; VoiceOver-kohdistin seuraa |
| Kirjainpikanäppäimet (H, K, F) | Pikanavigaatio | N/A | Korvattu roottorilta (VO+U) |
| Milloin se vaihtuu | Oletus useimmilla sivuilla | Automaattisesti contenteditable- ja mukautetuille widgeteille | Ei koskaan — tilaa ei ole |
| Miten pakottaa | NVDA+Välilyönti | NVDA+Välilyönti (vaihtaa) | Ei sovelleta |
Yleisin hämmennys toisella viikolla on hetki, jona kehittäjä painaa NVDA:ssa nuolinäppäintä, odottaa virtuaalipuskurin liikkuvan, ja kuulee sen sijaan kohdistuneen yhdistelmälaatikon avaavan vaihtoehtoluettelonsa. Tällöin selaustila vaihtuu automaattisesti kohdistustilaan, koska kohdistus on laskeutunut elementille, jonka NVDA luokittelee “sovellus”-widgetiksi. Uudet kehittäjät kokevat tämän lukijan virhetoimintana. Se ei ole sitä — lukija tekee täsmälleen mitä spesifikaatio pyytää. Kun olet kuullut tämän kymmenen tai viisitoista kertaa, se ei enää yllätä; siihen asti, suunnittele yllättyväsi suunnilleen joka toisessa istunnossa.
Kolmannen viikon kaava on lomakkeet. Rakenna yksityinen testisivu kahdeksalla tai kymmenellä hallinnalla: pakollinen tekstikenttä inline-virheilmoituksella, päivämäärän valitsin, monivalinta, mukautettu tyylitelty valintaruutu, poistettu painike josta tulee aktiivinen, “näytä salasana” -vaihdin, puhelinnumerokenttä maakoodin valitsimella ja lähetys-painike, joka käynnistää palvelinpuolen validointiyhteenvedon. Näyttö pois, navigoi läpi viisi kertaa — ensin NVDA selaustilassa, sitten NVDA kohdistustilassa, sitten NVDA uudelleen ääniohjelman ilmoitusasetus nostettu (Insert+Z, lisää tästä viidennessä osiossa), sitten VoiceOver roottorin kanssa ja sitten VoiceOver ilman roottoria. Sama lomake kuulostaa erilaiselta viisi kertaa. Siltä sujuvuus tuntuu sisältäpäin: huomaat, että sama merkintä kertoo viisi eri tarinaa, ja pystyt ennustamaan etukäteen, mikä niistä soi.
Neljäs viikko on navigointi. Ota todellinen, monimutkainen sivusto — dokumentaatioportaali, työn hallintapaneeli, verkkokaupan kategoriasivu — ja yritä löytää tietty tieto käyttämällä vain ruudunlukuohjelman pikanäppäimiä. Käytä H otsikoiden välillä hyppimiseen. Käytä D (NVDA) tai VO+U ja “Maamerkit” (VoiceOver) maamerkissä hyppimiseen. Käytä 1–6 tiettyyn otsikkotasoon hyppimiseen. Neljännen viikon loppuun mennessä navigointipikanäppäinten pitäisi olla refleksejä eikä valintoja, samoin kuin tab ja shift-tab jo ovat.
”Päivänä, jona huomaat, että H:n painaminen kaksikymmentä kertaa tuntuu nopeammalta kuin tab kolmekymmentä kertaa, lakkaat olemasta näkevä kehittäjä esittämässä ja alat olla kehittäjä, joka osaa navigoida.”
5. Kehittäjätilan pikanäppäimet, joita lähes kukaan ei opeta
Kun käyttäjätilan komennot ovat refleksejä, seuraava harppaus on kunkin lukijan kehittäjille suunnattuihin pintoihin. Nämä ovat tilat ja pikanäppäimet, jotka manuaalit hautaavat — osittain koska ne on suunnattu kehittäjille, osittain koska ne ovat niin äänekäs, että päivittäinen käyttäjä ei haluaisi niitä päällä. Kolme on syytä oppia heti.
Kaksi lisäkäytäntöä säästää enemmän aikaa kuin mikään yksittäinen pikanäppäin. Ensiksi, kiinnitä NVDA:n puheentarkkailija toiselle näytölle (tai yhden näyttösi kulmaan) kehityksen aikana. Sanasanainen loki jokaisesta ilmoituksesta on ruudunlukutyölle sitä, mitä kehitystyökalujen konsoli on JavaScriptille: ero arvaamisen ja tietämisen välillä. Toiseksi, oppi lukemaan saavutettavuuspuuta selaimesi kehitystyökaluissa — Chromen Accessibility-ruutu, Firefoxin Accessibility Inspector, Safarin Audit-välilehti. Lukija ilmoittaa mitä saavutettavuuspuu sisältää, ei mitä DOM sisältää, ja nämä kaksi poikkeavat riittävän usein, ettet voi debugata live-alueita, ARIAa tai shadow DOMia lukematta puuta suoraan.
Hämmennys on syytä merkitä nyt, koska se syö tunteja toisella ja kolmannella viikolla: lukutila vs. kohdistustila ei ole sama akseli kuin “sivu on interaktiivinen” vs. “sivu on dokumentti.” NVDA vaihtaa automaattisesti kohdistustilaan kun kohdistus laskeutuu hallinnalle, jolla on role=“application”, tai contenteditable-elementille, tai tietyille mukautetuille widgeteille, jotka lukija heuristisesti luokittelee interaktiivisiksi — riippumatta siitä, onko sivu enimmäkseen staattinen. Vastaavasti rikaslisäinen yksisivuinen sovellus, jonka juurielementti on main-maamerki ja jonka widgetit ovat hyvin merkittyjä natiivipainikkeita, pysyy selaustilassa lähes koko käyttäjäistunnon ajan. Tila on kohdistetun elementin ominaisuus, ei sivun ominaisuus.
NVDA+Välilyönti vaihtaa manuaalisesti selaustilan ja kohdistustilan välillä. Kun jokin kuulostaa väärältä, tämä on ensimmäinen kokeiltava asia — puolet ajasta lukija oli siinä tilassa, jota et odottanut, ja kerran vaihtaminen kertoo sinulle onko virhe tilarakenteessa vai merkinnässä.
6. Sujuvuusaikataulu — rehelliset vertailuarvot
Alla olevat luvut perustuvat noin kahdeksankymmenen kehittäjän epäviralliseen seurantaan — frontend-insinööreihin, laadunvarmistusvetäjiin, saavutettavuusasiantuntijoihin koulutuksessa — kolmen vuoden yritystyöpajoissa ja henkilökohtaisessa mentoroinnissa. Ne eivät ole tutkimus. Ne ovat riittävän hyviä suunnittelun pohjaksi. Kaksi oletusta: tietoinen harjoittelu (näyttö pois, todelliset tehtävät, ei “NVDA käynnissä taustalla kun koodaan”), ja kiinteä lukijayhdistelmä (NVDA Windowsilla ja VoiceOver macOS:ssä).
”Osittainen sujuvuus” on realistinen kohde useimmille näkeville kehittäjille ja on käytännössä kaikki mitä tarvitaan ollakseen hyvä saavutettavan tuotteen tekijä. Aito sujuvuus — taso, jolla voisi mahdollisesti korvata päivittäisen ruudunlukuohjelman käyttäjän käytettävyystarkastelun aikana — on pikemminkin sataviisikymmentä tuntia ja vuosi satunnaista harjoittelua, eikä useimmat työskentelevät kehittäjät tarvitse sitä. Tähtää osittaiseen sujuvuuteen, aikatauluta neljäkymmentä tuntia ja hyväksy, että kaiken sen tuolle puolelle jäävä tulee tekemällä päivätyötä lukija käynnissä ja halulla hidastaa tahtia.
Yksi viimeinen vertailuarvo asettamaan odotukset rehellisesti: kehittäjät, jotka tasaantuvat, tasaantuvat kokemuksemme mukaan kymmenen ja kahdenkymmenen tunnin välillä. Syy on lähes aina sama — he lakkaavat sammuttamasta näyttöä. He vakuuttavat itselleen olevansa nyt “riittävän hyviä” testaamaan näyttö päällä, ruudunlukuohjelma taustalla käynnissä ja visuaalinen vahvistus saatavilla aina kun ääni on epäselvä. He eivät ole. Kuusitoista tuntia “käyttökelpoisen” ja “mukavan” välillä vaativat näytön pois päältä, koska juuri siinä vaiheessa lukijan ilmoitukset muuttuvat informaatioksi melun sijaan. Ilman tuota painetta aivot palaavat visuaaliseen ja lukijan ääni katoaa taustahuminaan. Jos löydät itsesi hidastumasta, syy on lähes aina näyttö.
”Neljänkymmenen tunnin sinä löytää enemmän ruudunlukuvirheitä yhden tunnin julkaisuedeltävässä läpikäynnissä kuin viimeisin automaattinen auditointi. Tämä ei ole korkea rima. Tätä ruudunlukuohjelmalla testaamisen on aina pitänyt tarkoittaa.”
Yhteenveto: polku on lyhyt, kurinalaisuus ei ole
Syy siihen, miksi “testaa ruudunlukuohjelmalla” tuottaa niin heikkoja tuloksia koko alalla, ei ole se, että työkalu olisi vaikea oppia — neljäkymmentä tuntia ei todellakaan ole paljon — vaan se, että oppiminen on epämukavaa tietyllä tavalla. Näytön sammuttaminen saa näkevän kehittäjän tuntemaan itsensä kyvyttömäksi tavalla, joka on epätavallinen ammatissamme. Olemme tottuneet olemaan ihmisiä, jotka selvittävät asiat; ruudunlukuohjelma tekee meistä, muutaman tunnin ajan kerrallaan, aloittelijoita uudelleen. Se epämukavuus, eivät näppäinpainallukset, on varsinainen este.
Polku eteenpäin on edellä kuvattu: NVDA ja VoiceOver, kolme istuntoa ensimmäisellä viikolla näyttö pois, lomakkeet ja tilat viikoilla kaksi–neljä, kehittäjätilan pikanäppäimet heti kun käyttäjätilan pikanäppäimet ovat refleksejä, neljäkymmentä tuntia yhteensä ennen kuin voidaan luottaa vakavaan julkaisuedeltävään läpikäyntiin. Mikään tästä ei ole uutta. Työ, jota ala ei ole tehnyt, on sen kohteleminen työnä — tuntien aikatauluttaminen, niiden puolustaminen muilta sitoumuksilta, hyväksyminen, että ensimmäiset kymmenen tuntia tuntuvat hyödyttömiltä kunnes äkkiä eivät tunnu.
Jos julkaiset frontendiä, noiden neljänkymmenen tunnin tuolla puolella oleva sinä on huomattavasti parempi insinööri kuin lähtöpisteessä ollut, tavoilla, jotka näkyvät paitsi saavutettavuustyössäsi myös ymmärryksessäsi kohdistusjärjestyksestä, progressiivisesta parannuksesta ja siitä, mitä selain oikeasti tekee pinnan alla. Ruudunlukuohjelma on halvin hajautettujen järjestelmien oppitunti kenellä tahansa verkolle kirjoittavalle. Hinta on näyttö pois ja muutama viikonloppu.
”Et tule ruudunlukuohjelman käyttäjäksi. Tulet kehittäjäksi, joka kuulee miltä koodi kuulostaa yhdelle. Se riittää — eikä suurimmalla osalla alaa ole sitä vielä.”