SELFHTML/Quickbar  HTML  Liens - Hyperlinks

Construction de liens et généralités
Cette page est un document avec du texte et des informations

 Généralités sur les liens
 Schéma pour les liens en HTML
 Autres possibilités
 

Généralités sur les liens

Les liens sont une partie essentielle de tout projet hypertexte et constitue le "plus intelligent" du World Wide Web.

Avec les liens vous structurez votre projet. Si vous prévoyez par exemple un fichier HTML avec une page d'accueil pour le projet et différents fichiers pour les pages de thèmes vous avez besoin dans la page d'accueil de liens menant à toutes les pages de thèmes et dans chaque page de thème d'un lien de retour à la page d'accueil. Ce n'est que comme cela q'une collection de fichiers en vrac devient un projet hypertexte. Dans des projets plus complexes comme la présente documentation vous trouvez aussi des liens avec une signification déterminée - liens à des niveaux inférieur ou supérieur pour feuilleter liens pour changer entre des exemples d'affichage et des descriptions des liens croisés à d'autres adresses WWW etc...

Tous les liens en HTML ont la même construction. La syntaxe en est simplifiée mais cela présente aussi des inconvénients: Il n'existe pas de liens pour des tâches déterminées. Entre temps il y a bien des attributs pour de telles choses mais dans la pratique c'est à vous de décider comment vous bâtirez par exemple des liens de façon à ce que l'utilisateur voie clairement s'il s'agit d'un lien de retour à la page d'accueil, d'un lien croisé à un thème apparenté ou un lien à une toute autre adresse WWW.

Dans tous les cas il est important de choisir pour le lien un texte explicite.
  avant: est mauvais (où donc ?)
  avant à la page d'accueil (ah oui!): est meilleur

Les liens attirent aussitôt l'attention de l'utilisateur sur eux. Si vous notez des liens en plein milieu du texte, vous devez proposer des mots décrivant le contenu comme texte de lien pas de mots vides de sens.
Pour plus d'informations cliquez ici: est mauvais (de quoi s'agit-il "ici"?)
Vous pouvez obtenir des renseignements complémentaires (ah oui!): est bon

Pour des projets plus compliqués vous devez réfléchir comment permettre à l'utilisateur d'accéder intuitivement à la quantité de liens de signification différente. Un moyen astucieux est de placer un petit symbole graphique devant le lien comme c'est le cas dans la présente documentation (voir aussi  incorporer des graphiques). Grâce à des symboles explicites vous signalez aussitôt à l'utilisateur de quel genre de lien il s'agit. Les symboles graphiques ne doivent cependant pas être plus haut que le texte courant - normalement environ 10-12 Pixel.  Graphiques en tant que liens contribuent aussi souvent à une meilleure identification du lien.

Trop peu de liens rendent la navigation dans un projet difficile et démontre le peu de créativité du concepteur du projet. Trop de liens égarent l'utilisateur et peuvent lui donner "L'impression d'être perdu dans l'hyperspace" - ce qui ne donne pas non plus une bonne impression sur le concepteur du projet. Pour cette raison mettez tous les liens nécessaires à une navigation confortable et pensez aussi aux liens croisés ainsi qu'à des liens judicieux à d'autres adresse WWW. N'exagérez cependant pas la technique des liens croisés.

 

HTML2.0 Schéma pour des liens en HTML

Tous les liens en HTML ont une structure uniforme que la destination du lien soit dans le même fichier, dans un autre fichier du même projet, à une adresse WWW quelconque ou à un fichier quelconque d'un autre type sur Internet ou local sur l'ordinateur.

Schéma:

<a href="[destination du lien]">texte du lien</a>

Explication:

La pose d'un lien commence avec <a href= (a = anchor = ancre, href = hyper reference = Référence Hyper(texte)-). Derrière le signe égal vous donnez la destination du lien. Elle doit figurer entre guillemets. Derrière, le repère d'ouverture doit se terminer par >. Suit le texte qui doit être proposé comme lien à l'utilisateur (d'une autre couleur et souvent souligné dans la plupart des navigateurs). Dans notre exemple le texte est "texte du lien". Puis vient le repère de clôture </a>.

La destination d'un lien peut être:

Attention:

Entre <a href=...> et </a> vous pouvez aussi incorporer à la place du texte du lien un  graphique comme lien .

 

HTML4.0 Autres possibilités

Le repère <a> peut comporter des  attributs universels .

Si vous connaissez HTML déjà un peu mieux, essayez aussi les possibilités que vous offrent les  feuilles de style CSS. Des formatages toujours désirés se laissent très facilement réaliser avec les commandes de feuilles de style. Pour cette raison voici tout de suite les exemples correspondants:

Exemple 1:

<a href="[destination du lien]" style="text-decoration:none">
texte du lien non souligné</a>

Exemple 2:

<a href="[destination du lien]" style="text-decoration:none; 
background-color:#FFFFCC; color:#990000"> 
texte du lien non souligné sur fond de couleur</a>

Explication:

Pour les commandes qui permettent de tels formatages il ne sera pas question ici dans le détail. Pour cela il vous faut d'abord savoir comment  définir des feuilles de style. Ensuite vous serez en mesure d'utiliser les commandes de feuilles de style. Les commandes de feuilles de style montrées ici font partie des domaines suivants:
 Formatage de police
 Couleurs et images d'arrière plan


 
après: Liens du projet à l'intérieur d'un fichier HTML
avant: Tableaux et moyens de reproduction non visuels
 

SELFHTML/Quickbar  HTML  Liens - Hyperlinks

© 1998 Stefan Münz / © 2001 Traduction  Serge François, 13405@free.fr