Anchor focus

Présentation

Le script anchor-focus.js règle un bug présent dans Chrome/Safari/IE qui perturbe le déplacement du focus après un lien ancré.

Ces navigateurs ne transportent pas le focus sur la cible du lien d’évitement lorsqu’il a été activé, la tabulation suivante ira donc sur l'élément focusable suivant le lien d'origine au lieu d'aller à l'élément focusable suivant l'ancre de sa destination, ce qui pose de gros problèmes d'accessibilité.

Plus d’informations : skip-navigation-link-not-working-in-google-chrome

Utilisation

Il n'y a rien d'autre à faire qu'insérer le sript dans les scripts du projet. À noter : scampi-twig embarque ce script par défaut.

Démo

Procédure de test :

  1. Amener le focus sur le lien « Aller au bloc 2 » puis actionner la touche Enter. La page se déplace pour placer le bloc 2 en haut de la fenêtre.
  2. Appuyer sur la touche tabulation.

Si le focus se positionne sur « un lien beta » le comportement est bien celui attendu.

Si le focus se positionne sur « un lien alpha » (situé dans le bloc 1) c'est qu'on a affaire au bug signalé et que le script de patch (anchor-focus.js) n'est pas présent.

Aller au bloc 2.

Bloc 1 : un contenu avec un lien alpha.

Bloc 2 : destination du lien « Ancre vers le bloc 2 ».

Un autre bloc comportant un lien beta.

Les informations données dans cette rubrique correspondent à la version 1.0 release candidate de Scampi, encore en développement. Pour lire la documentation de la version courante (0.2.1), référez-vous au readme du dépôt.