1
Formation Certifiante Développement WEB
Présentation générale du langage
Le HTML est l’abréviation de HyperText Markup Language. C’est un langage qui permet de
décrire un contenu à l’aide de balises appelées tags en anglais. Ce n’est pas un langage de
programmation, dit autrement, ce langage est interprété par le navigateur..
Le Doctype:
Un Doctype (contraction de l'anglais document type, littéralement type de
document) est une instruction obligatoire au début des documents XML et SGML
(comme les page web) spécifiant notamment les règles de sa syntaxe
Le doctype HTML est simplifié depuis la version 5 et ne va plus évoluer pour les futures
version de HTML. Il peut être écrit en majuscule ou en minuscule.
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
2
Formation Certifiante Développement WEB
La structure d'un document HTML 5
Certains contenus sont plus complexes et nécessitent des balises décrivant plus précisément le
contenu. pour cela, il est possible d’ajouter des attributs à la balise ouvrante sous la forme de paires
(nom / valeur)
Les éléments principaux d'un document HTML sont:
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
3
Formation Certifiante Développement WEB
html : la racine du document. elle contient très souvent un attribut lang qui permet de
spécifier la langue utilisée dans le document.
● head : l'entête du document contenant toutes les méta informations du documents,
son titre et les liens vers certaines ressources externes.
● title : le titre du document à placer dans le head. Attention, bien que non visible
directement dans la page, ce titre est primordial, notamment pour le référencement
par les moteurs de recherche
● body : le corps du document contenant l'ensemble de la partie visible du document.
➔ Tous ces éléments sont uniques.
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
4
Formation Certifiante Développement WEB
Il faut noter aussi la présence d'une balise "meta" qui décrit le jeu de caractères avec
lequel le document à été écrit (charset étant la contraction de characters set en anglais).
Le plus souvent, il s'agit de l'UTF-8, un sous ensemble de l'UNICODE. Cette balise est
obligatoire également sous peine d'avoir des erreurs d'affichage, le plus souvent au
niveau des accents.
Exercice
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
5
Formation Certifiante Développement WEB
Les principales balises du HTML
1 . Les balises de type block
Un bloc (ou block en anglais) s'étale sur toute la largeur disponible et possède toujours
un saut de ligne implicite à sa fin.
Afficher un titre avec les balise h1 à h6.
Afficher un paragraphe avec la balise p.
La balise générique div.
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
6
Formation Certifiante Développement WEB
2 . Les balises de type inline
Les balises en ligne (inline en anglais) permettent d'encapsuler du contenu au sein d'un
bloc. Leur largeur est celle du texte qu'elle contiennent, il n'y a pas de saut de ligne à la fin.
Il est possible mettre des balises inline dans un bloc mais pas l'inverse.
Afficher un lien la balise a
Afficher une image avec la balise img et les attributs src et alt
Afficher des indices et des exposants avec les balises sub et sup
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5
7
Formation Certifiante Développement WEB
Afficher un saut de ligne simple avec la balise br
Afficher un bout de texte inséré avec la balise ins ou supprimé avec la balise del
La balise générique span
Exercice :
International www.karray-group.com ATB Building, Gremda Road Km 6, 3022
Consulting
Canada www.ic-canada.com #1, 1265 Graham Bvd, Montréal, H3P 2G5