Hyperliens Les hyperliens jouent un rôle essentiel dans le référencement de nos pages et de notre site Web. Dans cette page : Types d'hyperliens Il existe trois types d'hyperliens dans le site Web de Revenu Québec. Hyperlien dans le texte L'hyperlien dans le texte affiche généralement les mêmes typographie et taille que le texte courant. Afin de le différencier de ce dernier, il est de couleur bleue contrastante et souligné. Au survol de la souris, le soulignement disparaît. Note Exemple Hyperlien qui mènera vers une autre section du site Web Fin de la note Hyperlien externe L'hyperlien externe est caractérisé par une icône à droite du libellé visant à informer l'utilisateur que le lien s'ouvrira dans un nouvel onglet. Les hyperliens doivent s'ouvrir dans un nouvel onglet lorsqu'ils mènent vers des sites externes;une page du site informationnel, lorsqu'on ne veut pas perturber le cadre de lecture de l'utilisatrice ou de l'utilisateur, qui pourrait, par exemple, être en train de consulter un guide HTML;des images faisant partie de la galerie d'images;des services en ligne;des documents avec des formats XSD et XML;une messagerie (Outlook, Hotmail, etc.) Note Exemple Hyperlien qui s'ouvrira dans un nouvel onglet Fin de la note Hyperlien définition L'hyperlien définition affiche les mêmes typographie et taille que le texte régulier. Comme l'hyperlien dans le texte, il est de couleur bleue contrastante, mais il est souligné en pointillé. Au survol de la souris, un petit point d'interrogation et la phrase suivante apparaissent : « Ce bouton ouvre une fenêtre modale contenant une définition. ». Note Exemple Hyperlien qui ouvrira une fenêtre modale Fin de la note Utilisation Les hyperliens doivent être utilisés comme élément de navigation. Pour d'autres types d'actions à poser, comme le téléchargement d'un formulaire, il faut employer le composant Boutons d'action.Ils sont généralement utilisés pour naviguer à l'intérieur d'une même page;naviguer d'une page à une autre dans notre site;naviguer vers un site Web externe;ouvrir une fenêtre modale (hyperlien définition). À éviterPour faciliter la lisibilité de notre contenu, il faut éviter d'insérer plusieurs fois les mêmes hyperliens dans une même page. En général, nous ne mettons qu'un hyperlien menant au même endroit par page écran pour éviter qu'il y ait trop de répétitions.Fin de l'exemple États État actifIl indique que l'utilisatrice ou l'utilisateur peut cliquer sur l'hyperlien. C'est l'état que les utilisatrices et utilisateurs voient le plus souvent dans une page.État actif de l'hyperlienÉtat au survolIl apparaît lorsque l'utilisatrice ou l'utilisateur survole l'hyperlien avec le curseur. Le pointeur se transforme en main pour indiquer qu'une action est possible.État au survol de l'hyperlienÉtat au focusIl ne s'affiche que lorsque l'utilisatrice ou l'utilisateur navigue au clavier. C'est un indicateur visuel qui lui permet à cette dernière ou à ce dernier de savoir où elle ou il se situe dans la page par rapport aux éléments interactifs.État au focus de l'hyperlien Libellés Le libellé d'un hyperlien peut différer du titre de la page, mais doit contenir des mots-clés correspondant à ceux du titre de la page pour que les utilisatrices et utilisateurs sachent qu'elles et ils sont au bon endroit;doit, si on utilise un verbe, s'insérer seulement sur le titre de la page Web, comme dans cet exemple : « Consulter la page Taux d'imposition ».doit de préférence contenir des mots courts, ce qui assurera une navigation plus fluide et sans embûches aux utilisatrices et aux utilisateurs, qui pourront ainsi savoir plus rapidement s'ils ont cliqué au bon endroit;doit de préférence contenir des mots courts, ce qui procurera une navigation plus fluide et sans embûches aux utilisateurs, qui seront plus rapidement en mesure de savoir s'ils ont cliqué au bon endroit;doit être appliqué uniquement sur le numéro entre parenthèses qui suit le nom d'un formulaire ou d'une publication.À éviterPour répondre aux standards d'accessibilité Web, il faut éviter de mettre des hyperliens sur des termes génériques qui ne veulent plus rien dire une fois sortis de leur contexte (p. ex : Cliquez ici ou Formulaire).Fin de l'exemple Accessibilité S'il s'agit d'un hyperlien externe, la phrase « Ce lien ouvrira un nouvel onglet » est intégrée en attribut ALT.L'hyperlien définition contient le rôle button dans le code pour aviser les utilisatrices et utilisateurs de lecteur d'écran que le comportement de l'hyperlien sera différent de celui d'un hyperlien régulier.