Accueil
 COURS
 Cours Algorithmique
 Cours ASP
 Cours CSS
 Cours HTML
 Cours PHP / MySQL
 Cours Réseaux
 Cours SQL
 Cours Visual Basic
 ARTICLES
  Conception de sites
  Droit & Internet
  e-commerce
  Société
  Strategies du web
  Technologies Web
  Marketing Web
 LIVRES
  ASP/ASP.Net
  C/C++/C#
  Conception de sites
  DHTML/CSS
  Gestion de Projet
  HTML/Internet
  Java/JSP/J2EE
  JavaScript/VbScript
  Juridique
  Marketing/Stratégie
  PHP/Linux/Unix
  Réseaux
  XML/XHTML/XSL
 NETALYA RECOMMANDE
Reussir un projet de site web

Cours HTML N°4 : les liens hypertextes

Auteur : Nicolas Chu

Infinite Menus, Copyright 2006, OpenCube Inc. All Rights Reserved.
HTML (Hyper Text Markup Language) est un langage hypertexte (et hypergraphique) qui vous permet en cliquant sur un mot généralement souligné (ou une image) de vous transporter :
  • vers un autre endroit du document.
  • vers un autre fichier HTML situé sur votre ordinateur.
  • vers un autre ordinateur situé sur le Web.

Ce système d'hypertexte vous est familier car il est également utilisé par les fichiers d'aide de Windows. Ce sont ces liens qui vous permettent de surfer de page en page et qui constituent l'essence des documents HTML.

Les Liens

La syntaxe de ces liens entre plusieurs pages est simple mais entraînera de nombreux commentaires :

<A HREF="URL ou adresse">...</A>

1. Lien externe

Tout ordinateur situé sur le réseau Internet possède une adresse ou une URL (UNIVERSAL Ressource Locator). HTML permet d'accéder à toutes les machines et toutes les ressources du Net. Pour peu qu'Internet vous soit un peu familier, ce sont les adresses du type :

http://serveur/chemin.../fichier
ftp://serveur/chemin.../fichier
mailto:utilisateur@hôte

2. Lien local

L'organisation classique, et plus que conseillée, d'un site Web consiste à regrouper l'ensemble des éléments de celui-ci (fichiers htm, images, ...) dans un même répertoire. Vous pourrez ainsi "transporter" aisément votre site pour le présenter sur un autre ordinateur et ,but ultime, le charger sur un serveur. Cette façon de procéder est la plus aisée et vous évitera pas mal de problèmes. L'adresse du lien sera alors tout simplement : fichier.htm

Exemple :

- Dans l'éditeur de texte,
nous allons créer deux fichiers HTML.
  • le fichier 1.htm:
    <A HREF="2.HTM">Aller vers le document 2</A>
  • le fichier 2.htm:
    <A HREF="1.HTM">Retour au document 1</A>

Les ancres

Des liens peuvent aussi pointer vers un endroit précis du même document ou d'un autre fichier. C'est ce qu'on appelle les ancres, ancrages ou pointeurs [Anchor].

Point d'ancrage

<A NAME="***">...</A>
On nomme la cible ***

Lien vers une ancre dans la même page

<A HREF="#***">...</A>
Lien vers la cible *** lorsque celle-ci se trouve dans la même page

Lien vers une ancre dans une autre page

<A HREF="URL#***">...</A>
Lien vers la cible *** lorsque celle-ci se trouve dans une autre page

Plusieurs liens à l'intérieur d'un même document supposent que ce document présente une certaine longueur sinon une longueur certaine (et donc un temps de chargement assez long). Ainsi, on préférera généralement à cette technique le découpage d'une longue page en un ensemble de plusieurs pages de dimensions plus réduites.

Attributs de <A>

name="texte" nomme le lien. Ce nom est unique dans le document.
href="adresse" spécifie l'emplacement des ressources visées.
hreflang="fr/en/en-us/..." spécifie la langue des ressources visées.
rel="type de relation" relation avec d'autres documents
rev="type de relation" suivi de la liste d'adresse de ressources considérées comme précédentes.
charset="charset" spécifie l'encodage des caractères des ressources visées.
accesskey, shape, coords, tabindex sont abordés plus en détails plus loin.

Les balises <LINK> et <BASE>

1.<Link>

Elle apparaît dans <HEAD> et permet de spécifier les documents liés à celui en cours de consultation. Ces informations sont aussi utilisées par les navigateurs utilisant les tooltips, navigateurs oraux, ...


<LINK> sert principalement à spécifier et donner l'adresse - via les attributs TYPE="TEXT/CSS" et MEDIA="screen" - des feuilles de style s'appliquant au document (Nous le verrons plus loin)

Cet élément est en outre utilisé par les moteurs de recherche en vue de répertorier le site


<LINK TITLE="Manuel en Francais" TYPE="TEXT/HTML" REL="alternate" HREFLANG="FR" HREF="adresse">

2.<BASE>

Apparait dans <HEAD>, juste après <TITLE>, et avant tout autre élément.


Il permet de stipuler l'adresse absolue du document, ce qui permet de résoudre les éventuels conflits d'adresse relatives (href="../fichier.gif").

Attributs :

href="adresse"


target="frame" : fenêtre visée pour le chargement.

Nous vous informons que ce cours constitue une œuvre protégée en France par le Code de la Propriété Intellectuelle, et à l’étranger par les conventions internationales en vigueur sur le droit d’auteur. La violation de l’un des droits d’auteur de l’œuvre est un délit de contrefaçon. Il est donc interdit, à titre privé ou public, de reproduire, copier, vendre, revendre ou exploiter, que ce soit dans un but commercial ou purement gratuit, ce cours, sauf accord exprès et préalable de son auteur.


Google
 
 RESSOURCES GRATUITES
 Caractères spéciaux
 Code Couleurs HTML
 Compresseur images
 Générateur Méta Tags
 Références HTML
 Scripts : ASP
 Scripts : Java Scripts
 PRATIQUE / OUTILS
 Salons Informatiques
 Astuces Windows
 Offres d'Emploi Web
 Syndication Contenu
 TÉLÉCHARGEMENTS
 Utilitaires système
 Logiciels pratiques
 Jeux & démos
 INFOS SITE
 Contacts
 Mentions légales
 NewsList
 Qui sommes-nous ?
 PARTENAIRES
 Jeux et Jouets
 Murielle Cahen
 Cours d'anglais
 Droit NTIC
 Directeur Internet
 Australie