Wat is HTML5 ARIA?

Wat is HTML5 ARIA? Ik begrijp niet hoe ik het moet implementeren.


Antwoord 1, autoriteit 100%

WAI-ARIAis een spec-definiërende ondersteuning voor toegankelijke web-apps. Het definieert een aantal markup-extensies (meestal als attributen op HTML5-elementen), die door de webapp-ontwikkelaar kunnen worden gebruikt om aanvullende informatie te verstrekken over de semantiek van de verschillende elementen aan ondersteunende technologieën zoals schermlezers. Natuurlijk, om ARIA te laten werken, moet de HTTP-gebruikersagent die de opmaak interpreteert ARIA ondersteunen, maar de specificatie is zo gemaakt dat gebruikersagenten op een lager niveau de ARIA-specifieke opmaak veilig kunnen negeren zonder de functionaliteit van de webapp.

Hier is een voorbeeld van de ARIA-specificatie:

<ul role="menubar">
  <!-- Rule 2A: "File" label via aria-labelledby -->
  <li role="menuitem" aria-haspopup="true" aria-labelledby="fileLabel"><span id="fileLabel">File</span>
    <ul role="menu">
      <!-- Rule 2C: "New" label via Namefrom:contents -->
      <li role="menuitem" aria-haspopup="false">New</li>
      <li role="menuitem" aria-haspopup="false">Open…</li>
      ...
    </ul>
  </li>
  ...
</ul>

Let op het roleattribuut op het buitenste <ul>element. Dit kenmerk heeft op geen enkele manier invloed op hoe de opmaak door de browser op het scherm wordt weergegeven; browsers die ARIA ondersteunen, zullen echter OS-specifieke toegankelijkheidsinformatie toevoegen aan het weergegeven UI-element, zodat de schermlezer het kan interpreteren als een menu en het hardop kan voorlezen met voldoende context voor de eindgebruiker om te begrijpen (bijvoorbeeld een expliciete “menu” audio hint) en kan ermee communiceren (bijvoorbeeld spraaknavigatie).


Antwoord 2, autoriteit 29%

ARIA staat voor Accessible Rich Internet Applications.

WAI-ARIA is een ongelooflijk krachtige technologie waarmee ontwikkelaars eenvoudig het doel, de status en andere functionaliteit van visueel rijke gebruikersinterfaces kunnen beschrijven – op een manier die kan worden begrepen door ondersteunende technologie. WAI-ARIA is eindelijk geïntegreerd in het huidige werkconcept van de HTML 5-specificatie.

En als je je afvraagt ​​wat WAI-ARIA is, het is hetzelfde.

Let op: de termen WAI-ARIA en ARIA verwijzen naar hetzelfde. Het is echter correcter om WAI-ARIA te gebruiken om zijn oorsprong in WAI te erkennen.

WAI = Initiatief voor webtoegankelijkheid

Zo te zien wordt ARIA gebruikt voor ondersteunende technologieën en meestal schermlezen.

De meeste van uw twijfels zullen worden weggenomen als u dit artikel leest

http://www.w3.org/TR/aria-in-html /


Antwoord 3, autoriteit 11%

Wat is het?

WAI-ARIA staat voor “Web Accessibility Initiative – Accessible Rich Internet Applications”. Het is een set attributen om de semantiek van een website of webtoepassing te helpen verbeteren om ondersteunende technologieën, zoals schermlezers voor blinden, te helpen om bepaalde dingen te begrijpen die niet eigen zijn aan HTML. De getoonde informatie kan variëren van iets eenvoudigs als het vertellen van een schermlezer dat het activeren van een link of knop zojuist meer items heeft getoond of verborgen, tot widgets die zo complex zijn als hele menusystemen of hiërarchische boomweergaven.

Dit wordt bereikt door rollen en statusattributen toe te passen op HTML 4.01 of latere opmaak die geen invloed heeft op de lay-out of browserfunctionaliteit, maar die aanvullende informatie biedt voor ondersteunende technologieën.

Een hoeksteen van WAI-ARIA is het rolattribuut. Het vertelt de browser om de ondersteunende technologie te vertellen dat het gebruikte HTML-element niet echt is wat de naam van het element suggereert, maar iets anders. Hoewel het oorspronkelijk slechts een div-element is, kan dit div-element de container zijn voor een lijst met automatisch aanvullen-items, in welk geval een rol van “listbox” geschikt zou zijn om te gebruiken. Evenzo zou een andere div die een kind is van die container-div en die een enkel optie-item bevat, dan de rol “optie” moeten krijgen. Twee divs, maar door de rollen een totaal andere betekenis. De rollen zijn gemodelleerd naar veelgebruikte tegenhangers van desktopapplicaties.

Een uitzondering hierop zijn documentoriëntatiepunten, die de werkelijke betekenis van het betreffende element niet veranderen, maar informatie geven over deze specifieke plaats in een document.

De tweede hoeksteen zijn WAI-ARIA-staten en eigendommen. Ze definiëren de status van bepaalde native of WAI-ARIA-elementen, bijvoorbeeld als iets is samengevouwen of uitgevouwen, een formulierelement vereist is, iets waaraan een pop-upmenu is gekoppeld of iets dergelijks. Deze zijn vaak dynamisch en veranderen hun waarden gedurende de levenscyclus van een webapplicatie, en worden meestal gemanipuleerd via JavaScript.

