Ai-je besoin role=“button” sur un <button>?

Que j'ai remarqué dans tous Bootstrap est des exemples d'utilisation de button éléments, ils comprennent role="button" (et type="button"), tels que:

<div class="dropdown">
    <button id="dLabel" type="button" role="button" data-toggle="dropdown" 
     aria-haspopup="true" aria-expanded="false">
        Dropdown trigger <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    ...
    </ul>
</div>

Ne l'accessibilité des logiciels déjà savoir qu'un button élément est conçu pour agir comme un bouton? Est-il une raison je devrais inclure role="button" et/ou type="button" dans mon code?

Je ne suis pas d'utiliser l'une de ces avec bootstrap et il fonctionne très bien, mais il ne fera pas de mal à suivre les exemples de bootstrap. Je dirais avant de poster une question de cette nature pour essayer et retirer les deux champs et de le tester. l'essai et l'erreur, mon ami est un merveilleux outil d'apprentissage. 🙂

OriginalL'auteur QuasarDonkey | 2014-11-14

  1. 21

    De nombreux éléments HTML5 venir avec par défaut implicite ARIA sémantique, et explicitement la définition de ces valeurs par défaut est "inutile et n'est pas recommandé".

    À la recherche à la bouton de l'élément, vous pouvez voir qu'il a le bouton rôle par défaut.

    La mise en place de role="button" "n'est pas recommandé", mais autorisée. Il pourrait aider les plus âgés, les agents utilisateurs qui prennent en charge WAI-ARIA, mais pas le HTML5.

    OriginalL'auteur unor

  2. 11

    TL;DR Pour le cas donné, role=button devrait être précisé, car il se comporte comme un bouton à bascule. type=button doit être utilisé.

    Tous Bootstrap boutons n'utilisez pas de rôle=bouton

    Les informations contenues dans la question en précisant que tous les boutons dans le Bootstrap exemples de l'utilisation role=button est incorrect. Seuls les boutons qui, logiquement, se comportent comme des boutons à bascule sont étiquetés en tant que tels.

    À l'aide de rôle=bouton sur un élément de bouton

    Vous ne pas besoin d'utiliser role=button en général, comme le bouton éléments ont une forte natif de la sémantique. En outre, selon le ARIA note d'utilisation dans la spécification HTML5 du W3C:

    Dans la majorité des cas, la fixation d'un ARIA de rôle et/ou aria-* attribut qui correspond à la valeur par défaut implicite ARIA sémantique n'est pas nécessaire et n'est pas recommandée car ces propriétés sont déjà définies par le navigateur.

    Il y a une exception pour les boutons à bascule, ce qui est le cas dans l'exemple donné.

    Selon les Recommandations de la Table dans les normes du W3C À l'aide de WAI-ARIA en HTML:

    Langage HTML fonctionnalité: bouton

    Par défaut ARIA sémantique: rôle bouton=

    Devrait auteurs définir explicitement par défaut ARIA sémantique? NON (remarque 0a)

    Note 0a: OUI Si l'air pressé attribut est utilisé sur l'élément de bouton

    De sorte que vous devrait définir le rôle des boutons à bascule, mais pas autrement.

    Type=button sur un bouton

    Depuis la question mentionne également type=button, je vais essayer d'approfondir. Selon le la section sur les boutons dans la spécification HTML5 du W3C, l'absence de la valeur par défaut pour le type sur le bouton éléments est type=submit, dont l'activation du comportement est de soumettre le formulaire propriétaire si il en a un. Il n'y a pas d'activation du comportement associés à type=button.

    Par conséquent, type=button devrait être spécifié pour le cas donné.

    Je n'arrive pas à trouver aucune mention de l'air pressé d'exception dans le docs. Pouvez-vous confirmer que son parti et peut-être mettre à jour votre réponse?

    OriginalL'auteur QuasarDonkey

  3. 2

    La <button> tag peut être l'une des trois choses:

    1. Régulière d'un bouton qui fait quelque chose que vous spécifiez au moment de la souris (type = button).
    2. Un bouton submit qui soumet le formulaire, en cliquanttype = submit).
    3. Un bouton de réinitialisation rétablit la forme de ses valeurs initiales lorsque vous cliquez dessus (type = reset).

    Il est bon de spécifier le type que vous avez l'intention d'être utilisé, parce que différents navigateurs utilisent différentes valeurs par défaut pour les boutons.

    http://www.w3schools.com/tags/att_button_type.asp

    Le rôle n'est pas ont pour être inclus, mais c'est bien pour l'accessibilité des logiciels.

    Donc, devez-vous inclure? Non, vous n'avez pas, mais il est généralement conseillé que vous faites.

    J'ai toujours supposé que un bouton a été type="button" par défaut, mais de l'avoir fait d'autres recherches, whatwg et w3c dire que type="submit" est en fait le manque valeur par défaut.
    Je recommande la lecture de w3fools.com à la place. Qu'entendez-vous par "sympa pour l'accessibilité du logiciel"?

    OriginalL'auteur MattD

  4. 1

    Ici dire:

    Remarque: si possible, il est recommandé d'utiliser HTML natif sur les touches (et ) plutôt que le bouton rôle, en tant que natif des boutons HTML sont plus largement pris en charge par les agents utilisateurs et technologies d'assistance. Natif des boutons HTML également en charge du clavier et de se concentrer exigences par défaut, sans le besoin pour plus de personnalisation.

    Effets possibles sur les agents utilisateurs et technologies d'assistance

    Lorsque le bouton rôle est utilisé, les agents utilisateurs devraient exposer l'élément comme un bouton de contrôle dans le système d'exploitation de l'API d'accessibilité. Les lecteurs d'écran devrait annoncer le type de l'élément de bouton et de décrire son nom accessible. Le logiciel de reconnaissance vocale devrait permettre le bouton sera activé en disant "cliquez sur" suivi par le bouton du nom d'accessibilité.
    Remarque: Opinons peuvent différer sur la façon de technologies d'assistance doit gérer cette technique. Les informations fournies ci-dessus est l'un de ces avis et, par conséquent, pas normatif.

    Ensuite, vous devez l'ajouter. Dans le but de les exposer à l'utilisateur. Mais il n'est pas normatif.

    C'est principalement pour les personnes aveugles.

    OriginalL'auteur rnrneverdies

  5. 0

    Selon W3C Html5 Bouton

    La valeur manquante par défaut est le Bouton Soumettre état.

    Si l'attribut type est dans le Bouton Soumettre état, l'élément est spécifiquement un bouton de soumission.

    Sauf si vous allez utiliser les touches de soumettre un formulaire, vous devez définir explicitement type="button" que l'omission de cette, comme indiqué dans la spécification du W3C, il agira comme un bouton de soumission, va soumettre votre formulaire. Afin d'éviter d'inutiles soumet, vous devez définir explicitement type="button" à votre <button>s.

    Puisque la plupart de l'amorçage de boutons pour déclencher une fonction javascript ou un comportement similaire, pour éviter les blessures accidentelles involontaire soumettre comportement sur le code copier&coller et au nom de la normalisation avec les bonnes pratiques, type="button" et role="button" attributs sont ajoutés à <button>

    OriginalL'auteur Cemal

  6. 0

    role="button"

    Ce n'est pas obligatoire pour Bootstrap

    OriginalL'auteur Milan Panigrahi