TechBlogSD - Tout pour le développement WordPress et WEB
Instructions WEB et WordPress, actualités, revues de thèmes et plugins

Apprenez les bases des liens hypertexte

3

Un lien ou un hyperlien est une association qui relie une page Web à une autre. Il est très important d’interconnecter vos pages afin que les utilisateurs ainsi que les moteurs de recherche puissent comprendre la pertinence de la page liée. En plus de connecter vos propres pages Web, vous devrez peut-être également créer des liens vers des sites externes pour fournir plus d’informations sur le contenu associé.

Cet article explique les bases de la structure des liens hypertexte, le type de liens et les points à prendre en compte lors de la création de liens vers des pages Web.

Structure de lien hypertexte

Un lien hypertexte se compose de deux parties simples :

  • Une URL appelée Uniform Resource Locator qui n’est rien d’autre que l’adresse de la page Web que vous souhaitez lier.
  • Texte d’ancrage qui est le texte visible par les utilisateurs dans la fenêtre du navigateur.

Apprenez les bases des liens hypertexte

Structure de lien hypertexte

Type d’hyperliens

Sur la base de l’utilisation dans une page Web, un lien hypertexte peut être classé dans l’une des catégories suivantes :

  • Lien texte
  • Lien image
  • Lien vers un fichier
  • Lien vers un identifiant de messagerie

Création d’un lien hypertexte de texte

L’essentiel de la navigation sur le site consiste en un lien hypertexte comprenant des menus et des fils d’Ariane. Afin de créer un lien hypertexte, vous devez utiliser une balise d’ancrage HTML. L’exemple de code pour créer un lien texte est le suivant :

Code

<a href="https://www.webnots.com">A Knowledge Sharing Platform for Webmasters</a>

Href est l’attribut appelé référence de lien hypertexte utilisé pour lier la ressource demandée et la ressource peut être une page Web, un fichier ou un identifiant de courrier électronique. Les utilisateurs ne verront que le texte d’ancrage dans le contenu et l’URL du lien s’affichera dans le coin inférieur droit ou gauche du navigateur (ou la barre d’état dans le cas d’Internet Explorer) lorsqu’ils déplacent la souris sur le texte d’ancrage, comme indiqué dans l’image ci-dessous.

Apprenez les bases des liens hypertexte

Exemple de lien de texte

Liens d’images

Semblable aux liens de texte, vous pouvez lier les images pour accéder à n’importe quelle autre page Web et ci-dessous se trouve l’exemple de code pour lier une image à une page Web.

A quoi ça ressemble

Apprenez les bases des liens hypertexte

Soumission de moteur de recherche

Le texte alternatif est un élément important dans les images qui sera utilisé par les moteurs de recherche pour comprendre les images. Les navigateurs Web afficheront le texte alternatif au cas où l’image n’est pas prise en charge.

Lier à un fichier

Une autre utilisation importante du lien est de connecter un texte ou une image à un fichier téléchargé sur le serveur Web. Par exemple, vous trouverez ci-dessous l’exemple de code utilisé avec la balise de bouton HTML pour créer un lien texte qui téléchargera un fichier PDF.

Code

<button> <a href="https://img.webnots.com/2014/05/Submit-Site-to-Search-Engines.pdf"> Download Site Submission Guide for Search Engines</a> </button>

Lien vers un identifiant de messagerie

Un identifiant de courrier électronique peut également être lié à un texte ou à une image pour permettre à l’utilisateur d’envoyer un courrier en cliquant sur le texte ou l’image. Voici l’exemple de code pour lier un identifiant d’e-mail à un texte. En cliquant sur le texte d’ancrage, vous ouvrirez le programme de messagerie par défaut sur votre ordinateur avec l’identifiant de référence du lien hypertexte mentionné dans l’adresse « À ».

Code

<a href="mailto:contact@webnots.com">Contact Us</a>

Couleurs par défaut des liens hypertexte

Les liens hypertexte par défaut sont affichés dans les couleurs suivantes :

Relier Couleur
Lien non visité Bleu
Lien visité Violet
Lien actif rouge

Toutes les propriétés des liens peuvent être modifiées directement dans le contenu HTML de n’importe quelle page Web ou modifiées à l’aide de CSS pour se refléter dans toutes vos pages.

La page que vous liez par défaut s’ouvre dans la même fenêtre qui peut être modifiée pour s’ouvrir dans une nouvelle fenêtre en utilisant l’attribut cible comme indiqué ci-dessous :

<a href="https://www.webnots.com" target="_blank"> A Knowledge Sharing Platform for Webmasters </a>

Source d’enregistrement: www.webnots.com
Leave A Reply

Ce site utilise des cookies pour améliorer votre expérience. Nous supposerons que cela vous convient, mais vous pouvez vous désinscrire si vous le souhaitez. J'accepte Plus de détails