Aký je účel atribútu "role" v jazyku HTML?

V práci niektorých ľudí stále vidím atribúty rolí. Aj ja ho používam, ale nie som si istý jeho účinkom.

Napríklad:

<header id="header" role="banner">
    Header stuff in here
</header>

Alebo:

<section id="facebook" role="contentinfo">
    Facebook stuff in here
</section>

Alebo:

<section id="main" role="main">
     Main content stuff in here
</section>

Je tento atribút roly potrebný?

Je tento atribút lepší z hľadiska sémantiky?

Zlepšuje SEO?

Zoznam rolí nájdete tu, ale vidím, že niektorí ľudia si vymýšľajú vlastné. Je to povolené alebo správne použitie atribútu role?

Máte k tomu nejaké názory?

SuperDJ
Edited question 9 august 2018 в 5:04
Programovanie
html
1 máj 2012 в 10:11
19 zobrazenia
Riešenie

Väčšina rolí, ktoré vidíte, bola definovaná ako súčasť ARIA 1.0 a neskôr začlenená do HTML5. Niektoré z nových prvkov HTML5 (dialógové okno, main atď.) sú dokonca založené na pôvodných rolách ARIA.

http://www.w3.org/TR/wai-aria/

Existujú dva hlavné dôvody, prečo používať roly okrem vášho pôvodného sémantického prvku.

Dôvod č. 1. Nadradenie roly v prípade, že nie je vhodný žiadny prvok hostiteľského jazyka alebo bol z rôznych dôvodov použitý menej sémanticky vhodný prvok.

V tomto príklade bol použitý odkaz, aj keď výsledná funkčnosť sa viac podobá tlačidlu ako navigačnému odkazu.

<a href="#" role="button" aria-label="Delete item 1">Delete</a>

Čítačky obrazovky to budú počuť ako tlačidlo (na rozdiel od odkazu) a môžete použiť selektor atribútov CSS, aby ste sa vyhli class-itis a div-itis.

*[role="button"] {
  /* style these a buttons w/o relying on a .button class */
}

Dôvod č. 2. Zálohovanie natívnej roly prvku'na podporu prehliadačov, ktoré implementovali rolu ARIA, ale ešte neimplementovali natívnu rolu prvku'na.

Napríklad rola "main" je v prehliadačoch podporovaná už mnoho rokov, ale do HTML5 pribudla relatívne nedávno, takže mnohé prehliadače ešte nepodporujú sémantiku pre ``.

…

Je to technicky zbytočné, ale niektorým používateľom to pomôže a žiadnemu to neuškodí. O niekoľko rokov sa táto technika pravdepodobne stane nepotrebnou.

Napísali ste tiež: Vidím, že niektorí ľudia si vymýšľajú svoje vlastné. Je to povolené alebo správne použitie atribútu role?

To'je správne použitie atribútu, pokiaľ nie je zahrnutá skutočná rola. Prehliadače použijú prvú rozpoznanú rolu v zozname tokenov.

<span role="foo link note bar">...</a>

Zo zoznamu sú platnými rolami iba link a note, a preto sa použije rola link, pretože je na prvom mieste. Ak používate vlastné roly, uistite sa, že nie sú v rozpore so žiadnou definovanou rolou v ARIA alebo v hostiteľskom jazyku, ktorý používate (HTML, SVG, MathML atď.).

TylerH
Edited answer 28 marec 2017 в 1:53
Komentáre (10)

Ako som pochopil, roly boli pôvodne definované v XHTML, ale boli zrušené. Teraz ich však definuje HTML 5, pozri tu: https://www.w3.org/WAI/PF/aria/roles#abstract_roles_header

Účelom atribútu role je identifikovať pre analyzujúci softvér presnú funkciu prvku (a jeho potomkov) ako súčasti webovej aplikácie. Je to hlavne vec prístupnosti pre čítačky obrazovky, ale vidím to aj ako užitočné pre vložené prehliadače a škrabky obrazovky. Aby bol atribút užitočný pre neobvyklého klienta HTML, musí byť nastavený na jednu z rolí zo špecifikácie, na ktorú som odkazoval. Ak si vymyslíte vlastnú, táto 'budúca' funkcia nemôže'fungovať - lepší by bol komentár.

Praktické informácie nájdete tu: http://www.accessibleculture.org/articles/2011/04/html5-aria-2011/

carrola7
Edited answer 4 apríl 2018 в 7:15
Komentáre (0)

Je tento atribút roly potrebný?

Odpoveď: Ano.

  • Atribút role je potrebný na podporu prístupných bohatých internetových aplikácií (WAI-ARIA) na definovanie rolí v jazykoch založených na XML, ak tieto jazyky nedefinujú vlastný atribút role.
  • Hoci je to dôvod, prečo atribút role zverejnila pracovná skupina Protocols and Formats Working Group, atribút má aj všeobecnejšie prípady použitia.

Poskytuje vám:

  • prístupnosť
  • Prispôsobenie zariadenia
  • Spracovanie na strane servera
  • Komplexný popis údajov,...atď.
W.R.
Edited answer 5 máj 2017 в 5:38
Komentáre (1)