II. Pages web : approfondissement 1. Liens et images.

Présentation au sujet: "II. Pages web : approfondissement 1. Liens et images."— Transcription de la présentation:

1 II. Pages web : approfondissement 1. Liens et images

2 a. Hyperliens Principe du lien hypertexte = principe constitutif du langage html. Une partie d’une ressource renvoie à une autre ressource. D’où la possibilité de naviguer.

3 La balise syntaxe html : balise texte du lien Le texte et l’attribut href sont obligatoires : sans source et/ou sans cible, il n’y a pas de lien ! Statistiques statistiques Code source Interprétation par le navigateur

4 Lien absolu On peut indiquer l’url complète de la ressource visée par le lien quand elle se trouve sur un serveur distant : ou sur la machine locale Pourquoi n’est-ce pas une bonne façon de travailler au sein de mes propres pages ?

5 Lien relatif vers une ressource contenue dans un répertoire de même niveau Dans accueil.html : accueil.html les expositions fr expo.htmlExpositions en cours,l'aristocrate et ses cannibalesle voyage en Océanie du comteFestetics de Tolna, 1893 - 189623 octobre 2007- 13 janvier 2008 expo.htmlExpositions en cours,l'aristocrate et ses cannibalesle voyage en Océanie du comteFestetics de Tolna, 1893 - 189623 octobre 2007- 13 janvier 2008 accueil.html les expositions accueil.html les expositions Source Cible

6 Lien relatif vers une ressource contenue dans un répertoire de niveau inférieur Dans accueil.html : accueil.html les expositions fr prog expo.htmlExpositions en cours,l'aristocrate et ses cannibalesle voyage en Océanie du comteFestetics de Tolna, 1893 - 189623 octobre 2007- 13 janvier 2008 expo.htmlExpositions en cours,l'aristocrate et ses cannibalesle voyage en Océanie du comteFestetics de Tolna, 1893 - 189623 octobre 2007- 13 janvier 2008 accueil.html les expositions accueil.html les expositions Source Cible

7 Lien relatif vers une ressource contenue dans un répertoire de niveau supérieur Dans expo.html : accueil.html les expositions fr prog expo.html retour au menu expo.html retour au menu accueil.htmlBienvenue dans lemenu principal, etc.etc. accueil.htmlBienvenue dans lemenu principal, etc.etc. Source Cible

8 Lien qui parcourt l’arborescence du site fr visiteurs prog expo.html projets expos pour 2009 expo.html projets expos pour 2009 Source projets avenir.htmlLes expositions en 2009... avenir.htmlLes expositions en 2009... Cible

9 Liens - compléments Toujours préférer les liens relatifs quand c’est possible. D’autres éléments (images) peuvent servir de support au lien. L’attribut « target » de la balise permet notamment de forcer l’ouverture dans une nouvelle fenêtre  pratique désapprouvée. On peut aussi créer des liens vers une partie d’une page grâce aux ancres. Lorsqu’on indique un répertoire, c’est le fichier index ou default qui est s’ouvre.

10 b. Images <img src="../../tvbkgnd.gif" align="right" width=50% height=120px vspace=50 hspace=50> src = «../../tvbkgnd.gif » align = « right » hspace=50 vspace=50 hspace=50 vspace=50 height=120px width= 50%