IHEC Carthage Présidence Matière : Programmation web I
Niveau : 2ème année LAIG Enseignante : Ilhem Baroud
TP 1 : Le langage HTML / XHTML
A- Méta données / Formatage de texte / Listes / Liens externes
1- Créer une page HTML nommée [Link] permettant d'afficher l'aperçu ci-dessus en tenant compte
des précisions suivantes :
a. Ajouter le nom de l'auteur de la page.
b. Choisir les mots-clefs adéquats pour référencer la page.
c. Les titres " HyperText Markup Language" et "Historique du HTML" sont des titres de style
H1.
Année universitaire 2014 / 2015 1
IHEC Carthage Présidence Matière : Programmation web I
Niveau : 2ème année LAIG Enseignante : Ilhem Baroud
d. Les lignes qui soulignent les titres de style H1 sont des barres horizontales.
e. Le texte ' est le format de données conçu pour représenter les pages web' (1er parag. 1ère
phrase) doit être incliné
f. Ajouter au niveau des abréviations HTML, CSS et SGML des info-bulles détaillant les noms
détaillés des langages (HTML : HyperText Markup Language, CSS : Cascading Style Sheet et
SGML : Standard Generalized Markup Language).
g. Le contenu du paragraphe "Historique du HTML" est une liste de définitions.
2- Définir les éléments de la liste comme liens hypertextes vers les fichiers correspondants à savoir
[Link], [Link], [Link], [Link], [Link] et [Link]
B- Images / Images map / Tableaux / Liens internes / Feuilles de styles internes
1- Le titre "Site web statique" est un titre de style h1 suivi d'une barre horizontale.
2- Insérer l'image site_statique.jpg enregistrée dans le répertoire Image.
3- En cliquant sur l'image du poste client, l'utilisateur peut accéder au fichier [Link] et en
cliquant sur l'image du serveur, il peut accéder au fichier [Link]
4- Ajouter les titres de style h1 et les tableaux ci-dessous.
Année universitaire 2014 / 2015 2
IHEC Carthage Présidence Matière : Programmation web I
Niveau : 2ème année LAIG Enseignante : Ilhem Baroud
5- Définir dans la page un style qui met les titres de style h1 en bleu et centré.
6- Ajouter, au début de la page, un sommaire qui permet d'accéder aux différentes rubriques de la
page.
7- Ajouter en bas de chaque rubrique un lien Retour qui permet de revenir au sommaire de la page
Année universitaire 2014 / 2015 3
