Disaineri juhend veebi juurdepääsetavuse kujundamise aluste kohta

Veeb peaks olema koht, kus igaüks saab juurdepääsu samale sisule kõikjal maailmas. Vastupidavad tehnikad on läinud kaugele seadme agnostilised kujundused. Aga kuidas ligipääsetavus-agnostilised kujundused?

Veebi juurdepääsetavus on olnud juba aastaid, kuid selle rakendamine nõuab uusi edusamme tehnoloogia ja veebi arendamisel. Paljud arendajad tahavad aidata, kuid see on raske mõista, kuidas ligipääsetavust kujundada, sest seal on nii palju liikuvaid osi. See hõlmab suure kontrastsusega teksti, pimedate, optimeeritud meediumide ja mitte-JS / CSS-brauserite kõrvalekaldeid.

Selles postituses käsitlen juurdepääsetavuse disaini põhialuseid, mida see on, mida see lahendab, ja samme, mida saate alustada. Pange tähele, et tegemist on uskumatult üksikasjaliku teemaga, mille täielikuks mõistmiseks kulub aega või aastat. Kuid eelised on vaeva väärt ning kõik teie veebiprojektid jätavad igale külastajale püsiva mulje ligipääsetavast sisust.

Juurdepääs juurdepääsetavusele

Üldiselt on ligipääsetavus sisu loomise idee seda saab igaüks tarbida. See võib hõlmata pimedaid inimesi, kes ei saa lugeda, ning see võib hõlmata ka füüsilise puudega inimesi, kes ei saa kasutada hiirt või klaviatuuri (või kas).

Kuid see võib hõlmata ka inimesi, kellel on kergeid puudusi nägemuses. See võib hõlmata inimesi, kellel on düsleksia või lugemise mõistmise probleemid. Tegelikult on idee “veebi juurdepääsetavus” sisaldab kõik võimalikud kahjustused, mis võivad mõjutada seda, kuidas keegi veebilehte suhtleb või tarbib.

Võib-olla veelgi olulisem on see, mida veebi juurdepääsetavus võib pakkuda, nagu siin Wikipedia määratluses kirjeldatud:

Ometi väidab Anne Gibson oma nimekirjas, et Wikipedia määratlus on liiga ebamäärane ja see ei ole lihtsalt puudega inimeste kohta. See on tõesti kõigile veebis kogu maailmast ei pruugi olla optimaalne juurdepääs Internetile.

Paljud devid arvavad, et ligipääs on ainult pimedatele, kes ei saa lugeda. Kuid veebi juurdepääsetavuse peamised kategooriad on tegelikult neli:

1. Visuaalne - vähese nägemisega või halb / puudub nähtavus
2. Kuulmis - kuulmispuudega või kurtid
3. Kognitiivne - probleemide mõistmine või tarbimine
4. Mootor - füüsilise juurdepääsetavuse probleemid, mis võivad vajada spetsiaalseid sisendseadmeid nagu klaviatuurid või häälkäsklusprogrammid

Neil kategooriatel on suured tehnikad muutuvad sama kiiresti kui veebistandardid. Kuid nende standarditega, mis on ratifitseeritud WCAG-i, on olemas stabiilsuse tunne.

Mõned veebilehed, nagu näiteks valitsusasutused peavad seaduste kohaselt neid suuniseid järgima. Need kehtivad rahvusvaheliselt W3C kaudu.

Vaatame veebi juurdepääsetavuse taga olevat bürokraatiat ja sukeldame seejärel mõnda sobivat disaini.

W3C ja juurdepääsetav disain

Seal on üsna vähe veebi juurdepääsetavusega seotud akronüümid. Need võivad olla keerulised, kui te olete selle teema jaoks täiesti uued, kuid kui lihtsustatud, loodan, et nad on rohkem mõistlikud.

