Saisie avec la souris

Aperçu : Saisie avec la souris

Il faut s’assurer que toutes les fonctions sont accessibles au moyen d’un dispositif de pointage (p. ex., souris, doigt sur un écran tactile, stylet électronique, pointeur laser). Cette section couvre deux critères de réussite de la saisie avec la souris :

• Contenu sur le survol ou cible
• Annulation du pointeur

Contenu sur survol ou cible

Le contenu supplémentaire qui apparaît quand l’utilisateur passe le pointeur ou la cible du clavier sur l’élément déclencheur (p. ex. infobulles, fenêtres contextuelles) cause souvent des problèmes d’accessibilité. L’utilisateur n’avait peut-être pas l’intention de déclencher l’interaction ou peut ne pas s’apercevoir que du nouveau contenu est apparu. Cette action peut également nuire à l’utilisateur dans la tâche qu’il cherche à effectuer.

Les aides de lecture pour malvoyants utilisant un fort grossissement ne laissent voir qu’une petite partie de l’écran à la fois. Le contenu d’une infobulle peut être rogné par la zone de lecture, ce qui oblige l’utilisateur à déplacer son pointeur pour lire le contenu supplémentaire. Dans le cas où il faut placer le pointeur ou la cible du clavier sur une zone sensible pour ouvrir un contenu supplémentaire, puis l’enlever pour le faire disparaître, les règles suivantes sont vraies :

Possibilité de rejet

Un mécanisme (habituellement la touche Esc/Échap) permet de rejeter le contenu supplémentaire sans déplacer le curseur ou la cible du clavier, sauf si le contenu supplémentaire communique une erreur de saisie ou ne cache pas ou ne remplace pas un autre contenu.

Possibilité de survol

Si le survol du pointeur peut déclencher le contenu supplémentaire, il est ensuite possible de déplacer le pointeur sur le contenu supplémentaire sans le faire disparaître.

Persistance

Le contenu supplémentaire demeure visible jusqu’à ce que le pointeur ou la cible sorte de la zone sensible, que l’utilisateur le rejette ou qu’il ne soit plus pertinent.

Le contenu pouvant être déclenché par le survol du pointeur devrait également pouvoir être déclenché par le positionnement de la cible du clavier.

Cette exigence s’applique au contenu qui apparaît en plus de l’élément déclencheur lui-même. Elle ne s’applique pas à un élément non visible, tel qu’un lien de retour à la page d’accueil qui est rendu visible par la cible du clavier (sans autre contenu que le déclencheur devenu visible).

<p>C'est un  
   <a class="a-and-tooltip" id="parent" href="introduction.html">
   lien déclencheur.
      <span id="popup" role="tooltip">
         Et ce texte donne un contexte supplémentaire à propos du lien déclencheur.
      </span>
   </a>
</p>

[role="tooltip"] {     
   display: none;     
   padding: 0.5em;     
   background:white;     
   color: black;     
   border:solid black 2px;     
   width:10em; 
}
.a-and-tooltip {   
   position: relative; 
}
[role="tooltip"] {     
   position: absolute;     
   left:0;     
   top:1em; 
}

// déclencheur et popup dans le même lien
var parent = document.getElementById('parent');
parent.onmouseover = function() {    
   document.getElementById('popup').style.display = 'block'; 
}
parent.onmouseout = function() {    
   document.getElementById('popup').style.display = 'none'; 
}
parent.onfocus = function() {    
   document.getElementById('popup').style.display = 'block'; 
}
parent.onblur = function() {    
   document.getElementById('popup').style.display = 'none'; 
}
// cacher lorsque l'on appuie sur ESC
document.addEventListener('keydown', (e) => {   
if ((e.keyCode || e.which) === 27)      
   document.getElementById('popup').style.display = 'none'; 
});

Annulation du pointage

Cette exigence vise à aider l’utilisateur à éviter les erreurs de pointage. Il peut arriver que l’utilisateur déclenche accidentellement des événements par commande tactile ou avec la souris et obtienne des résultats indésirables. Il est important de permettre à l’utilisateur d’annuler un pointage indésirable.

Un pointeur simple est une entrée de pointeur qui fonctionne avec un seul point de contact avec l'écran. Il peut s'agir d'une simple tape ou d'un clic, d'une double tape ou d'un clic, d'une pression longue ou d'un geste basé sur la trajectoire.

Pour toute fonctionnalité qui se commande par pointage unique, au moins un des énoncés suivants est vrai :

Pas d’événement de pression

L’événement de pression (sur le bouton de sélection du dispositif de pointage) n’est pas utilisé pour exécuter une partie de la fonction.

Abandon ou annulation

L’exécution de la fonction se fait à l’événement de relâchement de la sélection, et un mécanisme est prévu pour abandonner la fonction avant exécution ou pour l’annuler après exécution.

Annulation sur relâchement

L’événement de relâchement du bouton de sélection annule tout résultat de l’événement de pression.

Obligation

L’exécution de la fonction est obligatoire en réponse à l’événement de pression.

The easiest way to meet this requirement is to use the default behaviour of controls and not override that behaviour with an explicit down-event trigger. The up-event (e.g. onclick or mouseup event) is the default behaviour for most controls in any programming or markup language.

Le moyen le plus simple de répondre à cette exigence est d'utiliser le comportement par défaut des contrôles et de ne pas remplacer ce comportement par un déclencheur explicite d'événement descendant. L'événement de relâchement (par exemple, l'événement onclick ou mouseup) est le comportement par défaut de la plupart des contrôles dans tout langage de programmation ou de balisage.

Examples

Pas d’événement de pression

Utiliser un événement onclick natif en JavaScript.

Utiliser un bouton ou lien natif en HTML, iOS ou Android.

Abandon ou annulation

Rendre possible l’annulation des actions glisser-déposer.

Par exemple, lorsque l’utilisateur utilise l’action glisser-déposer pour déplacer un objet vers une cible de dépôt, il peut annuler l’action après avoir saisi l’objet en le relâchant à l’extérieur de la cible de dépôt. Une autre possibilité est qu’on peut ajouter une commande d’annulation ou un dialogue demandant la confirmation de l’action après que le dépôt de l’objet sur la cible.

Annulation sur relâchement

Voici différents contextes dans lequel on utilise les actions de type "appuyer et maintenir":

Lorsqu'une fenêtre contextuelle apparaît (ou qu'une vidéo est diffusée);

Lorsque l'utilisateur appuie sur un objet (événement descendant), mais que la fenêtre contextuelle (ou la vidéo) disparaît lorsque l'utilisateur relâche le pointeur (événement ascendant).

Essential

Clavier virtuel – le comportement attendu consiste à faire apparaître des lettres et des chiffres quand l’utilisateur appuie sur la touche (activité de pression).

Clavier virtuel à l’écran.

Ressources WCAG connexes