ALL HTML - Thèmes - HTML : Liens hypertexte

Focus - 20 Août 2008
Devenez "membre" de ALL HTML et faites partie d'une vraie communauté de passionnés et/ou de professionnels du développement sur Internet.
L'accès membre est gratuit et vous permet d'accéder à des fonctionnalités complémentaires :
- accéder à l'annuaire des 44 000 membres,
- poster des messages dans les forums,
- utiliser la messagerie interne,
- bénéficier d'offres négociées...).
Alors n'attendez-plus!

Inscrivez-vous dès à présent !

HTML

Liens hypertexte

1. Attributs de <a>
La balise <a> permet d'établir un lien hypertexte (l'essence même du Web), à l'intérieur même de votre document vers un autre document, ou encore vers l'extérieur (vers un autre site Web). Ses attributs principaux sont :
- href : Permet d'indiquer la source du document (relative ou absolue)
- target : Permet de définir la source d'un cadre comme document (dans la cas d'une frame)
- style : Permet de spécifier une feuille de style
- title : Permet de spécifier une description du lien (identique à l'attribut ALT pour une image et uniquement avec Internet Explorer)

2. Liens internes (même page)
Exemple : <a href="page.html">Page</a>

Les liens internes permettent de se déplacer à l'intérieur d'un fichier HTML, sans que le visiteur soit obligé de faire "scroller" la fenêtre. Le visiteur va donc cliquer sur un lien et il sera amené vers l'ancre. Pour cela deux étapes sont nécessaires : Définir la cible d'un lien (l'ancre) et associer ce même lien à cette ancre.

3. Définir la cible d'un lien (l'ancre)
Exemple : <a name="top"></a>

Il n'est pas nécessaire, dans ce cas précis, de mettre un texte ou une image, entre les balises d'ouverture et de fermeture (le nom ne doit pas contenir ni d'espaces, ni d'accents, ni de caractères spéciaux).

4. Associer un lien à une ancre
Exemple : <a href="#top">top</a>

5. Liens internes (pages différentes)
a ) Lien vers une page située sans le même répertoire
Exemple : <a href="nom.htm">Cliquez ici</a>

b ) Lien dans un répertoire différent
Exemple : <a href="sujet/nom.htm">Cliquez ici</a>

c ) Lien dans un même répertoire et vers une ancre d'une autre page
Exemple : <a href="nom.htm#top">Cliquez ici</a>

d ) Lien dans un répertoire différent et vers une ancre d'une autre page
Exemple : <a href="sujet/nom.htm#top">Cliquez ici</a>

6. Liens externes
Les liens externes commencent comme les autres liens, c'est à dire avec la balise <a href="...."> Par contre suivant le protocole, le reste de la syntaxe varie.

a ) Lien externe vers un site http
Exemple : <a href="http://www.allhtml.com">Découvrez ALL HTML</a>

b ) Lien externe vers un serveur FTP
Exemple : <a href="ftp://ftp.allhtml.com">FTP ALL HTML</a>

c ) Lien externe vers un serveur de news (Attention pour que ce lien soit valide il faut que le visiteur soit abonné à ce serveur de news)
Exemple : <a href="news:news.site">Serveur de news</a>

Note : Avec un lien externe vous pouvez également proposer un fichier (.exe ou .zip) en téléchargement
Exemple : <a href="util.exe">Cliquez ici pour télécharger le fichier</a>

7. Lien e-mail
Vous pouvez créer un lien e-mail pour que la messagerie paramètrée par défaut du visiteur se lance automatiquement. Attention tout de même : ce lien ne marche pas avec les premières versions de Netscape et d'I.Explorer. Il possède plusieurs attributs dont : ?subject= pour définir un sujet (ou objet) automatiquement, ce qui est très pratique pour trier votre courrier par le biais de votre logiciel classique.

a ) Lien e-mail sans sujet
Exemple : <a href="mailto:nom@provider.com">nom@provider.com</a>

b ) Lien e-mail avec sujet (ici "renseignement")
Exemple : <a href="mailto:nom@provider.com?subject=renseignement">nom@provider.com</a>

c ) Lien e-mail avec sujet, et texte dans le corps du message
Exemple : <a href="mailto:nom@provider.com?subject=renseignement&body=Votre message">nom@provider.com</a>

d ) Lien e-mail avec sujet, envoyé à 2 personnes (dont une en CC)
Exemple : <a href="mailto:nom@provider.com?cc=nom2@provider2.com&subject=renseignement">nom@provider.com</a>

e ) Lien e-mail avec 2 personnes (dont une en CCI ou BCC)
Exemple : <a href="mailto:nom@provider.com?bcc=nom2@provider2.com&subject=renseignement">nom@provider.com</a>

8. Récapitulatif

Note : La balise de fermeture </a> est bien entendu obligatoire.

Liens	Exemples
Lien interne départ (même page)	<a href="#top">
Lien interne arrivée (même page)	<a name="top">
Lien interne (page différente)	<a href="index2.htm">
Lien externe	<a href="http://www.allhtml.com">
Lien e-mail	<a href="mailto:webmaster@allhtml.com">
Lien vers news	<a href="news:news.multimania.com">
Lien vers serveur ftp	<a href="ftp://ftp.multimania.com">
Lien vers serveur gopher	<a href="gopher://gopher.site.com">
Lien vers Telnet	<a href="telnet://bbs.gateway.com">
Lien vers serveur Wais	<a href="wais://wais.base.com">

Recommander ALL HTML
Si vous appréciez ce site,
n'hésitez pas à le faire
découvrir à vos ami(e)s...

Cliquez ici