• W3C (World Wide Web Consortium) - Rahvusvaheline rühm, mis määratleb protokollide, keelte ja eeskirjade veebistandardid. Kõik ametlikud juurdepääsusuunised kuuluvad selle organisatsiooni alla.
• WAI (Veebi juurdepääsetavuse algatus) - Ametlik programm, mis hõlmab kõike kättesaadavuse kohta. See üldine mõiste sisaldab kõiki kaasaegse juurdepääsetavuse reegleid, suuniseid ja tehnikaid.
• WCAG (Veebisisu juurdepääsetavuse juhised) - Rühm standardeid ja reegleid, mis aitavad disaineritel hinnata oma veebisaite ligipääsetavuse taseme alusel.
• ARIA (Kättesaadavad rikas Interneti-rakendused) - Spetsiifiline standard, mis määratleb, kuidas luua ligipääsetavaid rikkalikke rakendusi, mis tuginevad JavaScript / Ajax'ile ja sarnastele tehnoloogiatele. Lisateavet selle postituse kohta lugege Anna Monus.

Muud juhised on olemas ka WAI katuse all UAAG kasutajaagentide jaoks ja ATAG veebikirjutamise tööriistade jaoks. Praegu peaksite teid kõige rohkem huvitama WAI tehtud ettepanekutest ja WAI reeglistiku juhistest WCAG nime all.

Suurepärane vahend rohkemate õppimiseks on see postitus W3C-st puuetega inimestele, jagades lugusid sellest, kuidas puuetega inimesed Internetile pääsevad. Võib olla keeruline mõista kõiki keerulisi probleeme, rääkimata sellest, kuidas neid lahendada. Aga parimaks allikaks on inimesed, kes neid probleeme igapäevaselt silmitsi seisavad.

Teine oluline teema, mida peaksite mõistma, on WCAG vastavus. See on seotud veebisaidi juurdepääsetavuse tase hõlmab mitmesuguseid tegureid. Tasemed põhinevad vastavusel A, AA ja AAA reitingusüsteem. Seda saab kontrollida veebi juurdepääsetavuse kontrolli vahendiga. Parim tulemus on AAA.

Nende juhiste kohta lisateabe saamiseks vaadake W3C tutvustust WCAG 2.0 artiklile. Lisateabe saamiseks vaadake ka neid seotud linke:

• WCAG 2.0 lihtsustatud
• WCAG Performance Performance

Kättesaadava disaini sammud

Soovitan külastada A11Y projekti veebilehte, et saada praktilisi ligipääsetavuse nõuandeid. A11Y (mis on ka numbrimärk) on tasuta avatud lähtekoodiga projekt, mis asub GitHubis, pakkudes kättesaadavaid veebidisaini tehnikaid.

Saate sirvida nende juurdepääsetavuse üksuste kontrollnimekirja või isegi hulk disainimustreid selliste elementide nagu rippmenüüde, vahekaartide, akordionide, nuppude ja modaalsete akende jaoks (muu hulgas ka).

Kõiki neid asju on raske õppida ja seda samal ajal rakendada. Võta see samm-sammult ja soovi rohkem uurida, kui sa segadust tekitavad.

Vaadake A11Y juhendeid ja kiiret nõuandeid alustamiseks. Sul tekib konkreetseid ettepanekuid, nagu hüpik-sisuga lingid ja kõrge kontrastsusega värviskeemid. Neil tehnikatel on oma detailne tase, mistõttu on rakendamine enamasti seotud testimisega, et näha, mis toimib.

Mõtle pimedatele kasutajatele, kes kasutavad automatiseeritud sisu lugejat. Neil võib olla ka heli tõlkija või isegi spetsiaalne klaviatuur veebi navigeerimiseks võtmetega, mitte hiirega. See on põhjus, miks õige semantiline HTML (vaadake seda artiklit) on nii oluline omadustega tabindex ja accesskey.

Kui soovite sukelduda, siis kaaluge juurdepääsetavuse teema valimist. Saate uurida arhitektuuri ja kohandada disaini vastavalt oma projektile.

Kättesaadavuse testimise vahendid

