ARIA rövidítése az elérhető gazdag internetes alkalmazások (kérhető Rich Internet Applications), az E szabvány alkalmazása lehetővé teszi, hogy a helyszínen jobban hozzáférhető a fogyatékkal élők, mint a hallás vagy látás. Lássuk, mit tehetünk, hogy a fejlesztők könnyebbé teszik életüket.
Az egyik módja, hogy használja ezt a szabványt - hozzátéve ARIA jelölő HTML-ben. Ön valószínűleg ismeri szemantikus HTML elemeket, mint nav. gombot vagy a fejléc. Ez könnyű megérteni, hogy miért akkor használja ezeket az elemeket. Adnak több értelmét és tartalmát az oldal, tudjuk használni ezek kombinációja elemek és ARIA jelölést. Azonban a közös használatát meg kell vizsgálni egy pár dolgot.
ARIA szerepek adunk a HTML-forrás, mint az attribútumokat. Ezek határozzák meg, hogy milyen típusú és jelölje a célra, amely arra szolgál. Az alábbi példában az elem azonosítjuk banner:
Egy másik példa a szerepe az információs számolt be, hogy az elem információkat tartalmaz a tartalmát az oldal.
Notification fog kinézni:
role = „alert” teljes mértékben együttműködik az elemeket a DOM dinamikusan hozzáadni vagy megváltoztatni a kijelzőn, mint a display: none a display: block
Elements span (hogyan és div) a legtöbb esetben nem kell megadni role = „előadás”, hiszen ez nem egy a fában a rendelkezésre álló (elérhetőség fa) böngésző. De szemantikai elemek, mint a h1 - h6 van értelme.
ARIA attribútumok
ARIA attribútumok kissé eltér az ARIA szerepeket. Azt is hozzátette, hogy az elrendezés, de már van egy bizonyos tartományban ARIA attribútumok. Minden használt attribútumokat aria- előtag, és két csoportra oszthatók: az állami és tulajdonságait.
- Attribútumértékek állapotra vált eredményeként felhasználói beavatkozást.
- Az attribútum értékek, tulajdonságok, általában változatlan maradjon.
Példa ARIA-state attribútum Aria-jelölve. használt ilyen elemeket a jelölőnégyzetek és rádió gombok.
Tény, hogy a használata ARIA attribútumot natív rádiógombot szükségtelenül kötelező input type = „radio” és az ária ellenőrizni automatikusan.
Minta tulajdonság tulajdonságait ária-címkét. Ez az attribútum használható, ha a címke az űrlap elem nem látható az oldalon (ez lehet diktálta a tervezés, vagy egyszerűen nincs értelme). Azokban az esetekben, ahol a címke szövege belátásuk ária-labelledby attribútumot. Azt is használják, mint az előző attribútum értéke megegyezik az értéke id tag.
Ezt meg lehet tenni egy alak elemet.
szabályok ARIA
Mielőtt rohanás csatába, ne feledje, hogy több okból nem szükséges hozzá ARIA minden elemére.
Próbáld ki, hogy a legtöbb szemantikus HTML elemek
Az alapértelmezett szemantika ARIA utal szemantika az elemei a böngészőben. Az ilyen elemek például a nav. cikk és a gombot már megállapított szerepeinek role = „navigáció”. role = "árucikk" és a role = "gomb", ill. Eljövetele előtt szemantikus HTML elemek meghosszabbították jelölő típus
. Most már tudjuk használni ahelyett, hogy a nav div, és nem kell hozzá a szemantikai elem role = „navigáció”. mert ezt a szerepet az már implicit. Meg tudja nézni az asztalra W3C jelenlétében és távollétében ARIA attribútumok a kívánt elemet.
Egy elem csak egy szerep
Egy elem nem lehet több szerepet. Definíciója szerint, szerepe:
A fő típusát jelző. Ez a szemantikai egyesület lehetővé teszi eszközök megjelenítése és támogatása tárgyakkal való megfelelő módon a felhasználó elvárásainak megfelelő egyéb tárgyai közül az azonos típusú.
Nem lehet két szerepet a HTML elem. Minden szemantikailag szerepet valamilyen módon, és a definíció szerint a fenti, egy elem nem lehet két fajta. Lehetne egy gomb-header? Nem, csak az egyik. Válassza a szerepet, amelyet a legjobban leírja a funkció az elem.
Ne változtassa meg a szemantika a natív
Nem szabad használni a szerepet, amely nem felel meg a szemantikai elem, mint a hozzáadott szerepet átírja natív szemantika elem. Például:
Azonban a második szabály ARIA szükség esetén lehetővé teszi, használjon beágyazott elemeket.
Hogy mást lehet, hogy a megjelölést inkább hozzáférhetővé válik?
Hozza ki a legtöbbet szemantikai elemek
Ez jön a tapasztalat, de ha úgy gondolja, a szolgáltatás, amit épít, akkor kapsz egy jó ötlet, hogyan kell használni az elemeket, amelyek alkalmasak a célra jobb, mint egy div vagy span. A gyakorlatban, akkor HTML elemeket tartalmazó lista az oldalon W3C. hogy jobban megismerjék őket.
Az egyik kedvenc példája a blockquote tag. amelyet gyakran más célokra használják. Vannak más hasonló elemek, amelyek meghatározott célokat szolgálnak:
- q - jelöli, kisbetűs hivatkozások, mint a hivatkozások egy bekezdésen belül a szöveget.
- cite - használják idézi kreatív munkát a szöveget, például a verseket.
Itt egy példa mindkét ezen elemek:
Sok eleme a HTML, akkor nem veszi figyelembe, beleértve néhány új is, így ismét javasolta, hogy értékelje a lehetőségeket.
Az alt attribútum
Gyakran elfelejtik része az elrendezés, amely komolyan befolyásolhatja a rendelkezésre álló, különösen abban az esetben, képernyőolvasó. Ez az attribútum megjelent a leírásban, mivel a HTML2 és leírása a következő:
A szöveg helyett a képet, ha a kép miatt nem áll rendelkezésre semmilyen korlátozást vagy preferenciák a felhasználó.
Az emberek gyakran töltse ki az alt attribútum nem informatív, például szöveget írunk, mint a „kutya” a kép a kutya játszik a parkban. Sajnos a szöveg nem tesz nincs kép látássérülteknek. A következő megközelítés megfelelőbb:
Megjegyezzük, hogy az alt attribútum nincs beállítva ugyanazt a dolgot és figcaption elem. alt cél az, hogy hozzon létre egy alternatív szöveg a képet. figcaption és ez csak a megfelelő címet a szám. Ha fejlesztjük előző példában a figcaption a következő szöveg lép:
megjelölt példát használva szemantikus HTML és ARIA, összpontosított megközelíthetőség
Ha megnézzük a példa ebben a cikkben, akkor elvárható, hogy, mint a referencia, a következő:
- használja szemantikai HTML kép és képaláírás
- rendeltetésszerű használat idézik elem
- add alt attribútum
- használatának egyik attribútumok ARIA
következtetés
ARIA szerepeket és tulajdonságokat biztosít óriási hatása, ha a tartalom a webhely által feldolgozott képernyőolvasó vagy más kisegítő technológiákat. A elterjedése a segítő technológiák figyelembe kell vennünk az integráció ARIA kódunk, mint a rendszeres gyakorlat.
további anyagok