Apprendre le langage HTML (HyperText Markup Language)
Page 3: Balises HTML, attributs et caractères spéciaux
Toutes les pages 
Apprendre le langage HTML (HyperText Markup Language)
Page 3
Balises HTML, attributs et caractères spéciaux
Balises HTML, attributs et caractères spéciaux
Balises HTML
Les balises constituent l'élément de base du langage HTML. Chaque balise a une signification que le navigateur connait et applique au contenu. C'est comme ça que la présentation du document est effectuée.Une balise est représentée par: le chevron ouvrant + le nom de la balise + le chevron fermant. Exemple <b> ou <body>.
Il existe deux types de balises: des balises ouvrantes et des balises fermantes. Elles vont souvent ensemble de telle sorte que la balise ouvrante applique un effet au contenu qui la suit et la balise fermante cesse l'effet en question. La balise fermante se distingue par un slash (/) qui vient juste avant le nom de la balise. Exemple </b> est la balise fermante de <b> et </body> est la balise fermante de <body>.
Néanmoins, il existe des balises ouvrantes qui n'ont pas de balises fermantes associées. On les appelle des balises auto fermantes ou des balises orphelines. Ce sont des balises qui s'ouvrent et se ferment au même moment et elles appliquent leur effet à l'endroit où elles sont déclarées (et pas au contenu qui les suit comme les balises qu'on a vu ci haut). Exemple: <br>.
Il serait utile de mentionner que depuis l'apparition du standard XHTML, les noms des balises orphelines finissent par un espace suivi de slash. Exemple <br />. Mais au début de ce cours j'ai précisé que nous allons voir la syntaxe simple de HTML4 qui n'exige pas cette écriture pour ce genre de balises. Alors dans le reste de ce cours, nous écrirons les balises orphelines sans espace-slah. Cependant nous adopterons cette écriture quand nous arriverons au cours de HTML5.
Imbrication des balises
Un contenu peut subir l'effet de plusieurs balises à la fois. Si c'est le cas, alors une règle s'impose: En cas d'imbrication de plusieurs balises, la première balise ouverte est la dernière à fermer. Il faut donc fermer les balises dans l’ordre inverse de leur ouverture.Le code ressemblera à ceci:
<balise1><balise2><balise3>Contenu</balise3></balise2></balise1>
Les attributs
La plupart des balises HTML peuvent appliquer des effets différents selon les préférences du développeur. C'est comme si on peut les personnaliser à notre guise. C'est là où les attributs interviennent.Les attributs sont déclarés dans la balise ouvrante. Ils représentent des paramètres qui personnalisent la balise où ils sont définis et ils possèdent des valeurs. Une balise peut renfermer plusieurs attributs à la fois, chacun avec sa valeur.
Une balise possédant des attributs ressemble à ceci:
<balise attribut1="valeur1" attribut2="valeur2" attribut3="valeur3"...>Contenu</balise>
Exemple:
<font color="red" face="arial">Bonjour à tous</font>
La balise ouvrante <font> applique la couleur rouge et la police Arial au contenu qui la suit qui n'est rien d'autre que le message "Bonjour à tous". La balise fermante </font> cesse l'effet appliqué par la balise ouvrante du même nom.
Les attributs peuvent s'appliquer sur les deux catégories de balises qu'on a vu; les balises constituées de l'ensemble {balise ouvrante et balise fermante} et les balises orphelines.
L'ordre de déclaration des attributs n'a pas d'influence sur le résultat.
Pour que l'écriture du code HTML soit correcte il faut vérifier les points suivants:
L'ordre de déclaration des attributs n'a pas d'influence sur le résultat.
- Il ne doit pas y avoir d'espace entre le chevron d'ouverture et le nom de la balise
- Il doit impérativement y avoir un espace (ou plus) entre le nom de la balise et l'attribut
- Il doit impérativement y avoir un espace (ou plus) entre les attributs successifs
- La valeur de l'attribut doit être déclarée entre des guillemets (doubles quote ou simple quote). Cependant les navigateur peuvent tolérer l’absence des guillemets, mais votre code reste invalide du point de vue de W3C(*).
(*) Pour vérifier la validité de votre code par W3C, vous pouvez le soumettre au validateur à l'adresse validator.w3.org. Mais sachez que la majorité des grands sites sur la toile (ou presque tous) n'ont pas le code valide et pourtant il est compatible avec tous le navigateurs populaires.
La casse n'est pas vérifiée en HTML, c'est à dire que vous pouvez écrire vos balises et attributs en minuscule ou en majuscule. Bien que les développeurs ont tendance à les écrire en minuscule.
Les caractères spéciaux
HTML est constitué principalement de balises. Mais ce n'est pas tout car il y a des séquences, autres que les balises, que le navigateur reconnait et remplace par leurs significations. On appelle ces séquences: caractères spéciaux.Le code HTML des caractères spéciaux commence par le symbole "&" et fini par ";". Par exemple © signifie "©".
Le tableau suivant liste les caractères spéciaux les plus utilisés en HTML:
| Carctère | Code HTML |
| " | " |
| & | & |
| < | < |
| > | > |
| oe | œ |
| Espace | |
| £ | £ |
| © | © |
| ® | ® |
| ± | ± |
| µ | µ |
| ½ | ½ |
| Ç | Ç |
| æ | æ |
Certains caractères spéciaux comme © ou & peuvent être écrits directement sans passer par leur code HTML.
HTML ne prend pas en compte la succession d'espaces blancs, seul le premier et considéré. Pour forcer plusieurs espaces successifs il faut passer par le code HTML
Dans les pages qui suivent nous allons voir la signification des balises HTML.
HTML ne prend pas en compte la succession d'espaces blancs, seul le premier et considéré. Pour forcer plusieurs espaces successifs il faut passer par le code HTML
N'oubliez pas que nous sommes entrain de voir HTML4 pour maîtriser la syntaxe de base. Après nous migrerons vers le nouveau standard HTML5 en toute facilité.
Page 3
Balises HTML, attributs et caractères spéciaux
Balises HTML, attributs et caractères spéciaux