Wat is het niet?

WAI-ARIA is niet bedoeld om het browsergedrag te beïnvloeden. In tegenstelling tot een echt knopelement, bijvoorbeeld, geeft een div waarop u de rol van “knop” giet u geen focus op het toetsenbord, een automatische klikhandler wanneer er op Spatie of Enter wordt gedrukt, en andere eigenschappen die inheems zijn voor een knop. De browser weet zelf niet dat een div met de rol van ‘knop’ een knop is, alleen het toegankelijkheids-API-gedeelte wel.

Als gevolg hiervan betekent dit dat u absoluut zelf toetsenbordnavigatie, focusbaarheid en andere gedragspatronen die bekend zijn van desktoptoepassingen, moet implementeren. U kunt enkele geavanceerde ARIA-technieken vinden Hier.

Wanneer mag ik het niet gebruiken?

Ja, dat klopt, dit gedeelte komt eerst! Omdat de eerste regel voor het gebruik van WAI-ARIA is: Gebruik het niet tenzij het absoluut moet!Hoe minder WAI-ARIA u heeft en hoe meer u erop kunt rekenen bij het gebruik van native HTML-widgets, hoe beter! Er zijn nog enkele regels die u moet volgen, u kunt ze hierbekijken.


Antwoord 4, autoriteit 6%

Wat is ARIA?

ARIA kwam naar voren als een manier om het toegankelijkheidsprobleem aan te pakken van het gebruik van een opmaaktaal die bedoeld is voor documenten, HTML, om gebruikersinterfaces (UI) te bouwen. HTML bevat een groot aantal functies om met documenten om te gaan (P, h3, UL, TABLE), maar alleen elementaire UI-elementen zoals A, INPUT en BUTTON. Windows en andere besturingssystemen ondersteunen API’s waarmee (Assistive Technology) AT toegang heeft tot de functionaliteit van UI-besturingselementen. Internet Explorer en andere browsers wijzen de oorspronkelijke HTML-elementen toe aan de toegankelijkheids-API, maar de html-besturingselementen zijn niet zo uitgebreid als de besturingselementen die gebruikelijk zijn op desktopbesturingssystemen, en zijn niet voldoende voor moderne webtoepassingen Aangepaste besturingselementen kunnen html-elementen uitbreiden om de rijke UI nodig voor moderne webapplicaties. Vóór ARIA had de browser geen manier om deze extra rijkdom bloot te stellen aan de toegankelijkheids-API of AT. Het klassieke voorbeeld van dit probleem is het toevoegen van een klikhandler aan een afbeelding. Het creëert wat lijkt op een klikbare knop voor een muisgebruiker, maar is nog steeds slechts een afbeelding voor een toetsenbord- of AT-gebruiker.

De oplossing was om een ​​set attributen te maken waarmee ontwikkelaars HTML kunnen uitbreiden met UI-semantiek. De ARIA-term voor een groep HTML-elementen die aangepaste functionaliteit hebben en ARIA-attributen gebruiken om deze functies toe te wijzen aan toegankelijkheids-API’s is een “Widget. ARIA biedt auteurs ook een middel om de rol van inhoud zelf te documenteren, wat op zijn beurt AT in staat stelt alternatieve navigatiemechanismen voor de inhoud te construeren die veel gemakkelijker te gebruiken zijn dan het lezen van de volledige tekst of het herhalen van een lijst met links.

Het is belangrijk om te onthouden dat het in eenvoudige gevallen de voorkeur heeft om native HTML-besturingselementen te gebruiken en deze op te maken in plaats van ARIA te gebruiken. Dat is niet opnieuw wielen uitvinden, of selectievakjes, als dat niet nodig is.

Gelukkig kan ARIA-opmaak worden toegevoegd aan bestaande sites zonder het gedrag voor reguliere gebruikers te veranderen. Dit reduceert de kosten voor het aanpassen en testen van de website of applicatie aanzienlijk.


Antwoord 5, autoriteit 3%

Ik heb een andere vraag gesteld over ARIA. Maar de inhoud ziet er veelbelovender uit voor deze vraag. wil ze graag delen

Wat is ARIA?

Als u moeite doet om uw website toegankelijk te maken voor gebruikers met verschillende browsegewoonten en fysieke handicaps, herkent u waarschijnlijk de rol en aria-*-kenmerken. WAI-ARIA (Accessible Rich Internet Applications) is een methode om manieren te bieden om uw dynamische webinhoud en toepassingen te definiëren, zodat mensen met een handicap deze kunnen identificeren en er succesvol mee kunnen omgaan. Dit wordt gedaan via rollen die de structuur van het document of de toepassing definiëren, of via aria-*-attributen die een widgetrol, relatie, status of eigenschap definiëren.

Het gebruik van ARIA wordt aanbevolen in de specificaties om HTML5-toepassingen toegankelijker te maken. Wanneer u semantische HTML5-elementen gebruikt, moet u de bijbehorende rol instellen.

En bekijk deze you tube-videovoor ARIA live.

p>

Other episodes