Institut Supérieur d’Informatique de Mahdia Année universitaire : 2018-2019 TPN° 1 : INITIATION HYPERTEXT MARKUP LANGAGE Matière : Développement web Elleuch Nizar Notes de Cours - Un fichier HTML est un fichier texte simple, parfaitement lisible, respectant un ensemble de convention d'écriture Un fichier HTML peut être écrit à l'aide de n'importe quel éditeur de texte simple (des éditeurs plus évolués existent également) Lorsque vous consultez un site web, les fichiers HTML (extension .htm ou .html) sont envoyés à votre navigateur et le code html est interprété sur votre machine par votre navigateur Le texte qu’on écrit dans un fichier HTML est le code html qui sera interprété par un navigateur pour visualiser le résultat. Ce code est constitué de texte et d'indications de mise en page. Ces indications sont appelées balises. - Une balise html (ou tag en anglais) respecte la syntaxe suivante : <balise> Une balise peut être seule, et son effet s'applique à l'endroit où elle se trouve, comme par exemple <br> qui sert à sauter une ligne, ou en couple balise ouvrante <balise> balise fermante </balise> pour indiquer sur quelle partie de votre code elle s'applique : son effet touche tout ce qui se trouve entre la balise ouvrante et la balise fermante. Exercice 1 1. Préparez votre espace de travail en créant un dossier « tp_html » dans lequel vous allez créer un sous dossier "tp1" qui contient à son tour un sous dossier « excercice1 ». 2. Créez en utilisant un éditeur de texte (bloc note, notePad...) votre propre document html nommé index.html. Attention à bien renseigner l'extension en .html et non en .txt 3. Pour se faire, recopiez les lignes suivantes dans votre fichier index.html : </html> <head> <title> Ma premiere page web !!</title> </head> <body> </body> </html> Puis, n’oubliez pas de sauvegarder le contenu que vous venez d’ajouter. 4. Visionnez le résultat dans votre navigateur Internet (Internet Explorer, Firefox, ...). Pour visualiser le résultat, faites un clic droit sur votre fichier index.html, choisissez ouvrir avec puis sélectionner le navigateur choisi afin d’afficher la page créée. Ajoutez du texte maintenant dans la section body et rechargez votre page dans le navigateur. Quelques premières balises simples Dans la section body de votre fichier .htm, essayez et testez les effets des balises suivantes : <b></b> <i></i> <u></u> <br> <p> <h1></h1> (changez ensuite le numéro de 1 à 5) Exercice 2 Dans le dossier "tp1", vous créez un nouveau sous-dossier que vous nommerez "exercice2". En vous basant sur l'exercice 1, vous créerez 4 pages html que vous nommerez : - index.html - presentation.html - services.html - contact.html Pour chacune des pages, vous organiserez le contenu de cette manière :
