Domača » Kodiranje » Pogled v ARIA spletne standarde in dostopnost do aplikacij HTML

    Pogled v ARIA spletne standarde in dostopnost do aplikacij HTML

    Resnično odprt in vključujoč splet potrebuje tehnologije, ki omogočajo invalidnim uporabnikom, da se zanašajo na podporne tehnologije, da uživajo dinamično spletno vsebino in sodobne spletne aplikacije. Namen W3C-jevih spletnih standardov za dostopnost je naselitev spleta z dostopnimi bogatimi internetnimi aplikacijami (ARIA), ki jih lahko uporabniki s posebnimi potrebami učinkovito uporabljajo.

    ARIA je eden od številnih standardov in smernic za dostopnost, ki jih objavlja Intitiativna spletna dostopnost (WAI). Zagotavlja dodatno oznako, ki jo je mogoče enostavno vstaviti v dokumente HTML. WAI-ARIA je večstranska rešitev za vse naprave, ki je namenjena odprti spletni platformi, zato ne razmišljajte le o spletnih mestih, temveč tudi o igrah, digitalni zabavi, zdravstvenem varstvu, mobilnih in drugih aplikacijah..

    V tem prispevku si bomo ogledali, kako lahko s pomočjo standardov WAI-ARIA dodate dostop do dokumentov HTML.

    Okvir ARIA

    Sintaksa HTML-ja razvijalcem ne omogoča vedno, da bi pravilno opisala elemente, prepoznala njihove vloge in določila razmerja med njimi. Čeprav je to redko težava za obiskovalce, ki v celoti uživajo svoja čutila, lahko uporabnikom pomožne tehnologije preprečijo, da bi razumeli, kaj se dogaja na zaslonu, in raziskovali njihove možnosti..

    To je točka, na katero ARIA pride v našo pomoč, saj omogoča določitev namena različnih elementov s pomočjo pomembne vloge, in opisujejo njihovo naravo atributi z arijo. Predpisani atributi imajo dve vrsti: lastnosti ki opisujejo funkcije, ki se manj verjetno spreminjajo skozi ves življenjski cikel strani, in držav ki zagotavljajo informacije o stvareh, ki se lahko pogosto spremenijo zaradi interakcije uporabnika.

    Značilne vloge

    Značilne vloge so najbolj znane oblike modela vlog ARIA (druge so abstraktne vloge, vloge gradnikov in vloge strukture dokumentov). Pomembne vloge omogočajo razvijalcem, da prepoznajo velike vidne regije na spletni strani, ki jo uporabniki hitro potrebujejo.

    Obstaja 8 vrst vlog za mejnike ARIA, ki jih je treba dodati kot atribute ustreznim oznakam HTML.

    vloga =”banner”

    Vloga bannerja je namenjena predvsem uporabi za vsebino, ki je povezana s celotnim spletnim mestom, ne samo za posamezne strani. Običajno se doda kot atribut glavnemu naslovu mesta za logotip in druge pomembne informacije za celotno spletno mesto. Pomembno je, da vlogo bannerja uporabite le enkrat v dokumentih ali aplikacijah HTML.

    vloga =”main”

    Glavna prelomna vloga je povezana z glavno vsebino dokumenta. Ne morete ga uporabljati več kot enkrat na kateri koli strani HTML. Običajno sledi

    ali v HTML5 bolj semantično
    . Slednje je bilo dodano specifikacijam W3C z namenom preslikave main ARIA-mejna vloga semantičnega elementa HTML.

    vloga =”navigacijo”

    Navigacijska vloga je namenjena za označevanje območja, ki vsebuje elemente za krmarjenje, kot so povezave in seznami na spletnem mestu.

    vloga =”dopolnilni”

    Dopolnilna vloga označuje dodatno vsebino, ki je povezana z glavno vsebino spletnega mesta. Treba je postaviti na podobno raven v hierarhiji DOM kot role = "main". Povezane objave, priljubljeni članki, zadnji komentarji so tipični primeri avtonomne dopolnilne vsebine.

    vloga =”contentinfo”

    Vloga contentinfo obvešča uporabniške agente o prisotnosti regije, v kateri je mogoče najti različne vrste metapodatkov, kot so podatki o avtorskih pravicah, pravni podatki in izjave o zasebnosti. Običajno se uporablja za nogo spletnega mesta.

    vloga =”obliki”

    Vloga orientacijske točke označuje obrazec, ki čaka na vnos uporabnika. Za iskalne obrazce, ki jih morate uporabiti role = "search" namesto tega.

    vloga =”Iskanje”

    Vloga za iskanje je precej samoumevna, saj je namenjena pomoči pomožnim tehnologijam pri iskanju funkcionalnosti iskanja spletnega mesta.

    vloga =”aplikacijo”

    Uporabite lahko vlogo mejnika aplikacije za regijo, ki jo želite deklarirati kot spletno aplikacijo, in ne kot spletni dokument. Ni priporočljivo, da jo vključite na tradicionalna spletna mesta, saj namiguje na podporne tehnologije, da preklopite iz običajnega načina brskanja na način brskanja po aplikacijah. To mejno vlogo morate uporabljati samo z veliko pozornostjo.

    SLIKA: Viri dostopnosti za Sky.com

    In lastnosti

    Medtem ko vloge omogočajo, da določite pomen oznak HTML, stanja in lastnosti omogočajo uporabniku dodatne informacije o tem, kako z njimi sodelovati. Stanja in lastnosti so označene z atributi z arijo s sintakso aria- *.

    Najbolj znani atributi ARIA so verjetno aria-zahtevana lastnost in aria-preverjena država. Zahtevana Arija je a nepremičnine ker je trajna značilnost vhodnega elementa (tj. uporabnik ga mora izpolniti), medtem ko je aria-preverjen a država ker lahko potrditveno polje pogosto spremeni njegovo vrednost zaradi interakcije uporabnika.

    Sintaksa atributov, ki so določeni z Arijo

    Stanja in lastnosti včasih uporabljajo vrednosti žetona (omejen nabor vnaprej določenih vrednosti), na primer lastnost aria-live lahko ima 3 različne vrednosti: off, vljuden, samozavesten. Skladnja v tem primeru izgleda takole:

    .

    V drugih primerih so vrednosti atrijskih atributov, ki jih določa arija strune, številke, cela števila, ID reference ali pravilno napačno vrednosti.

    Kako izkoristiti države in lastnosti ARIA

    1. Zgradite odnose med elementi z atributi odnosov

    Uporabite atribute razmerja za označevanje razmerij med različnimi elementi na vašem spletnem mestu, ki jih ni mogoče drugače določiti iz strukture dokumenta. Na primer aria-označeno lastnost identificira element, ki označuje trenutni element.

    aria-označeno - med številnimi drugimi stvarmi - lahko povezujejo naslove z regijami znakov ARIA na naslednji način:

    To je naslov

    Glavna vsebina…

    2. Sinhronizirajte države in lastnosti z življenjskim ciklom elementa

    Ko nastavite orientacijsko vlogo ARIA za zaznavno območje na vaši strani HTML, lahko pomaga pomagati podpornim tehnologijam, če spremenite stanja in lastnosti podrejenih elementov ARIA glede na dogodke, ki se dogajajo na zaslonu. To je lahko ključnega pomena, kadar morajo uporabniki komunicirati s spletnim mestom, npr. Izpolniti obrazec ali izvesti iskalno poizvedbo.

    3. Ujemite vizualni in dostopni vmesnik

    Splošno pravilo oblikovanja dostopnosti je, da mora biti trenutno stanje uporabniškega vmesnika vedno vidno s pomočjo podpornih tehnologij. Na primer, če uporabnik izbere možnost v obliki, mora biti izbran tudi za podporne tehnologije. To je mogoče enostavno doseči z uporabo stanja, izbranega z ario, z naslednjo sintakso: .

    W3C-jeva smernica za avtorizacijo WAI-ARIA vam lahko da veliko drugih idej o tem, kako pravilno uskladiti vizualni in dostopni vmesnik vašega spletnega mesta..

    Ne pretiravaj z ARIA

    Uporaba vlog in atributov ARIA je včasih odveč. Ko uporabljate semantične oznake HTML5, kot je ali

    , moderni spletni brskalniki privzeto dodajo ustrezno semantiko ARIA. V tem primeru ni smiselno ločevati vlog ARIA.

    Npr. Ni potrebno uporabljati obliki mejne vloge za definiranje

    element. Namesto
    Sintaksa je povsem dovolj za uporabo
    . Prav tako je odveč uporabljati izvorne atribute HTML skupaj z ustreznim atributom ARIA.

    Torej, če ste že dodali skrito HTML atribut za vnos obrazca, ni potrebno dodajati aria-skrite kot je privzeto vključen brskalnik.

    © Savtec
    Koristne informacije in nasveti za razvoj spleta. Programiranje, spletni dizajn, CSS, HTML, JAVASCRIPT. Konfigurirajte in znova namestite WINDOWS. Izdelava spletnih mest in aplikacij iz nič.