Recommandations en matière de liens

Applies to Windows and Windows Phone

Exemple de contrôle de lien hypertexte standard

Description

Un lien hypertexte peut apparaître sous la forme de texte inséré (XAML et HTML) ou de bouton de lien hypertexte (XAML). Dans les deux cas, un lien hypertexte est une portion de texte sur laquelle l’utilisateur peut appuyer pour ouvrir une page Web dans un navigateur ou pour naviguer vers une autre page (ou une autre section dans la même page) de l’application active.

Exemple

Capture d’écran du contrôle de lien hypertexte standard

Est-ce le contrôle approprié ?

Utilisez un lien hypertexte lorsque le mode hypertexte est le bon modèle d’interaction, c’est-à-dire, que le texte réagit quand l’utilisateur appuie dessus et lui permet d’accéder à d’autres informations concernant ce texte ou en rapport avec celui-ci. La destination de la navigation est codée dans un URI (Uniform Resource Identifier) dans la propriété NavigateUri (XAML) ou la propriété href (HTML).

Un lien hypertexte qui est inséré dans du texte dynamique est mieux réalisé avec Hyperlink (XAML) ou un objet a element | a object (HTML) car vous allez bénéficier de saut de ligne automatique dans le lien hypertexte. Utilisez un HyperlinkButton (XAML) lorsque vous n’avez pas besoin de sauts de ligne ou si vous devez personnaliser les effets visuels du lien hypertexte.

Par défaut, un lien hypertexte ressemble à un lien hypertexte Web classique et fonctionne de la même façon : il s’agit de texte qui est affiché dans une couleur distincte, ou une image, sur lequel l’utilisateur peut appuyer pour déclencher la navigation. Mais vous pouvez personnaliser les effets visuels qui composent un HyperlinkButton (XAML). Lorsque l’utilisateur interagit avec le lien hypertexte, celui-ci réagit en changeant son état et donc son apparence. Les exemples d’états de lien hypertexte sont : normal, enfoncé et désactivé.

Comme présenté ci-dessous, un bouton incorporé dans une phrase mérite quelques interrogations. Si le bouton permet à l’utilisateur d’accéder à d’autres informations concernant ce texte ou en rapport avec celui-ci, envisagez plutôt un lien hypertexte. Si le bouton déclenche une autre action, songez à le placer ailleurs et remaniez le contenu du texte et du bouton.

IncorrectCorrect
Exemple d’utilisation incorrecte d’un contrôle de case à cocherExemple d’utilisation correcte d’un contrôle de case à cocher

Dans cet exemple, un bouton n’est pas le bon contrôle à utiliser pour afficher du contenu supplémentaire pour l’utilisateur, car il occupe trop d’espace et sa présence semble déplacée.

Dans cet exemple, un lien hypertexte convient car il se présente sous la même forme que le reste du texte dans la phrase.

 

Pratiques conseillées et déconseillées

  • Tenez les liens hypertexte individuels suffisamment éloignés les uns des autres pour permettre à l’utilisateur d’appuyer dessus avec précision.
  • Utilisez uniquement l’état désactivé d’un lien hypertexte si cet état est temporaire (comme d’autres processus système en cours d’exécution) ou si le lien hypertexte peut être activé par une action de l’utilisateur.
  • Utilisez la police par défaut à moins que vos instructions de personnalisation imposent d’en utiliser une autre.
  • Ajoutez une info-bulle sur chaque lien. De cette façon, si le lien est masqué par le doigt de l’utilisateur, ce dernier peut quand même voir à quoi il sert.
  • Lorsque vous créez un lien vers un site externe, placez le nom du domaine à l’intérieur de l’info-bulle et appliquez-lui une couleur de police secondaire comme style. Le fait d’ajouter le nom du domaine à l’info-bulle permet aux utilisateurs de savoir qu’ils sont sur le point d’accéder à un site externe, et ainsi de ne pas être surpris lorsqu’ils cliquent sur le lien. Cela suffit pour afficher le domaine de premier niveau.
  • Si l’utilisateur ne se préoccupe pas de savoir s’il a déjà visité un lien, appliquez un style à l’état visité de sorte que l’apparence du lien reste la même, que la page ait déjà été consultée ou non. Par défaut, le style d’un lien ayant été visité est différent de celui d’un lien qui ne l’a pas encore été. Parfois, l’utilisateur ne se préoccupe pas de savoir s’il a déjà visité un lien. C’est généralement le cas des liens qui font partie de la navigation principale de votre application.
  • Veillez à ce que le texte du lien soit concis. Si vous voulez fournir des informations supplémentaires, placez-les à l’intérieur de l’info-bulle du lien.
  • Évitez d’utiliser des liens pour effectuer des actions qui n’ont pas trait à la navigation.

Rubriques connexes

Pour les concepteurs
Recommandations en matière d’info-bulles
Pour les développeurs (applications Windows Runtime en JavaScript et HTML)
a element | a object (HTML)
Pour les développeurs (applications Windows Runtime en C#/VB/C++ et XAML)
Windows.UI.Xaml.Controls Hyperlink class
Windows.UI.Xaml.Controls HyperlinkButton class

 

 

Afficher:
© 2014 Microsoft