Kui soovite alustada, vali lihtsalt juurdepääsuvaldkond ja proovige seda. Siis saate kasutada testimisvahendeid, et hinnata oma edu taset.

Väärib märkimist, et see protsess võib olla masendav. Seal on nii palju kaaluda ja WCAG juhised on nii raskesti mõistetavad, et teil võib olla teabe ülekoormus.

Oluline on lihtsalt liikuda. Valige üks juurdepääsuvaldkond ja tehke see fookuseks. Seejärel kasutage neid tööriistu, et aidata teil oma tööd muuta ja parandada.

Näiteks võite proovida töötada WCAG kontrastsusega parandada loetavust. Kui olete oma värvid valinud, kasutage seda tasuta kontrastsuse kontrollerit, et näha, kas nad töötavad koos.

Kahjuks on WCAG 2.0 juhised nii segadusttekitavad, et teil võib olla raskusi nõuete mõistmisega. Aga mida rohkem te proovite, seda rohkem saate õppida ja mida rohkem saate aru.

Saidi testimiseks, mis on juba võrgus, vaadake WAVE. See on tasuta visuaalne kontroll mis kuvab vigu, hoiatusi, kontrastiküsimusi ja muid veebisaidi üksikasju. Külgribal kuvatakse visuaalne vaade ja probleemide loend.

Cynthia Says veebisaidil on veel üks tasuta rakendus kontrollige WCAG-i edetabelite A, AA, AAA veebisaite, ja § 508 valitsuse vastavuse kohta.

Ja kui sa oled avatud lähtekoodiga, siis vaadake neid tasuta ligipääsetavuse testimise vahendid GitHubis.

• HTML CodeSniffer
• Automatiseeritud juurdepääsetavuse testimise tööriist
• WCAG valideerija

Brauseri lisandmoodulid

Brauseri lisandmoodulid pakuvad tõenäoliselt kiiremini ja lihtsamini juurdepääsetavuse testimise meetodeid. Neid saab kasutada mis tahes veebisaidi mis tahes arvutist, et saada tõeliselt kasulikke tulemusi.

Firefoxi AInspectorit peetakse juurdepääsetavuse jaoks kohustuslikuks. See kontrollib kõike ja see on palju põhjalikum kui WAVE tester.

Mozilla kasutajad võivad samuti meeldida WCAG Contrast Checkerile, mis on ka tasuta lisandmoodul.

Chrome'i kasutajatel pole AInspectorit, kuid neil on Google'i poolt ametlikult loodud Accessibility Developer Tools. See lisab inspektori aknasse juurdepääsetavuse juhiste kontrollimiseks lisavahendeid.

Chrome'i kasutajatel on ka värvikontrasti heleduse kontrollerid ja mõned muud tasuta laiendused.

Kahjuks ei suutnud Safari kasutajatele palju leida, kuid leidsin Opera'le ühe laienduse, mis kontrollib WCAG 2.0 vastavust. Kui olete valmis Google'ist piisavalt raske otsima, võite leida rohkem vahendeid.

Lisalugemist

Kui olete tõsiselt, et veebi juurdepääsetavus on valmis pika tee jaoks. See ei ole lihtne, kuid see on väga täiuslik.

Nüüdseks peaksite rohkem aru saama veebi juurdepääsetavuse tegelikust määratlusest, miks see on olemas, ja väikestest üksikasjadest selle kohta, mida arendajad peaksid oma veebisaitide parandamiseks tegema. Järgmine samm on edasine uurimistöö ja praktika, et neid põhimõtteid oma töövoo sisse viia.

Lisateabe saamiseks vaadake järgmisi postitusi ja tutvuge kindlasti WCAG juhistega, kui soovite teadmisi otse allikast.

• HTML-tabeli juurdepääsetavuse parandamine märgistusega
• Puuetega kasutajate juurdepääsetav disain
• 6 nõuandeid veebisaidi kättesaadavuse parandamiseks
• Veenduge, et teie sait on ligipääsetav nägemispuudega inimestele