3ième S.I.
Sciences et Technologies de l’Informatique
CRÉATION DE SITES WEB AVEC HTML 5 ET CSS 3
Comment fonctionnent les sites web ?
Tout le monde consulte des sites web, et ceci tous les jours. Pour cela, vous lancez un
programme appelé le navigateur web en cliquant sur l’une des icônes représentées à la figure
suivante.
Avec le navigateur, vous pouvez consulter n’importe quel site web.
Mais comment fonctionne les sites web et comment en créer ?
Les langages HTML et CSS sont à la base du fonctionnement de tous les sites web. Quand
vous consultez un site avec votre navigateur, l'ordinateur se base sur ce qu'on lui a expliqué en
HTML et CSS pour savoir ce qu'il doit afficher.
Ces deux langages sont différents mais se complètent car ils ont des rôles différents :
HTML (HyperText Markup Language) : il a fait son apparition dès 1991 lors du
lancement du Web. Son rôle est de gérer et organiser le contenu. C’est donc en HTML
que vous écrirez ce qui doit être affiché sur la page : du texte, des liens, des images…
CSS (Cascading Style Sheets, aussi appelées Feuilles de style) : le rôle du CSS est de
gérer l’apparence de la page web (agencement, positionnement, décoration, couleurs,
taille du texte…). Ce langage est venu compléter le HTML en 1996.
Vous pouvez très bien créer un site web uniquement en HTML, mais celui-ci ne sera pas très
beau : l’information apparaîtra « brute ». C’est pour cela que le langage CSS vient toujours le
compléter. Pour vous donner une idée, la figure suivante montre ce que donne la même page
sans CSS puis avec le CSS.
1/3
3ième S.I. Sciences et Technologies de l’Informatique
Exp. : Pour vous donner une idée, voici ce que donne la même page sans CSS puis avec le
CSS.
HTML (sans CSS) :
HTML + CSS :
Le HTML définit le contenu (comme vous pouvez le voir, c’est brut de décoffrage !). Le CSS permet,
lui, d’arranger le contenu et de définir la présentation : couleurs, image de fond, marges, taille du
texte…
2/3
3ième S.I. Sciences et Technologies de l’Informatique
Bien sûr, le CSS a besoin d’une page HTML pour fonctionner. C’est pour cela que nous allons
d’abord apprendre les bases du HTML avant de nous occuper de CSS.
Pour simplifier la chose, on peut schématiser la relation entre ces deux langages de cette manière :
3/3