Académique Documents
Professionnel Documents
Culture Documents
Principe de navigation
Création locale d’un site
Administration du site à distance
Conclusion
marzais@llaic3.u-clermont1.fr
mathieu.lacroix@isima.fr
antoine.vacavant@liris.cnrs.fr
24 et 25 Avril 2006
1/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Création locale d’un site
Administration du site à distance
Conclusion
2/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Création locale d’un site
Administration du site à distance
Conclusion
Introduction au web
1 Principe de navigation
Le web
Comprendre une adresse
Affichage à l’écran
Pseudo interactivité
Le langage HTML
2 Création locale d’un site
Technologies disponibles
Outils nécéssaires
3 Administration du site à distance
Mise en ligne
Hebergement
3/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Plan
1 Principe de navigation
Le web
Comprendre une adresse
Affichage à l’écran
Pseudo interactivité
Le langage HTML
2 Création locale d’un site
Technologies disponibles
Outils nécéssaires
3 Administration du site à distance
Mise en ligne
Hebergement
4/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Vocabulaire
5/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Requête web
6/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
7/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Requête web
8/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Requête web
9/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
10/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Requête web
11/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
12/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Requête web
13/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
L’adresse
http://llaic3.u-clermont1.fr/~marzais/stage_cies/stage_cies.html
14/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
L’adresse
http://llaic3.u-clermont1.fr/~marzais/stage_cies/stage_cies.html
http:// : protocole
14/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
L’adresse
http://llaic3.u-clermont1.fr/~marzais/stage_cies/stage_cies.html
http:// : protocole
llaic3.u-clermont1.fr/ : adresse du serveur
14/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
L’adresse
http://llaic3.u-clermont1.fr/~marzais/stage_cies/stage_cies.html
http:// : protocole
llaic3.u-clermont1.fr/ : adresse du serveur
~marzais/stage_cies/ : arborescence
14/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
L’adresse
http://llaic3.u-clermont1.fr/~marzais/stage_cies/stage_cies.html
http:// : protocole
llaic3.u-clermont1.fr/ : adresse du serveur
~marzais/stage_cies/ : arborescence
stage_cies.html : fichier
14/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Remarques
Quand je tape www.google.fr, je ne demande pas de page.
15/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Remarques
Quand je tape www.google.fr, je ne demande pas de page.
Renvoie une page par défaut (index.html)
15/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Remarques
Quand je tape www.google.fr, je ne demande pas de page.
Renvoie une page par défaut (index.html)
Parfois, quand je surfe sur un site, aucun nom de page
n’apparaı̂t dans la barre d’adresses. Seul le nom du site est
présent.
15/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Remarques
Quand je tape www.google.fr, je ne demande pas de page.
Renvoie une page par défaut (index.html)
Parfois, quand je surfe sur un site, aucun nom de page
n’apparaı̂t dans la barre d’adresses. Seul le nom du site est
présent.
Il est possible de masquer les noms des pages dans la barre
d’adresse.
15/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Affichage à l’écran
16/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Affichage à l’écran
16/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
17/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
18/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
20/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
21/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
22/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
23/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Le langage HTML
24/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan Le web
Principe de navigation Comprendre une adresse
Création locale d’un site Affichage à l’écran
Administration du site à distance Pseudo interactivité
Conclusion Le langage HTML
Le langage HTML
25/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Plan
1 Principe de navigation
Le web
Comprendre une adresse
Affichage à l’écran
Pseudo interactivité
Le langage HTML
2 Création locale d’un site
Technologies disponibles
Outils nécéssaires
3 Administration du site à distance
Mise en ligne
Hebergement
26/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Technologies disponibles
27/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Technologies disponibles
28/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
But du stage
29/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Outils
Navigateurs
On a dit que selon le navigateur utilisé, le résultat pouvait être
différent.
Il convient donc d’avoir à disposition plusieurs navagateurs web.
Windows : Internet explorer, Firefox (navigateur de la suite
Mozilla), Opera...
Linux : Konqueror, Firefox, Epiphany...
Mac : Safari, Camino...
http://webstandards.org/files/acid2/test.html
Le test acid2... qui fait mal aux navigateurs
30/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Outils
Éditeurs
N’importe quel éditeur fera l’affaire (bloc note windows).
Cependant, il est bien utile parfois d’avoir un éditeur avec la
coloration syntaxique.
Nous utiliserons pendant ce stage Notepad++
Windows : Notepad++, Context...
Linux : Kate, Gedit, Kwrite, Xemacs...
Mac : Il doit en exister...
Cette liste est non exhaustive!!
Un éditeur ne nous permettra pas de faire de grandes pages web.
C’est pour commencer, afin de manipuler un peu le langage.
31/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Technologies disponibles
Création locale d’un site
Outils nécéssaires
Administration du site à distance
Conclusion
Outils
Graphiques
Les logiciels de dessin sont nombreux. Photoshop (payant), The
Gimp, Photofiltre
32/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
Plan
1 Principe de navigation
Le web
Comprendre une adresse
Affichage à l’écran
Pseudo interactivité
Le langage HTML
2 Création locale d’un site
Technologies disponibles
Outils nécéssaires
3 Administration du site à distance
Mise en ligne
Hebergement
33/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
Mise en ligne
34/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
35/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
36/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
37/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Mise en ligne
Création locale d’un site
Hebergement
Administration du site à distance
Conclusion
38/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML
Plan
Principe de navigation
Création locale d’un site
Administration du site à distance
Conclusion
Conclusion
Bilan
Principe de navigation : demande d’une page web
Création locale d’un site
Mise en ligne d’un site web
Site web
Écrire une page web n’est pas compliqué
Le html n’est pas dur non plus
Source d’information principale : Internet
39/39 Thibault MARZAIS, Mathieu LACROIX, Antoine VACAVANT Initiation au Web et à l’HTML