Vous êtes sur la page 1sur 13

Université de BATNA 2

Département d’informatique

2. HTML
2.1 INTRODUCTION À HTML
Technologies Web, M1, RSD

1
H.NOUI
H.NOUI 2020-2021
2020-2021
LANGAGES DE BALISAGE
TABLE DE MATIÈRE

1. DEFINITION
2. HISTORIQUE
3. HTML5
4. BALISE HTML
5. MODÈLE HTML
5.1 DOCTYPE
5.2 EN-TÊTE HTML
5.3 CORPS D’UN DOCUMENT HTML
5.4 Arborescence HTML

2
H.NOUI 2020-2021
HTML
DEFINITION
• HTML est le langage de balisage standard conçu
pour la création de pages Web et d'applications
Web.
• Ces balises identifient
• des éléments structurels tels que les
paragraphes, les titres, les listes ...
• des médias (graphiques, vidéos, audio) et des
formulaires à remplir, sur une page web.
• …

• L’HTML permet l'affichage de l'information indépendamment des plateformes


• Peu importe le type d’ordinateur sur lequel la page web a été créée
• Peu importe le navigateur fonctionnant sur n'importe quel système d'exploitation

• Le W3C a approuvé HTML5 pour le statut de recommandation finale à la fin de 2014.


H.NOUI 2020-2021
HTML
HISTORIQUE

H.NOUI 2020-2021
HTML
HISTORIQUE
• Le HTML5 intègre les caractéristiques du HTML et
du XHTML, ajoute de nouveaux éléments qui lui
sont propres, propose de nouvelles
fonctionnalités telles que la validation des
formulaires et la vidéo native, et se veut
rétrocompatible.
• Le W3C a approuvé HTML5 pour le statut de
recommandation finale à la fin de 2014.
• Le W3C a poursuivi son développement du HTML
et a ajouté de nouveaux éléments, attributs et
fonctionnalités dans une mise à jour du HTML5
appelée HTML 5.1.
• En 2017, HTML5.1 a atteint le statut de
recommandation finale et les travaux ont déjà
commencé sur HTML5.2. 5
H.NOUI 2020-2021
BALISE HTML
HTML
balise conteneur
1 <title>HTML Course</title>
balise d'ouverture balise de fermeture

2 attribut style="color:red"

3 balise autonome (indépendante) <br>

1. Les balises sont placées 2. La plupart des balises 3. Certaines balises sont
entre les symboles < et >. peuvent être modifiées autonomes, ou
La plupart des balises se avec des attributs qui indépendantes, et n’ont pas
présentent par paires décrivent plus de balise de fermeture.
(balise d'ouverture et précisément leurs • Ex. la balise <br> qui
balise de fermeture). objectifs. configure un saut de ligne sur
• Ces balises agissent comme une page web.
des conteneurs 6
H.NOUI 2020-2021
STRUCTURE HTML
MODÈLE HTML
• Le modèle HTML peut être divisé en trois parties :
1. DOCTYPE : Décrit le type de HTML.
2. <head> : Décrit les méta-informations sur le site.
3. <body> : Décrit le contenu réel de la page que les utilisateurs verront.

2
1

2 3

H.NOUI 2020-2021
DOCTYPE
STRUCTURE HTML
• La DTD identifie la version HTML du document.
• La déclaration de doctype, est la première ligne d'un document de page web.
La DTD pour HTML5 est : <!DOCTYPE html>
• Les navigateurs et les validateurs de code HTML utilisent les informations
contenues dans la DTD lors du traitement de la page web.

HTML5 Ancienne version d’HTML

https://validator.w3.org/

8
H.NOUI 2020-2021
STRUCTURE HTML
EN-TÊTE HTML
• L’entête <head> contient des informations
générales et des métadonnées sur la page,
4
n'est jamais visible, et indique:
1. le titre du document (le texte qui s'affiche
dans les onglets du navigateur) :
<title>Département…</title>
5
2. les fichiers CSS associés (pour le style): 1
<link rel="stylesheet" type="text/css" href=“cs.uni- 2
ba…">
3. les fichiers JavaScript associés : <script
3
type="text/javascript" … ></script>
4. le jeu de caractères utilisé (encodage du
texte) : <meta charset="utf-8">.
5. les mots-clés, les auteurs et les descriptions
: <meta name="description" content=« Université de
…">
H.NOUI 2020-2021
STRUCTURE HTML
LE CORPS D’UN DOCUMENT HTML
• Le corps contient du texte et
des éléments qui s'affichent
directement sur la page web
dans la fenêtre du navigateur,
également appelée "fenêtre de
visualisation du navigateur".
• La section « Body » a pour but
de configurer le contenu de la
page web. L'élément body
commence par <body> et se
termine par </body>.

H.NOUI 2020-2021
STRUCTURE HTML
Arborescence HTML

frères

H.NOUI 2020-2021
INTERNET
RÉFÉRENCES

• “Web Development and Design Foundations with HTML5 - 9th Edition”, Terry Ann Felke-
Morris, Ed.D, Pearson Education Inc, 2019.
• https://www.w3.org/
• http://www.javascriptkit.com/

12
H.NOUI 2020-2021
Merci
13
H.NOUI 2020-2021

Vous aimerez peut-être aussi