[Résolu] [Navigation au clavier] Pas de focus sur l'élément abbr ?

Bonsoir les Alsanautes !

Je viens de me poser une question, j'aimerais votre avis la concernant. En visitant une page à l'aide du clavier, j'ai remarqué un <div /> contenant plusieurs éléments, dont une abréviation. J'ai été assez surpris de constater que le focus n'est donné à aucun moment à cet élément. Comment, une personne naviguant à l'aide d'un clavier, peut-elle donc prendre connaissance de la signification de l'abréviation ?

Je n'ai pas (encore) vérifié sur d'autres navigateurs, mais ceci a été remarqué via Firefox 3.6b4.

Si quelqu'un pouvait m'en dire plus, je lui en serais reconnaissant. Je mets un point d'honneur à ce que chaque abréviation soit considérée comme tel, et je trouverais dommage qu'une poignée de personnes (minime ou non, là n'est pas la question) ne puisse pas en profiter.

D'avance merci à vous, et bonne nuit !
Modifié par SolykZ (06 Dec 2009 - 16:37)

Question intéressante...

En ce qui concern les lecteurs d'écran, il y a trois visions différentes
- Soit une option qui définit si les abréviations doivent être développées systématiquement lors de la lecture ou non, c'est le cas de jaws
- Soit il y a une combinaison de touches prédéfinies pour demander le développement de l'abréviation
- Soit il y a une combinaison de touches pour obtenir la liste de toutes les abréviations de lapage

Dans le contexte de la navigation au clavier, le focus ne se focalise essentiellement que sur l'élément a et les éléments de contrôle d'un formulaire (button, input, select et textarea), ainsi que sur l'élément label (auquel cas le focus se porte sur le champ de contrôle auquel l'élément label est associé). Il est donc normal que l'élément abbr soit ignoré.

L'attribut TITLE n'est globalement pas accessible au clavier, en raison de défaut d'implémentation d'UAAG dans les navigateurs actuels. C'est le cas tout aussi bien pour les ABBR, les liens A, les champs de formulaire. Le problème relève des agents utilisateurs et de leur amélioration, pas des producteurs de contenu.

Ce n'est pas une raison pour jeter le bébé avec l'eau du bain sans plus de réflexion, comme le fait l'affligeante technique WCAG2 H33 pour les TITLE de liens : on ne jette pas un bon outil parce qu'il est mal exploité, surtout au profit de bricolages qui n'apportent aucune solution aux problèmes soulevés.

En revanche, pour les sigles, abréviations etc. WCAG propose intelligemment des moyens alternatifs de communiquer à l'utilisateur la signification de ceux-ci (plein texte, lien sur, etc.)
Modifié par Laurent Denis (04 Dec 2009 - 15:17)

@Laurant : ton premier lien est raté

QuentinC a écrit :
@Laurant : ton premier lien est raté

Voici le lien correct vers la technique H33.
Modifié par Gilles (04 Dec 2009 - 08:25)

arf, désolé, corrigé, merci.

Bonsoir à tous, et merci de vos réponses !

Si j'ai bien compris, il s'agit donc d'un défaut qui incombe aux navigateurs ? Je n'ai toujours pas pris le temps de tester sous d'autres navigateurs, d'ailleurs.

J'ai jeté un œil aux liens donnés (au fait, comment faites-vous ? W3 dot com a beau être LA ressource ultime, leurs pavés sont très souvent difficiles à digérer ! J'ai jamais pu lire une page complète. ), et il est proposé d'hyperlier l'abréviation à un élément de définition :

<p>....<a href="#definition">&#12373;&#12376;&#12434;&#25237;&#12370;&#12427;</a>....</p>

<h3>&#33050;&#27880;&#65306;</h3>
<dl>
  <dt id="definition" name="definition">&#12373;&#12376;&#12434;&#25237;&#12370;&#12427;</dt>
  <dd>&#12393;&#12358;&#12377;&#12427;&#12371;&#12392;&#12418;&#12391;&#12365;&#12394;&#12367;&#12394;&#12426;&#12289;&#12354;&#12365;&#12425;&#12417;&#12427;&#12371;&#12392;&#12290;</dd>
</dl>

Seulement, dans le cas présent ils semblent utiliser ceci à titre de remplacement. Ne serait-il pas préférable de tout de même déclarer l'abréviation comme telle ?

J'imagine bien ceci, pour ma part :

<p>These are <a href="#dd_php" id="dt_php"><abbr title="PHP: Hypertext Processor">PHP</abbr></a> informations.</p>

<h3>Abbreviations:</h3>
<dl>
  <dt id="dd_php"><a href="#dt_php">PHP</a></dt>
  <dd>PHP: Hypertext Processor</dd>
</dl>

L'abréviation reste déclarée comme tel ; les utilisateurs de systèmes de pointage peuvent en lire la signification sur place tandis que les utilisateurs de clavier peuvent suivre le lien menant à l'élément de définition, puis remonter à l'endroit où ils étaient grâce au lien situé dans ce même élément. Ça charge légèrement (...) le code, mais ça me semble valable, personnellement. Qu'en pensez-vous ?

SolykZ a écrit :
J'imagine bien ceci, pour ma part :

<p>These are <a href="#dd_php" id="dt_php"><abbr title="PHP: Hypertext Processor">PHP</abbr></a> informations.</p>

<h3>Abbreviations:</h3>
<dl>
  <dt id="dd_php"><a href="#dt_php">PHP</a></dt>
  <dd>PHP: Hypertext Processor</dd>
</dl>

L'abréviation reste déclarée comme tel ; les utilisateurs de systèmes de pointage peuvent en lire la signification sur place tandis que les utilisateurs de clavier peuvent suivre le lien menant à l'élément de définition, puis remonter à l'endroit où ils étaient grâce au lien situé dans ce même élément. Ça charge légèrement (...) le code, mais ça me semble valable, personnellement. Qu'en pensez-vous ?

C'est une solution qui me semble acceptable, à ceci près que j'ajouterais un attribut title aux deux éléments a pour expliciter davantage les liens (outre que PHP est un rétro-acronyme plutôt qu'une abréviation ) :

<p>These are <a href="#dd_php" id="dt_php" title="Definition of the PHP acronym"><acronym title="PHP: Hypertext Processor">PHP</acronym></a> informations.</p>

<dt id="dd_php"><a href="#dt_php" title="Go back to reference text about the PHP acronym">PHP</a></dt>

Bonjour !

Merci pour l'idée des titres, c'est en effet beaucoup plus clair comme ça.

Par contre, il me semblait avoir lu, il y a quelques temps déjà, que l'élément <acronym /> était ou allait être déprécié ? C'est d'ailleurs pour cela que je n'employais plus que l'élément <abbr />. Aurais-je mal lu ?

SolykZ a écrit :
Par contre, il me semblait avoir lu, il y a quelques temps déjà, que l'élément <acronym /> était ou allait être déprécié ? C'est d'ailleurs pour cela que je n'employais plus que l'élément <abbr />. Aurais-je mal lu ?

En HTML 5, il est prévu que l'élément acronym disparaisse au profit du seul abbr. Mais, si tu utilises un doctype HTML 4.01 ou XHTML 1.0 ou 1.1, tu peux continuer sans problème à utiliser acronym pour baliser les acronymes.

Ah, d'accord ! Tout s'explique.

Eh bien, merci pour toutes ces informations. Je passe le sujet en résolu.

Bonne fin de semaine à tous !