Quand est-il approprié d'ajouter l'attribut HTML5 "autofocus" à une page?
Pour la convivialité, il peut être utile de faire la mise au point automatique sur quelque chose comme le formulaire de saisie de recherche sur une page de recherche.
Lorsque l'objectif principal d'une page est de rechercher ou d'ajouter du contenu, il peut être approprié de supposer que c'est ce que vous voulez faire et de vous aider à y arriver le plus rapidement possible.
Dans Drupal 8 nous avons du mal avec cela ici: https://drupal.org/node/2096347
Notez que ce n'est pas seulement un problème Drupal, mais certainement quelque chose que nous examinons.
Il y a quelques grandes descriptions:
- http://www.brucelawson.co.uk/2009/the-accessibility-of-html-5-autofocus/
- http://webaim.org/blog/future-web-accessibility-html5-input-extensions/
- https://stackoverflow.com/questions/2180645/is-automatically-assigning-focus-bad-for-accessibility/2180679#2180679
Malheureusement, il n'y a pas de directives pour savoir quand utiliser correctement la mise au point automatique de HTML5.
Comme le dit @Jared "Vos utilisateurs sauront-ils qu'il y a une page avec un formulaire, et doit-il y avoir du texte descriptif à lire avant de remplir le formulaire? Je suis un lecteur d'écran et cela peut être ennuyeux d'avoir mise au point dans des champs aléatoires. Il est clair pourquoi votre mise au point se termine dans la zone de recherche Google afin que cela ne me dérange pas. Si ma mise au point était automatiquement placée dans le champ de modification des réponses à chaque fois que je consultais une question sur Stackoverflow, je serais ennuyé car Je devrais forcer mon lecteur d'écran à s'éloigner du champ du formulaire et en haut de la page. "
Mais est-ce suffisant?
Nous voulons examiner la convivialité et l'accessibilité de la mise au point automatique. La page doit pouvoir répondre aux exigences WCAG 2.0 AA.
Je n'ai que l'intuition pour étayer cela, mais l'heuristique suivante pourrait fonctionner:
Y a-t-il un point d'attention absolument sans ambiguïté sur votre page? Un domaine pour lequel vous pouvez dire avec une certitude absolue que votre utilisateur regardera dès le chargement de la page? L'élément principal de cette zone est-il un formulaire avec un élément d'entrée ou une séquence très claire?
Si la réponse est oui à tous, vous pouvez effectuer la mise au point automatique sur le premier (et de préférence, uniquement) élément du formulaire. Sinon, vous risquez de violer le principe de la moindre surprise. Si votre utilisateur est venu sur la page pour lire un article et que ses raccourcis ne fonctionnent pas parce que vous avez mis au point automatiquement la zone de recherche, c'est un échec UX.
Le formulaire en question doit être la raison la plus courante pour visiter la page, avec tous les autres cas d'utilisation loin derrière.
Vous pouvez détendre cela un peu en disant que la forme doit être dans le locus d'attention mais pas le focus. Par exemple, sur la page de résultats de Google, le cas d'utilisation principal est de revoir les résultats de la recherche, mais la zone de recherche est toujours mise au point automatique (mais sans curseur). Cela ne pose pas de gros problème, car l'utilisateur remarquera toujours que la zone de recherche change si elle tape. Si la zone de recherche était plus petite et dans la barre latérale, cela pourrait devenir un problème. Notez également que si vous faites défiler vers le bas et tapez, la page défile vers le haut pour révéler la zone de recherche pour montrer à l'utilisateur où ses actions provoquent un effet.
Ainsi, la page de résultats Google nous donne un cas Edge où l'élément autofocus ne fournit pas le cas d'utilisation du maine de la page, mais il fournit un cas d'utilisation important, et l'autofocus est mis en œuvre avec soin, pour minimiser la surprise.
Gardez à l'esprit l'accessibilité. L'autofocus peut être un énorme obstacle à l'accessibilité, mais il est également très utile dans certaines situations.
C'est utile quand il y a beaucoup de choses sur la page qu'une personne utilisant un lecteur d'écran ne voudrait pas avoir à traiter pour arriver au point du visuel actuel. Un scénario typique pour cela est un modal. Lorsqu'un modal apparaît, vous souhaiterez vous concentrer automatiquement sur ce modal afin que le lecteur d'écran sache que le modal est actuellement le focus principal.
Sinon, évitez-le pour tout ce qui est à court d'une page qui est conçue pour ne faire qu'une seule chose et une seule chose et les gens ne font qu'une seule chose. La page de recherche Google est peut-être le seul exemple public auquel je peux penser. Il existe probablement de nombreux exemples privés tels qu'un outil de données d'entreprise personnalisé avec une page de requête.