TP1 : Une première page en HTML

Objectif :

Rédiger une première page en html, qui respecte les standarts du W3C. Nous utiliserons des balises pour organiser le document, les styles seront ensuite utilisés pour l'habillage final.

Matériel :

Un PC sous Linux ou Windows relié à internet.
Un Serveur Web pour déposer les pages créées ( venus ).
Un navigateur Chrome, firefox, opéra ou autre.
Un Editeur de texte ( bloc note, kedit, emac ).
Le cours HTML
la norme html 5
Le site http://www.w3schools.com/ contient un bon didacticiel et de nombreux exemples qui vous aideront à répondre aux questions.

Travail à réaliser.

Un premier document.

Dans un nouvel onglet du navigateur, visualiser la norme Html 5
Ouvrir un éditeur de texte « textedit ou blocnote ou emacs » et créer un premier document html en recopiant les lignes du document type suivant :

<!DOCTYPE html>
  <html>
		<head>
			<title> titre du document </title>
		</head>
	<body>
	<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis 
eros dolor, venenatis vitae, pretium ut, suscipit nec, lectus. Mauris 
urna. Etiam auctor lacus sit amet mauris. Nullam bibendum. Mauris vitae 
leo. Nullam arcu. In nec odio nec tellus blandit tristique. Mauris vel 
l ibero. Class aptent taciti sociosqu ad litora torquent per conubia 
nostra, per inceptos hymenaeos. Proin congue pharetra lectus. 
Suspendisse interdum eleifend nulla. Vestibulum lacinia mi nec ipsum?
</p>
	</body>
	</html>

Donner un titre à votre doument et un contenu , enregistrez le sur votre partition avec l'extension .html.
Ouvrez le document avec votre navigateur.
Où se retrouve votre titre ?
Où apparait le contenu.
Que sont devenues les balises ?
Que se passe t'il si l'on modifie la taille du navigateur ?
Comment sont interprétés les retours à la ligne dans un paragraphe ?

Structurer votre CV :

Compléter le document précédant pour réaliser votre CV, vous consulterez la norme pour avoir le détail d’une balise.

Placer un menu en haut de la page sous la forme d'une liste, pour présenter les différentes rubriques du CV ( formation, expériences professionnels, divers ..).
Utiliser les balises H1, H2, H3, H4, H5 , H6 pour hiérarchiser les différents titres.
La balise P sera utilisée pour créer des paragraphes, ul, ol et dd pour gérer des listes.
On pourra tracer une ligne de séparation avec la balise HR.
On utilisera les styles logiques STRONG et EM pour renforcer certains mots.
Quels sont les autres styles logiques utilisables et leurs effets ( addresse, citation courte, longue ...) ?

Rappel : La mise en page sera réalisée par la suite avec les feuilles de style.

Mise en ligne du document :

Le serveur web apache installé sur Venus, permet à toute personne ayant un compte Unix sur ce serveur, de disposer d’un espace de publication web.

Pour cela, il suffit d’enregistrer la première page de votre site avec le nom « index.html » dans un répertoire de votre partition sur Venus que vous nommerez public_html.
Lancez une nouvelle fenêtre de navigateur et testez votre page en l’appelant par son URL : http://venus/~nom_utilisateur/