HTML - introduction

Général

HTML est l'abréviation de : Hyper-Text Markup Language.

HTML est un langage de description de document Web.

Une page HTML est un fichier de type texte portant l'extension .html ou .htm.

(exemples : Bloc-notes, Notepad, TextEdit, HtmlPad, BBedit).

Le langage HTML est composé d'une série de balises (appelées également marqueurs ou tags).
Les balises HTML sont délimitées par les caractères "<" et ">".
Les balises fonctionnent généralement par paire, une balise d'ouverture et une balise de fermeture .

Début et fin du fichier HTML :

Code:: <html> </html>

Zone d'en-tête du fichier HTML (c'est la zone de description du document Web) :

Code:: <head> </head>

Titre générique du document Web (il est affiché dans la barre de titre de la fenêtre du navigateur Web et est utilisé par les outils de recherche comme Google, Bing, Yahoo ... ) :

Code:: <title> </title>

Corps du document (correspond à la zone d'affichage du navigateur) :

Code:: <body> </body>

Se trouve dans le corps du document à chaque fois qu'on veut mettre un mot, une phrase,
un paragraphe en gras (B pour Bold en anglais) :

Code:: <b> </b>

Se trouve dans le corps du document à chaque fois qu'on veut mettre un mot, une phrase,
un paragraphe en italique (I pour Italic en anglais) :

Code:: <i> </i>

Note : il n'est pas obligatoire d'utiliser les balises gras et italiques; on peut modifier la police d'écriture avec la feuille de style CSS.

Quand on fait des modifications sur un document, il n'est pas nécessaire de l'ouvrir à
nouveau dans le navigateur, on peut simplement le réactualiser.

Code:: <p></p>

C'est la balise de paragraphe. Il peut y en avoir autant que nécessaire dans la page.

Code:: <br>

C'est la balise pour mettre à la ligne, pour insérer un retour chariot.

Code:: <h1></h1>, <h2></h2>, etc

Ce sont les balises qui permettent d'identifier les titres. Il ne peut y avoir qu'une balise h1.

Code:: <ul>

C'est la balise HTML qui définit une liste à puces.

Code:: <ol>

C'est la balise HTML qui définit une liste ordonnée.

Code:: <li>

C'est la balise HTML qui définit un élément de liste, ordonnée ou à puces.

Code:: <hr>

Employée pour insérer une ligne horizontale lors d'un changement de sujet dans le texte.

Code::

Code permettant d'insérer un commentaire, uniquement visible dans le code source.

Structurer un document HTML, c'est s'assurer :

de sa visibilité : que le document soit correctement référencé par les moteurs de
recherche,
de sa compatibilité : que le document soit correctement affiché dans les navigateurs,
de son accessibilité : que le document soit consultable par le plus grand nombre.

Balises de section

Ce sont les balises qui permettent de diviser le document en différentes parties spécifiques.

Code:: <header>

Cette balise reprend l'en-tête de la page (de "head" : "tête" en anglais).
L'en-tête comporte généralement le titre du site (à l'aide d'un titre h1), peut éventuellement
contenir un logo et des boutons de navigation.

Code:: <section>

Définit la zone dans laquelle sera traité un même sujet ou une même fonctionnalité. Par
exemple, une suite d'articles ou un contenu unique (contenu principal).

Code:: <footer>

Cette balise définit le pied de page (de "foot" : "pied" en anglais).
Dans le pied de page pourront être présentés les informations légales du site, les sources,
une navigation, des liens vers les sites de réseaux sociaux, la date de publication, des
informations à propos de l'auteur, des notes de pied de page, etc.