Cette page HTML a été rédigée de manière à vous donner un exemple concret mais simple de page HTML.
Vous pouvez voir le code de la page avec le raccourci Ctrl + u. De plus, le raccourci Ctrl + Shift + I affiche un outil d'inspection du code.
Pour plus de lisibilité, le style de la page a été légèrement modifié. Vous pouvez afficher le type standart en cliquant .
Une page HTML est composée de texte et de balises HTML.
Une balise HTML est une commande entre des signes < et >, comme par exemple <br />.
La plupart des balises sont englobantes :
elles indiquent qu'un bout de texte a un status particulier.
Dans ce cas, une première balise indique le début du texte avec ce statut et une autre indique la fin,
avec le même nom mais commençant par /.
Par exemple, le code HTML <p>Un paragraphe.</p> indique que le texte Un paragraphe.
doit être affiché comme un paragraphe, avec un retour à la ligne avant et après.
Les balises qui n'englobent pas un texte se termine toujours par /, comme par exemple <hr />
qui affiche une grande ligne horizontale.
Toute les pages HTML doivent avoir la structure générale suivante :
<html>.
<head>.
Il doit au moins contenir le titre de la page, englobé dans la balise <title>.
Ce titre n'est pas affichée sur la page mais sur l'onglet et dans le titre de la fenêtre du navigateur.
<body>
Exemple :
<html>
<head>
<title>Le titre de la page</title>
</head>
<body>
Le contenu de la page.
</body>
</html>
Voici une liste de balises courantes.
Vous pouvez consulter la documentation en français de toutes les balises sur ce site de Mozilla.
<h1>, <h2>, <h2>, etc...
<p>
<ul>, <ol> et <li>
<em>, <strong> et <mark>
Pour insérer un lien, on utilise la balise <a>.
Le texte englobé par cette balise est le texte du lien (ce sur quoi on clique).
La page à laquelle on accède en cliquant sur le lien
doit être donnée avec le paramètre href à l'intérieur de la balise <a>.
Exemple :
Le code <a href="https://gabriel-faure.mon-ent-occitanie.fr/">lien</a> affiche un lien
dont le texte est lien
et qui amène à la page de l'ENT lorsqu'on clique dessus.
Si la page vers laquelle pointe le lien correspond à un fichier qui est dans le même dossier que la page suivante,
on peut simplement donner le nom du fichier au paramètre href.
Exemple :
Le code <a href="foo.html">lien</a> affiche un lien
qui amène à la page décrite dans le fichier foo.html.
On peut insérer une image avec la balise img.
Cette balise n'englobe pas de texte et doit donc se terminer par /.
On doit lui fournir deux paramètres : le paramètre src qui indique le fichier contenant l'image
et le paramètre alt qui décrit l'image (à l'attention des mal-voyants, par exemple).
Exemple :
Le code <img src="photo.jpeg" alt="un chaton" /> affiche l'image stockée
dans le fichier photo.jpeg dans le même répertoire que la page courante.