Scribd
Importer
24 vues11 pages

Sé Quence 1 Introduction

Transféré par

ys2mncmpgr
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
24 vues11 pages

Sé Quence 1 Introduction

Transféré par

ys2mncmpgr
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
Vous êtes sur la page 1/ 11

INTRODUCTION

Introduction aux langages HTML et CSS


El hadji Mamadou NGUER Enseignant
chercheur en Informatique UGB
Chapitre 1 : Introduction

•Séquence 1
Objectifs spécifiques : A la suite de cette séquence, l’étudiant doit être capable de:
1. Retracer l’historique des langages HTML et CSS
2. Définir les concepts de base liés à HTML
3. Installer un éditeur HTML
4. Installer un serveur Web
5. Lancer une page HTML depuis un navigateur
Présentation
Qu’est ce que HTML?
• C’est le langage de balisage standard pour la création de pages Web.
• Il est l’acronyme de Hyper Text Markup Language
• Il décrit la structure des pages Web en utilisant le balisage
• Il permet de formater du texte, ajouter des graphiques, créer des liens, des formulaires, des
blocs, etc., et enregistrer le tout dans un fichier texte qu’un navigateur peut lire et afficher.
Qu’est ce que CSS ?
• Il est l’acronyme de Cascading Style Sheet (Feuilles de style en cascade)
• CSS est un langage qui décrit la présentation des documents HTML et XML.
Historique
• C’est en 1992 que Tim Berners-Lee un physicien du CERN développa
les protocoles du World Wide Web.

• Il créa ensuite le HTML, issu d’un sous ensemble du SGML en s’appuyant sur les travaux de
Ted Nelson qui furent à l’origine du terme hypertexte (1965).

• C’est en 1993 que l’explosion de l’Internet eut lieu avec la sortie du navigateur (en anglais
browser) MOSAIC du NCSA.

• Quand aux feuilles de style CSS, elles sont développées par le World Wide Web Consortium
qui a lancé la version initiale le 17 décembre 1996.

• On est actuellement à la version 5 pour HTML et la version 3 pour CSS.


Structure d’un document HTML
Exemple Structures:
.
<!DOCTYPE html>
<html> • La déclaration <!DOCTYPE html> définit que ce
<head> document est du HTML5
• L'élément <html> est l'élément racine de la page
<title>Titre de la page</title> • L'élément <head> contient des méta informations
</head> sur le document
<body> • L'élément <title> spécifie le titre du document

<h1>Ma premiere entête</h1> • L'élément <body> contient le contenu visible de


<p>Mon premier paragraphe.</p> la page
• L'élément <h1> définit un gros titre
</body> • L'élément <p> définit un paragraphe
</html>
Les balises HTML

• Les balises HTML sont des noms d'éléments entourés de crochets:


• Syntaxe : <nomelement> le contenu </nomelement>
• Les balises HTML sont normalement par paire comme <b> et </b>

• La premiere balise dans une paire est la balise de debut, la seconde balise est la
balise de fin

• La balise de fin est écrite comme la balise de début, mais avec une barre oblique
insérée avant le nom de la balise. </html>
Document HTML = Page web

• Un documents HTML est un fichier d’extension .htm ou .html décrivant une page web

• Un document HTML est aussi appelé page web

• Il contient des balises HTML et du texte brut

• Le but d'un navigateur web (comme Internet Explorer ou Firefox) est de lire les
documents HTML et de les afficher sous forme de pages Web.

• Le navigateur n'affiche pas les balises HTML mais les utilise pour interpréter le contenu
de la page:
La déclaration <!DOCTYPE>

• La déclaration <!DOCTYPE> représente le type de document, et aide les navigateurs à


afficher les pages web correctement.

• Il ne doit apparaître qu'une seule fois, en haut de la page (avant les balises HTML).

• La déclaration <!DOCTYPE> n’est pas sensible à la casse.

• La déclaration <!DOCTYPE> pour HTML5 est :

<!DOCTYPE html>
Versions HTML

• Depuis les premiers jours du web, il y a eu de nombreuses versions de HTML:

Version Année
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014
Editeurs HTML
• Les pages Web peuvent être créées et modifiées à l'aide d'éditeurs
HTML professionnels comme Dreamweaver et Visual Studio.

• Cependant, pour apprendre le langage HTML, nous recommandons


un simple éditeur de texte comme Notepad++ ou TextEdit (Mac).

• Nous croyons qu’utiliser un simple éditeur de texte est une bonne


façon d'apprendre le HTML.
• Les étapes pour créer une première page Web avec un éditeur
HTML est décrites en TP.
Serveurs et navigateurs Web
• Une page HTML créée en local peut être visualisée avec n’importe quel navigateur et
sans serveur Web.

• Cependant vous serez plus proche de la réalité en travaillant dans un serveur web local.

• Il existe plusieurs outils permettant d’avoir son propre serveur web local. On peut citer
XAMPP qui permet d’avoir facilement un serveur Web local, un serveur FTP et
un serveur de messagerie électronique.

• Il est libre et téléchargeable depuis apachefriends.org

• L’installation et la configuration de XAMPP sont décrites en TP.

Vous aimerez peut-être aussi