1178 sujets

Accessibilité du Web

Bonsoir à tous. (-:


J'en viens à vous demander votre avis, parce que je sèche complètement sur quelque chose qui m'est pourtant très familier, puisque je les utilise sur chacun de mes gabarits : les liens d'accès rapide.

Récemment, j'ai switché de Firefox à Chromium pour mes surfs, et je me suis tellement habitué à ce dernier qu'il me sert également lorsque je dév'. Bref, quelque chose de curieux arrive avec Chrome, et également avec IE 9 (j'ai pas testé Opéra, Safari et les IE lte 8) : lorsque je valide un lien d'accès rapide, la page défile effectivement vers sa cible, mais lorsque j'appuie sur la touche TAB pour naviguer à partir de cette partie de la page, la tabulation continue à partir de l'endroit où le lien d'accès rapide est situé.

Je ne retrouve pas ce comportement sur Firefox, et je ne comprends pas la raison.

J'ai donc une liste de liens menant vers #navigation, #content et #footer. Dans ma page, j'ai trois liens dotés pour chacun d'un ID et d'un name portant ces mêmes valeurs. Donc, à priori, c'est fait "à la bien". Mais rien n'y fait, et je sèche complètement.


Votre avis, s'il vous plait ? (-;
Modifié par SolykZ (08 Nov 2010 - 18:55)
Salut,

As-tu essayé comme suit ?
<ul>
  <li><a href="#navigation">Menu</a></li>
  <li><a href="#content">Contenu</a></li>
  <li><a href="#footer">Pied de page</a></li>
</ul>
<ul id="navigation">
  <li><!-- Menu --></li>
</ul>
<div id="content"><!-- Contenu --></div>
<div id="footer"><!-- Pied de page --></div>
Au départ, je procédais effectivement de la sorte. Mais après quelques lectures, j'ai appris que ça ne fonctionnait pas très bien sous Internet Explorer. Donc j'ai repris mes habitudes avec les liens. (-:
Il y a effectivement plusieurs syntaxes possibles, la plus simple indiquée par Victor ou bien la création d'ancres vides:
<p id="test1">
  <a href="#">Test 1</a>
</p>
<p>
  <a id="test2"></a>
  <a href="#">Test 2</a>
</p>
<p>
  <a name="test3"></a>
  <a href="#">Test 3</a>
</p>
<p>
  <a name="test4" id="test4"></a>
  <a href="#">Test 4</a>
</p>

Il faudrait pouvoir tester quelles versions passent bien dans les différents navigateurs modernes. Les articles qu'on a sur le sujet sont un peu anciens et avaient tendance à prendre en compte IE 5.5, IE5 Mac, voire Netscape 4. Smiley smile

Qui s'y colle? Smiley lol
Modifié par Florent V. (08 Nov 2010 - 22:53)
Bonjour,

La reprise de focus au clavier sous IE à toujours été chaotique.
Il faut en principe mettre un href (vide) à une ancre pour éviter tout problème.

<a name="mon_ancre" href=""></a>