HTML : La Syntaxe

Les Éléments

La version 4 de HTML décrit 91 éléments. Les familles d'éléments que l'on rencontre le plus fréquemment sont :

Les Eléments de regroupement

Ne conférant pas de signification au contenu qu’ils balisent, ces éléments génériques tels que<div> ou <p> permettent d’appliquer à ce contenu des styles de présentation.

Les Images

L'élément <img/> est un élément important pour la mise en forme des pages.

Les Listes

HTML différencie les listes non ordonnées <ul> , les listes ordonnées <ol> et les listes de définition <dl>.

Les Tables

L'élément <table> qui a été souvent detourné de ses fonctionnalités initiales pour ses capacités de mise en page, doit être réservée à la présentation de données tabulaires.

Les Hyperliens

La fonctionnalité de l'élément <a> est la fonctionnalité première de HTML.

Les Formulaires

L'élément <form> permet la saisie interactive de données.

Les Scripts

L'élément <script>Permet d’associer des morceaux de programmes, généralement JavaScript ou VBScript, au document.

Les Balises

Dans le code source HTML, les éléments composant les pages, sont délimités par des balises traduction de l'anglais tags. Par exemple la très fréquente balise <p> pour paragraphe. La balise est composée du nom de l'élément encadré par les signes < et >.

Presque tous les éléments HTML commencent et se terminent par une balise et à la différence des portes dans le theâtre de vaudeville, toute balise ouverte doit être fermée. à défaut le contenu à l'aval sera perturbé. La balise de fermeture se distingue de la balise d'ouverture par une barre oblique. Consultez la liste des balises HTML.

<p> Ce texte est un paragraphe </p>

L'élément HTML se compose donc de 3 parties :

• La balise d'ouverture entre les signes < et > : <p>
• Le contenu : Ce texte est un paragraphe
• La balise de fermeture entre les signes < et > : </p>

J'ai écrit un peu plus haut "Presque tous les éléments". En effet il existe l'exception des éléments dit auto-fermants tel <br/> qui introduit un saut de ligne ou <img/> qui permet d'inclure une image ou encore <input/> qui, dans un formulaire, permet de saisir des données extérieures.
Ces éléments n'ont pas de balise de fermeture et leur balise d'ouverture est terminée par un / avant le >.

Les Attributs

Dans la version 4 de HTML, il existe 188 attributs qui permettent de préciser les propriétés des éléments HTML.
Mais attention une bonne partie de ces attributs (width, heigh, color, background, etc,...) offrent des fonctionnalités obsolètes de mise en forme des éléments html.

En vertu du principe de séparation du contenu et de l'apparence il est désormais est totalement déconseillé de les utiliser, le contrôle de la mise en forme des éléments devant être assuré par les CSS.

Il convient donc de n'utiliser que les attributs dont les propriétés sont irremplaçables, par exemple :

• Les sélecteur id (sélecteur unique) ou class (sélecteur répétable) qui permettent de lier des éléments à certaines propriétés d'une feuille de style CSS.
• L’attribut style qui permet d'introduire dans un élément des propriétés de mise en forme (Style en ligne).
• l’attribut title qui apporte une information sur le contenu d'un élément.
• L'attribut alt permet d’indiquer un contenu textuel destiné à remplacer la ressource graphique d'une image quand celle-ci ne peut être restituée.
• Les gestionnaires d’évènements onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, qui capturent les évènements générés dans l’élément pour appeler un script.
• Les attributs d’internationalisation dir et lang spécifient la direction d’écriture et la langue du contenu;

Par ailleurs, quelques éléments ont des attributs obligatoires,ainsi :

• L’élément <img/> est obligatoirement doté d’un attribut src spécifiant l’URL de la ressource graphique qu’il représente.
• L’élément <a> est doté d’un attribut href spécifiant l’adresse de la ressource html vers laquelle le lien conduit.
• Dans l’élément <form>, l’attribut action indique la cible serveur qui traitera les données après soumission.

Les règles d'écriture

L'écriture des attributs, de leur propriétés et de leurs valeurs doit se conformer à des règles strictes en particulier en ce qui concerne le respect de la ponctuation qui est essentiel pour le fonctionnement des propriétés :

• Les Propriétés doivent être ouvertes par un signe égal et encadrées entre des guillemets.
• Le couple Propriété-Valeur doit ëtre séparé par deux points.
• Les séparations entre les couples Propriété-Valeur sont assurées par des points-virgules.
• Le point-virgule final n'est pas obligatoire mais recommandé.
• Les espaces entre les signes de ponctuation sont sans incidence sur le fonctionnement.
• L'ordre d'écriture des couples Propriété-Valeur est indifférent.

Le schéma est le suivant :

<balise attribut =" propriété : valeur ; " " attribut =" propriété : valeur ; " > CONTENU <balise>

Vous trouverez ci-dessous quelques exemples :

<div id=" EnTete " style =" margin : 10px; width :800px ;" >TAGADA POUET </div>

<span style =" color : #FF00FF ; font-size : 18px ; font-weight : bold " > SOURCE </span>

<a href =" Ossature.html " target =" self " title =" L'ossature HTML " > L'OSSATURE </a>

<img src =" Images/Tarifs.gif " alt =" Nos Tarifs " name =" Tarifs " width =" 127px "/>

Les commentaires

Il est possible d'ajouter des éléments d'information dans une page web sans que ceux-ci soient affichés à l'écran grâce à un jeu de balises spécifiques, appelé balises de commentaires, ouvert par l'ensemble suivant : <!-- et fermé par -->. Voici un exemple de commentaire :

<!-- Voici un commentaire -->

Les balises de commentaires permettent de mettre en commentaire du texte, mais peuvent également servir à commenter du code HTML ou à désactiver momentanément des lignes de code pendant le travail sur un document.

Haut de Page