Qu'est-ce que le HTML?
HTML est le langage de balisage standard pour
la création de pages Web. Il décrit la structure des pages Web en utilisant le balisage.
Dans un langage de balisage, tout contenu, qu’il s’agisse de texte, d’images ou
d’éléments multimédias les plus divers, doit être enfermés dans un élément. En
HTML, chaque élément possède un nom déterminé ;
la liste des éléments
utilisables est limitative et clairement définie dans la spécification du langage. C’est
la grande différence entre HTML et XML, langage dans lequel c’est le
programmeur qui crée ses propres éléments selon ses besoins, quelques
exceptions près, un élément a la structure suivante :
<nom_element> Contenu
</nom_element>
Les navigateurs n'émettent pas les balises
HTML mais les utilisent pour rendre le contenu.
Exemple
d’un document html
<!DOCTYPE html>
<html>
<head>
<title>Titre de la page</title>
</head>
<body>
<h1>Mon premier en-tête</h1>
<p>Ma première paragraphe.</p>
</body>
</html>
<html>
<head>
<title>Titre de la page</title>
</head>
<body>
<h1>Mon premier en-tête</h1>
<p>Ma première paragraphe.</p>
</body>
</html>
L’affichage
du page sur le navigateur
Le but d'un navigateur Web (Chrome, IE,
Firefox, Safari) est de lire des documents HTML et de les afficher.
Le navigateur n'indique pas les balises HTML
mais les utilise pour déterminer comment afficher le document:
Mon premier titre
Ma première paragraphe
1-
<! DOCTYPE html> :
C’est une déclaration qui définit ce document comme HTML5
2-<html> :
C’est l'élément racine d'une page HTML . Il
est donc le conteneur de premier niveau placé en haut de la hiérarchie de tous
les éléments du document. Il n’existe que deux éléments enfants de l’élément
<html>. Les attributs du balise html sont :
·
lang :
indique la langue utilisée par défaut
dans la page
·
dir :
indique le sens de lecture de la page , il peut prendre deux valeurs ltr (left
to right) de gauche à droite pour les langages latino ou rtl (right to left )
de droite à gauche pour les langage orientales
<html
lang="fr" dir="ltr">
<!--suite
des éléments inclus -->
</html
3-<head> :
L’élément <head> englobe un certain
nombre d’informations utiles au bon affichage de la page web. Ces informations
dites métadonnées sont contenues dans six éléments différents
qui ont chacun un rôle bien déterminé. Il s’agit
des éléments <base/>, <link />,<meta />, <script>,
<style> et <title> dont nous allons étudier les rôles respectifs :
<head>
<title>Titre
de la page</title>
<meta
http-equiv="Content-type" content="text/html;charset=UTF-8"
/>
<base
href="http://www.monsite.com" />
<link rel="shortcut icon"
type="images/x-icon" href="../images/favicon.ico"
/>
<meta
name="Author" content="Jean ENGELS" />
<script
type="text/javascript">
<!-- Scripts JavaScript -->
</script>
<style
type="text/css">
< !-- Styles CSS -->
</style>
</head>
4-<title> : il spécifie un titre pour le document
5-<body>
: il contient le contenu visible de la page
6-<h1> : il définit un grand en-tête (un titre niveau
7-<p> : il définit une paragraphe
Les éditeurs html :
On
peut écrire HTML à l'aide du Bloc-notes ou de TextEdit.il y a des
éditeurs HTML professionnels qui vous
aident à créer les pages Web et à les modifier. Cependant, pour
apprendre le langage HTML, nous vous recommandons un éditeur de texte simple
comme Bloc-notes (PC) ou TextEdit (Mac), pour mieux apprendre le HTML
Suivez les quatre étapes ci-dessous pour
créer votre première page Web avec Bloc-notes ou TextEdit
Parmis les éditeurs les plus utilsés , je cite Notepad qui est un éditeur de texte générique inclus
avec toutes les versions de Microsoft Windows qui vous permet d'ouvrir et de
lire des fichiers texte.
Lorsque
vous écrivez le document sur Notepad, et le sauvegardez avec extension html. Il
donne des couleurs aux balises et attributs différents de contenu
<!DOCTYPE html>
<html>
<body>
<h1>Titre 1</h1>
<p>Paragraphe</p>
</body>
</html>
<html>
<body>
<h1>Titre 1</h1>
<p>Paragraphe</p>
</body>
</html>
Un document HTML 5 se doit également de
respecter les règles d’inclusion des éléments les uns dans les autres, telles
qu’elles sont définies dans la spécification. En effet, elle définit la liste
limitative de tous les éléments HTML 5 utilisables et énumère ceux qui peuvent
y être inclus.
Le respect de ces contraintes
est impératif pour que le document soit déclaré conforme par le validateur. A
cet effet , on peut utiliser des validateurs qui permettent de vérifier si le
code est bien formé et conforme. On peut citer, à cet égard : http://validator.w3.org,et
http://html5.validator.nu/.
Leave a Comment