Mme Saoussen Maloul
FICHE PEDAGOGIQUE: Sance 1/5Production de Pages Web Plan de la
leon:Dure:Rflexions Pdagogiques:
I- Introduction
II- Cration de pages web avec Front Page1- ActivitIII-
Conception de pages web en HTML1- Balises de base2- Exemple
Application1 : cration dune page web simple laide du langage
HTML.
10 mn
30 mn
10 mn
10 mn
10 mn40 mnObjectifs de la leon:
Prsenter les diffrentes mthodes de cration de pages web.
Produire une page web laide dun diteur. Produire une page web en
langage HTML.
Mthode envisage: Notions de cours.
Aspect pratique.
Documentation:Questions Poser:
Documentation personnelle.Recherche internet. Quel sont les
avantages et les inconvnients de chacune de ces mthodes?
?
Difficults prvues:
Notion de balises dans le langage Html
Difficults rencontres:Thermes techniques:
HTML
BalisesLien Hypertexte
FICHE PEDAGOGIQUE: Sance 2/5Production de Pages Web Plan de la
leon:Dure:Rflexions Pdagogiques:
Rappel: balises de Html
III- Conception de pages web en HTML
3- Insertion dune image
4- Insertion dun lien hypertexteApplication 2: Cration dune page
web laide de Front Page.
Voir le code source de cette page.
Application 3: Cration dune page web laide du langage HTML.05
mn
15 mn
15 mn
30 mn
40 mnObjectifs de la leon:
Produire une page web laide dun diteur. Produire une page web en
langage HTML.
Mthode envisage:
Notions de cours.
Aspect pratique.
Documentation:Questions Poser:
Documentation personnelle.
Recherche internet.
Difficults prvues:
Notion de balises dans le langage Html
Insertion de lien hypertexte.
Difficults rencontres:Thermes techniques:
HTML
BalisesLien Hypertexte
1re Sance: -2 Heures-
PRODUCTION DE PAGES WEBI- Introduction:Pour produire des pages
web, on a le choix entre
Utiliser un diteur qui gnre automatiquement les pages tel que
Front Page.
crire directement le code source en langage HTML (Hyper Text
Mark up Language) qui nest pas un langage de programmation : HTML
permet simplement de spcifier l'apparence d'un document. Un fichier
HTML est un fichier texte qu'on peut ouvrir et modifier avec un
diteur quelconque. Outre le texte du document, le fichier contient
des balises qui prcisent la structure et l'apparence du
document.
II- Cration des pages web avec Front Page:Cet diteur fonctionne
en mode WYSIWYG (What You See Is What You Get), mais on peut tout
moment passer au code HTML et apporter des modifications. Activit:
Dmarrer le logiciel Microsoft Front Page et crer la page web
suivante laide de lditeur existant puis passer au mode code pour
voir le code Html correspondant.Cest ma premire page en Front
page.
Front Page est trs simple utiliser.
On peut crire en gras
Ou en italique.
III- Conception des pages en HTML:
Toute page web doit contenir un certain nombre de balises (ou
TAG).
Une balise peut prendre trois formes.
La premire, la plus simple, un nom de balise encadr par les
signes infrieur et suprieur : Ce sera le cas des balises BR ou HR
Dans un deuxime temps, la balise peut porter sur une partie prcise
du document, elle doit s'ouvrir et se refermer : texte concern Le
signe / annonce la balise fermante. Enfin, il peut tre ncessaire de
prciser le comportement de la balise, cela se fait avec des
attributs, selon la syntaxe suivante :
texte concern
B Gras
I italique
U Soulign
S Barr
BIG plus gros
SMALL plus petit
FONT changement de police, taille et couleur
H1 titre de niveau 1
1. Balises de base
EMmettre du texte en avant
centerpour centrer
SUBun indice
SUPun exposant
BRpassage la ligne
Pparagraphe
HRtirer un trait
IMGinsrer une image
Il est possible en HTML de dfinir diffrents types de listes
:
des listes non ordonnes (balise UL) ;
des listes ordonnes (balise OL) ;
des listes de dfinition (balise DL).
2. Exemple:
Exemple Simple
< /HEAD >
HTML est Simple apprendre < /H1 > Ce titre est plus
petit
Bienvenue au mode HTML
Cest le premier paragraphe Ligne 1
- Ligne 2
Cest le deuxime paragraphe
