Jour 15 : Définir des raccourcis clavier

Une des fonctions les plus méconnues de HTML est l'attribut accesskey pour les liens et les formulaires, ce qui permet au concepteur de sites Web de définir des raccourcis clavier pour les liens fréquemment utilisés ou les champs de formulaire. Sur Windows, vous pouvez utiliser la touche ALT + une clé d'accès ; sur Macintosh, you pouvez utiliser Contrôle + une clé d'accès. Si la clé d'accès est définie sur un lien, votre navigateur, votre navigateur suivra le lien. Internet Explorer supporte les clés d'accès depuis la version 4 et Netscape depuis la version 6. Les vieux navigateurs les ignorent simplement, sans effets secondaires dommageables.

Bien qu'il n'existe pas de standard pour l'attribution des clés aux différentes options, Certains des raccourcis claviers les plus couramment utilisés sont présentés ici : there are no standards for which keys should be assigned to which features, here are some commonly-used keyboard shortcuts:

clé d'accès 1
Page d'accueil
Clé d'accès 2
Eviter le contenu principal (le lien d'évitement de la barre de navigation)
Clé d'accès 9
Commentaires

Qui en bénéficie ?

  1. Jackie en bénificie. Quand JAWS lit un lien qui définit un accesskey, il annonce la clé d'accès également. Par exemple, le lien <a href="/" accesskey="1">Page d'accueil</a> sera lu par JAWS ainsi "lien : Page d'accueil, ALT + 1". Jackie peut mettre en évidence le lien en pressant ALT+1, et puis ensuit epresser le lien ENTER.
  2. Guillaume en bénificie. Depuis que Guillaume ne peut pas utiliser une souris de façon efficace depuis son attaque, il est dépendant de la navigation par clavier et de ses raccourcis pour se déplacer dans la page. Les clés d'accès sont une excellente façon pour lui de se rendre directement vers les liens les plus courants ou les plus utilisés. Guillaume peut utiliser ALT+1, et Mozilla suivra aussitôt le lien qui définit accesskey="1". (Note : Mozilla n'annonce pas les clés d'accès, ce qui soulève la question de la découverte des dit liens par Guillaume. Nous discuterons de ceci dans une astuce prochaine.)

Comment le réaliser : Lien vers la page d'accueil

  • Movable Type : Le gabarit pas défaut ne possède pas de lien vers la page d'accueil, vous devriez donc donner le lien de votre site web dans un lien et définir un accesskey. Cherchez dans votre gabarit le code <$MTBlogName$>et changez le ainsi :

    <a href="<$MTBlogURL$>" style="color:black; text-decoration:none" accesskey="1"><$MTBlogName$></a>

  • Radio : Cherchez dans votre gabarit le code {siteName}. Ce sera probablement dans un lien similaire à :

    <a href="<%radio.macros.weblogUrl ()%>" style="color:black; text-decoration:none"><%siteName%></a>

    Ajoutez simplement l'attribut accesskey dans le lien de cette façon :

    <a href="<%radio.macros.weblogUrl ()%>" style="color:black; text-decoration:none" accesskey="1"><%siteName%></a>

  • Blogger : Cherchez dans votre gabarit le code <$BlogTitle$>. Si celui ci se trouve dans une balise <a>, ajoutez l'attribut accesskey="1" à la balise <a>, comme dans l'exemple précédent pour Radio. Si votre <$BlogTitle$> N'estPAS présent dans la balise <a>, insérez le dans un lien de ce type (remplacez par l'adresse de votre page d'accueil):

    <a href="http://adresse/de/votre/page/accueil" style="color:black; text-decoration:none" accesskey="1"><$BlogTitle$></a>

Comment le réaliser : lien d'évitement de la navigation

Avez-vous un lien pour éviter la barre de navigation ? Si oui, donnez lui un accesskey="2".

<a class="skiplink" href="#startcontent" accesskey="2">Evitez la navigation</a>

Comment le réaliser : lien de commentaires

Avez-vous un lien vers un formulaire de commentaire ou un lien vers votre adresse e-mail ? Si oui, donnez lui un accesskey="9".

<a href="mailto:moi@example.org" accesskey="9">Envoyez-moi un mail</a>

Note : Les carnets Web Radio (weblogs) ont généralement un lien vers un formulaire de commentaire (l'icône de petite enveloppe), mais le lien est généré par une macro, vous ne serez donc pas capable d'ajouter un accesskey.

Vérifiez que les codes accesskey sont présents sur chaque page de votre site Web ; faites ces changements dans tous vos gabarits.

Approfondir

 
<< Jour 14 : Ajouter des titres à vos liens  Jour 16 : Ne pas ouvrir de nouvelles fenêtres >>  Sommaire