Qu'est-ce que HTML5, ARIA?

WAI-ARIA est une spécification définissant le soutien pour l'accès à des applications web. Il définit des tas d'extensions de balisage (la plupart du temps comme des attributs sur des éléments HTML5), qui peut être utilisé par le web, développeur de l'application pour fournir des informations supplémentaires à propos de la sémantique des différents éléments pour les technologies d'assistance comme les lecteurs d'écran. Bien sûr, pour ARIA de travail, l'adresse HTTP de l'utilisateur agent qui interprète le balisage doit soutenir l'ARIA, mais la spec est créé de telle manière à permettre à l'utilisateur final des agents d'ignorer l'ARIA-majoration spécifique en toute sécurité sans affecter l'application web de la fonctionnalité.

Voici un exemple de l'ARIA spec:

<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>

Note le role attribut sur l'extérieur <ul> élément. Cet attribut n'affectera en aucune manière la façon dont le balisage est rendu à l'écran par le navigateur; cependant, les navigateurs qui prennent en charge ARIA va ajouter un OS spécifique à l'accessibilité de l'information pour le rendu élément de l'INTERFACE utilisateur, de sorte que le lecteur d'écran peut l'interpréter comme un menu de lire à haute voix et avec suffisamment de contexte pour l'utilisateur final à comprendre (par exemple, un explicite "menu" audio allusion) et est capable d'interagir avec elle (par exemple, la voix de navigation).

C'est quoi?

WAI-ARIA est synonyme de “Web Accessibility Initiative – Accessible Rich Internet Applications”. C'est un ensemble d'attributs pour aider à améliorer la sémantique d'un site web ou une application web à l'aide de technologies d'assistance, comme les lecteurs d'écran pour les aveugles, un sens de certaines choses qui ne sont pas natifs de HTML. Les informations exposées peuvent aller de quelque chose d'aussi simple que de dire à un lecteur d'écran que l'activation d'un lien ou d'un bouton juste montré ou caché plus d'articles, de widgets complexes comme tout le menu de systèmes ou de l'arbre hiérarchique vues.

C'est obtenue par l'application de rôles et de l'état attributs HTML 4.01 ou version ultérieure balisage qui n'a pas d'incidence sur la mise en page ou de la fonctionnalité de navigateur, mais fournit des informations supplémentaires pour les technologies d'assistance.

L'une des pierres angulaires de la WAI-ARIA est le rôle de l'attribut. Il indique au navigateur de dire à la technologie d'assistance que l'élément HTML utilisé n'est pas réellement ce que l'élément nom l'indique, mais quelque chose d'autre. Alors qu'à l'origine, il n'est qu'un élément div, cet élément div peut être le récipient à une liste d'auto-complétion des éléments, dans ce cas un rôle de “zone de liste” serait approprié d'utiliser. De même, une autre div qui est un enfant de la div conteneur, et qui contient un seul élément de l'option, vous devriez alors obtenir un rôle de “option”. Deux divs, mais à travers les rôles, sens totalement différent. Les rôles sont modélisés après couramment utilisés application de bureau homologues.

Une exception à ce document sont des rôles de repère, ce qui ne change pas la signification réelle de l'élément en question, mais de fournir des informations sur ce lieu particulier dans un document.

La deuxième pierre d'angle sont WAI-ARIA états et des propriétés. Ils définissent l'état de certains natifs ou WAI-ARIA éléments tels que si quelque chose est réduit ou développé, un élément de formulaire est requis, quelque chose a un popup menu attaché ou similaires. Ce sont souvent dynamique et modifier leurs valeurs tout au long du cycle de vie d'une application web, et sont généralement manipulées via JavaScript.

Quel est-il pas?

WAI-ARIA n'est pas pour influencer le comportement du navigateur. Contrairement à un réel élément de bouton, par exemple, un div qui vous versez le rôle de “bouton” sur ne vous donne pas de clavier focalisation automatique du gestionnaire de clic lorsque l'Espace ou Entrée pressée, et d'autres propriétés qui sont indiginous à un bouton. Le navigateur lui-même ne sait pas qu'un div avec un rôle de “bouton” est un bouton, seulement son accessibilité API portion ne.

En conséquence, cela signifie que vous devez absolument mettre en œuvre la navigation au clavier, focalisation et d'autres modèles de comportement, connu depuis les applications de bureau vous-même. Vous pouvez trouver quelques Avancées ARIA techniques Ici.

Quand dois-je ne pas l'utiliser?

Oui, c'est exact, cette section vient en premier! Parce que la première règle à l'aide de WAI-ARIA est: Ne pas l'utiliser, sauf si vous devez absolument! Le moins WAI-ARIA vous avez, plus vous pouvez compter sur l'aide de code HTML widgets, mieux c'est! Il y a un peu plus de règles à suivre, vous pouvez les consulter ici.

J'ai couru quelques autres question concernant ARIA. Mais c'est le contenu semble plus prometteuse pour cette question. voudrais les partager

Qu'est-ce que ARIA?

Si vous mettez l'effort dans la prise de votre site web accessible pour les utilisateurs avec une variété de différentes habitudes de navigation et d'un handicap physique, vous aurez probablement reconnaître le rôle et l'aria-* attributs. WAI-ARIA (Accessible Rich Internet Applications) est une méthode de fournir des moyens pour définir votre contenu web dynamique et des applications afin que les personnes handicapées puissent identifier et interagir correctement avec elle. Ceci est fait par l'intermédiaire des rôles qui définissent la structure du document ou de l'application, ou par l'intermédiaire d'aria-* les attributs de la définition d'un widget de rôle, de relation, de l'état, ou des biens.

ARIA utilisation est recommandée dans les spécifications de HTML5 applications plus accessibles. Lors de l'utilisation de la sémantique des éléments HTML5, vous devez définir leur rôle correspondant.

Et voir ce you tube vidéo pour ARIA vivre.