Créer des liens en HTML

Dans cette partie du cours, voyons comment créer des liens vers des pages internes et des pages externes, c’est relativement simple. On a besoin de seulement 4 éléments

  • la balise <a> et de se fermeture </a>
  • l’attribut : href
  • la valeur
  • le contenu entre la balise ouvrante et fermante ( ce que verra l’utilisateur , le nom du lien pour faire simple )

Créer des liens vers ses propres pages

Voici un exemple, j’ai une page qui se nomme page_article.html qui se trouve dans le même dossier. Dans l’attribut href, je rentre pour valeur le nom de la page avec l’extension qui est page_article.html

<a href="page_article.html">Ma page article</a>

Résultat :

Créer des liens vers un autre site

Alors comment créer un lien vers un autre site, on va prendre l’un des sites le plus connu du monde google.com, c’est la même chose que créer un lien internet sauf qu’on peut là c’est l’adresse d’un site complet avec le http ou le https

<a href="https://www.google.com">Google.com</a>

Créer un lien vers un mail ( mailto )

C’est extrèmement simple, c’est quasiment la meme chôse que précédemment sauf qu’on va utiliser à l’intérieur de href mailto , pour traduire ça mailto = mail to = envoyer à . Ils ont donc simplifer le code en mailto, logique et simple

<a href="mailto:contact@monsite.com">Contactez-moi</a>

Créer une ancre

Alors comment fonctionne l’ancrage avec les liens hypertexte. C’est légèrement différent que de pointer vers une autre page car là on pointe sur la même page. On utlise souvent pour des tutoriaux ( on a un sommaire puis on pointe directement vers les partie de l’article pour attérir directement sur le contenu correspondant ) ou les FAQ

On utilisera l’attribut ID et lui donne un attribut pour créer le lien à la place d’un ID on utlise le signe « # » puis le même nom qu’on a désigné à l’ID

<a href="#contenu1">lien vers contenu 1</a>
<!-- mon lien avec le signe # accompagné du nom de l'ID qui est contenu1 -->

<div id="contenu1">texte aléatoire aléatoire aléatoire aléatoire aléatoire </div>

Créer un lien de téléchargement ( fichier et videos ou musique mp3 )

C’est la meme chose, si le fichier est dans mon répertoire ( hébergement ) qui se nomme mesarchives.rar

<a href="mesarchives.rar">Télécharger mes archives</a>

Exemple avec une musique au formation MP3. Le fichier portera le nom mamusique.mp3 et en nom de lien j’ai mis : « Ma musique au formation MP3 » sans les guillemets

<a href="mamusique.mp3">Ma musique au formation MP3</a>