Cours-IntProg

Tebib - Phil

Le téléchargement nécessite un accès à la bibliothèque YouScribe
Tout savoir sur nos offres

5 pages

Français

Le téléchargement nécessite un accès à la bibliothèque YouScribe
Tout savoir sur nos offres

A propos
Informations
Extrait

Description

Ainsi la couleur www.u-picardie.fr nom du serveur! rouge de ce texte a pour code: #C7050E.
Pour avoir une idée de quelques /~philippe/---/---/ cheminement dans possibilités, consultez le Tableau de l’arborescence des dossiers!couleurs .

!---.html nom du ﬁchier (page Html)!Ph Moreau! L1-STS-Internet et Programmation! 30! Ph Moreau! L1-STS-Internet et ...

Sujets

informatique

Informations

Publié par	Tebib
Nombre de lectures	66
Langue	Français

Extrait

L1 - STS - Mention Informatique - Internet et Programmation!
Le Langage HTML! Le Langage HTML : ﬁnalité!
Finalité:! Les références aux différentes pages se font
à l’aide d’adresses appelées URL!Déﬁnir un langage permettant d’élaborer des
sites Web, c’est à dire un ensemble de Uniform Ressource Locator!
pages web (ou pages Html) organisées (de (Localisateur de Ressources Uniformes)!
façon logique) sous forme de graphe.!
= Identiﬁant de Ressources Html!
La transition entre les pages (ou navigation) Exemple:!
s’effectue grâce aux Liens HyperText http://www.u-picardie.fr/~philippe/---/---/ ---.html!
(références à d’autres pages)!
Ph Moreau! L1-STS-Internet et Programmation! 28! Ph Moreau! L1-STS-Internet et Programmation! 29!
Le Langage HTML : ﬁnalité! Le Langage HTML : Exemple de «"source"» !
Exemple de morceau de texte en HTML!
http:// protocole utilisé (autre exemple ftp)! <DL> <DT> Ainsi la couleur 
www.u-picardie.fr nom du serveur! rouge de ce texte a
pour code: #C7050E. <DT> Pour avoir une idée de quelques /~philippe/---/---/ cheminement dans
possibilités, consultez le <A HREF=”TabCoul.html”> Tableau de l’arborescence des dossiers!
couleurs </A> .
<DT>  </DL>!
---.html nom du ﬁchier (page Html)!
Ph Moreau! L1-STS-Internet et Programmation! 30! Ph Moreau! L1-STS-Internet et Programmation! 31!
Ph Moreau! 1!L1 - STS - Mention Informatique - Internet et Programmation!
Le langage Html : Objectif! Le langage Html : Généralités!
•! Pour réaliser la présentation d’un texte,
Langage !
le langage HTML utilise des TAGS (ou
délimiteurs ou balises). !
•! Pour apporter une modiﬁcation à une Vocabulaire!
portion de texte, vous devez, dans le cas
général, encadrer (baliser) cette portion
de texte entre deux balises.!Règles de grammaire!
(règles d’écriture: très simple)!
Ph Moreau! L1-STS-Internet et Programmation! 32! Ph Moreau! L1-STS-Internet et Programmation! 33!
Le langage Html : Généralités! Le langage Html : Généralités!
•! Par exemple, pour souligner la portion de •! U est alors le nom de la balise et l’on
texte Il fait beau ce matin, et la faire s’aperçoit que ce nom est répété dans le
apparaître, sous la forme :Il fait beau ce délimiteur de ﬁn précédé du signe /.!
matin, pour les lecteurs de votre page, il vous •! Ceci correspond à une sorte de parenthèsage,
sufﬁra d’écrire: ! et le balisage avec deux délimiteurs se
présentera sous la forme: <nomBALISE> •! Il fait beau ce matin!
portion de texte </nomBALISE>!
Ph Moreau! L1-STS-Internet et Programmation! 34! Ph Moreau! L1-STS-Internet et Programmation! 35!
Ph Moreau! 2!L1 - STS - Mention Informatique - Internet et Programmation!
Le langage Html : Généralités : Remarques! Le langage Html : Généralités : Remarques!
•! Dans certaines balises on peut adjoindre un (ou
•! si TOTO et TITI sont deux noms de balises on plusieurs) attribut. Celui-ci permet de préciser une
ne pourra jamais écrire: <TOTO> texte1 autre action à exécuter sur la portion de texte. Dans
<TITI> texte2 </TOTO> texte3 </TITI> ! ce cas le balisage se présentera sous la forme:
<nomBALISE Attribut=valeur> portion de texte </•! Il faudra écrire: <TOTO> texte1 <TITI>
nomBALISE> !
texte2 </TITI> texte3 </TOTO> !
•! Dans certains cas, nous verrons également qu’il
•! Exemple: Il fait beau ce sufﬁt d’une seule balise pour agir sur le texte à un
moment précis (on trouvera alors dans le texte matin!
<nomBALISE> ou <nomBALISE/>). !
•! Qui donnera à l’afﬁchage: Il fait beau ce •! Le nom des balises peut être écrit, indifféremment,
matin ! en majuscules ou minuscules : équivaut à ." !
Ph Moreau! L1-STS-Internet et Programmation! 36! Ph Moreau! L1-STS-Internet et Programmation! 37!
Le langage Html : Généralités : caractères spéciaux!Le langage Html : Généralités : Remarques!
•! Les normes HTML utilisent le code ASCII •! «"décodage"» des caractères spéciaux!
standard pour l’interprétation des caractères •! Les caractères spéciaux sont repérés (par les
(Rmq: on peut spéciﬁer l’utilisation d’autres codes).! navigateurs) avec l’apparition de & (et
commercial) et terminé par ; (point virgule)!•! ASCII standard (Code sur 7 bits)!
•! ===> pas de caractère accentué. ! Format des lettres accentuées!
•! Ainsi pour coder un caractère accentué, il faut
&xaccent;!taper une combinaison de caractères
spéciﬁque. !
•! Exemple: Le é se code é! Lettre à accentuer! Mention de l’accent!
Ph Moreau! L1-STS-Internet et Programmation! 38! Ph Moreau! L1-STS-Internet et Programmation! 39!
Ph Moreau! 3!#
#
L1 - STS - Mention Informatique - Internet et Programmation!
Le langage Html : Généralités : Le langage Html : Généralités : caractères spéciaux!
autres codes spéciﬁques!
•! Les accents usuels!
•! Les couleurs!Aigu : ’ : acute!
•! Pour coder les couleurs (texte, cellule de tableau, Grave : ‘ : grave!
fond de page, etc…) on utilise le principe de Circonﬂexe : ^ : circ!
description de la couleur dit codage RVB.!
Tréma : ¨ : uml!
•! Autres caractères! Le codage se fait sur 3 Octets:!
Le premier donne l’intensité de Rouge!& : &! < : < ! > : >! Etc…!
Le deuxième l’intensité de Vert!Important : Un ensemble de plusieurs caractères
Et le troisième l’intensité de Bleu!«"espace"» sera remplacé par un seul espace dans un
navigateur. Pour «"forcé"» l’espace on insère:  !
Ph Moreau! L1-STS-Internet et Programmation! 40! Ph Moreau! L1-STS-Internet et Programmation! 41!
Le langage Html : Généralités : Le langage Html : Première Page!
autres codes spéciﬁques!
Un jeu de 4 couples de balises !•! Chaque intensité de couleurs est indiquée en
hexadécimale (pour chaque octet ---> deux chiffres
en hexadécimal)! <HTML>...</HTML> !
•! La couleur est précédée de #! marquent le début et la ﬁn du document !
<HEAD>...</HEAD> !#octetoctetoctet!
marquent l’entête de la page. !
Exemples!
<TITLE>...</TITLE> (dans Head) !
#FFFFFF! #FF0000! #00FF00! #0000FF! #000000! permettent de donner un titre à la page!
blanc! Rouge! vert! bleu! noir! <BODY>...</BODY> !
balisent le corps du document!
Ph Moreau! L1-STS-Internet et Programmation! 42! Ph Moreau! L1-STS-Internet et Programmation! 43!
Ph Moreau! 4!L1 - STS - Mention Informatique - Internet et Programmation!
Le langage Html : Première Page! Le langage Html : Première Page!
Remarques!
<HTML> !
Dans la balise <HEAD>. On pourra trouver, une autre
<HEAD> !
balise (ou directive) <META> qui permet de mettre <META NAME=”AUTHOR” CONTENT=”MOI”> !
dans le document des informations qui seront lues par <TITLE>!
le serveur, le navigateur mais pas visualisées. Ces premier titre!
informations sont généralement le nom(NAME) de </TITLE> !
l’auteur (AUTHOR), le contenu (CONTENT), ou </HEAD> " !
encore un ensemble de mots clés (KEYWORDS) qui <BODY> !
pourra être examiné par les moteurs de recherche. ! Ma première page en HTML !
</BODY> !Autre couple de balises «"non interprétées"»!
</HTML> !
 permet d’insérer des commentaires dans
vos pages HTML (syntaxe )!
Ph Moreau! L1-STS-Internet et Programmation! 44! Ph Moreau! L1-STS-Internet et Programmation! 45!
Le langage Html : Première Page!
Ce qui donne!
Ph Moreau! L1-STS-Internet et Programmation! 46!
Ph Moreau! 5!