Вы находитесь на странице: 1из 55

Universit Ibn-Tofail Facult des Sciences Dpartement dInformatique Kenitra

Cours dinformatique 4
SMP/SMC - Semestre 4

HTML et Rseaux Informatique

Pr. Moulay Youssef HADI hadi-moulay-youssef@univ-ibntofail.ac.ma

Anne universitaire 2011/2012


1

Chapitre I: Programmation HTML

1 Introduction
Internet est un systme mondial d'interconnexion de rseaux informatiques, utilisant un ensemble standardis de protocoles de transfert de donnes. C'est donc un rseau de rseaux, compos de millions de rseaux aussi bien publics, privs, universitaires, commerciaux et gouvernementaux. Internet transporte un large spectre d'information et permet l'laboration d'applications et de services varis comme le courrier lectronique, la messagerie instantane et le World Wide Web (le Web).

Le Web est donc un service offert par Internet bas sur une un architecture client-serveur dont le fonctionnement sapparente des relations client-fournisseur. L'ordinateur personnel, dot de son logiciel de navigation ou navigateur (Internet Explorer, Firefox, Google Chrome, ...), joue le rle du client. Les ordinateurs distants sur lesquels sont hbergs les sites web sont des serveurs. Clients et serveurs, connects au rseau Internet, communiquent entre eux travers des protocoles. Lorsque l'on saisit l'adresse d'un site web - appele URL - dans son navigateur ou que l'on clique sur un lien hypertexte, le navigateur envoie une requte au serveur qui va la traiter et lui renvoyer via Internet les donnes demandes (page web, image, vido...). Le navigateur interprte les donnes reues et les affiche l'cran.

Un site web est un ensemble de pages (documents) organises en structure hirarchique, disponible sur un serveur. Il peut tre construit avec des pages statiques, des pages dynamiques ou un assemblage des deux : les pages statiques sont adquates pour prsenter une information prenne. les pages dynamiques se justifient quand des modifications frquentes doivent tre effectues, typiquement mensuelles, hebdomadaires ou quotidiennes. Pour des modifications annuelles ou semestrielles, les pages statiques sont prfrables car, tant plus durables, elles peuvent tre mieux positionnes en rfrencement naturel sur les moteurs de recherche (Google, Yahoo, Bing, ). Exemple de pages statiques : prsentation d'une socit ou d'un organisme, page de contact, prsentation d'un produit ou d'un service, conditions gnrales de vente... Exemple de pages dynamiques : les news, les annonces de recrutement, la liste des points de vente, un blog, les pages produits d'un site marchand. Les pages statiques requirent des comptences de spcialiste car elles sont "traduites" en langage web. Elles sont crites en HTML ou XHTML et mises en forme l'aide de feuilles de style CSS pour la disposition des contenus (titres, blocs de texte, images...). De plus, elles doivent tre conformes aux normes de rfrence, par exemple XHTML 1.0, CSS 2, et valides.

2 Le langage HTML
Les documents disponibles sur le Web sont crits en langage HTML (Hyper-text Markup Language). Un document est dit hypertexte lorsquil permet daccder dautres documents au moyen dun simple clic de souris sur une partie de son texte.

Le navigateur (ou browser) est un logiciel qui permet dafficher les pages crites en langage HTML. Si vous tes connects Internet, il vous permettra de naviguer sur le Web. Les logiciels navigateurs les plus utiliss sont : Microsoft Internet Explorer et Netscape Navigator, FireFox, Google Chrome. Une page HTML est un fichier Ascii (du texte) qui est compos par: Le contenu de la page visualiser par le navigateur. Un certain nombre de commandes appeles balises ou tags interprts par le navigateur. Ces balises se distinguent du contenu de la page par les signes < et >, par exemple <html>. Quand on crit les balises d'une page HTML, Il faudra toujours garder l'esprit qu'une balise marque une action pour le navigateur: ce qu'il doit faire. Pour crer et visualiser de pages HTML on a besoin d'au moins : Un diteur de texte tout simple comme par exemple le Bloc-notes ou Notepad++ ou tout autre diteur quivalent. Un navigateur : Microsoft Internet Explorer et Netscape Navigator, FireFox, Google Chrome ou autre. Les fichiers HTML doivent tre enregistrs avec l'extension .html ou .htm.

Pour crire, visualiser et mettre jour une page HTML, on procdera comme suit: Utiliser un diteur de texte pour crer le fichier HTML Sauvegarder ce fichier avec l'extension .html ou .htm (ne pas fermer l'diteur) Ouvrir le navigateur. Afficher le document via le menu Fichier/Ouvrir (ou File/Open file...) Pour dventuelles modifications, il n'est pas ncessaire douvrir chaque fois le navigateur: Retourner dans l'diteur de texte (sans fermer le navigateur). Modifier les codes Html.

Enregistrer le fichier. Utiliser la commande Actualiser (Recharger ou Reload) du navigateur.

1.1 Structure de base dun document HTML


La structure de base d'un document HTML est: <HTML> <HEAD> <TITLE> Titre du document </TITLE> </HEAD> <BODY> Le corps du document </BODY> </HTML> Louverture du document dans un navigateur donne le rsultat suivant :

Le langage HTML est un langage utilisant des balises (dlimiteurs) : Pour apporter une modification une portion de texte, vous devez encadrer ce texte entre deux balises. Par exemple, pour souligner le texte La facult des sciences , il faut dlimiter ce texte par : <U> La facult des sciences </U> HTML utilise deux types de balises : Autonome: il s'agit des balises monolithiques entre < et > comme <br> (retour la ligne). Conteneur: ce sont les balises possdant un dbut entre < et >, et une fin entre </ et > comme <U>...</U>.

Les identifiants de balises ne sont pas sensibles la casse. Certaines balises sont associes un ou plusieurs attributs. Ces derniers prcisent une autre action excuter par le navigateur. Chaque attribut un identifiant et une valeur (entre "" et aprs =), par exemple : <IMG SRC= "photo.gif">. Vous pouvez insrer des commentaires dans vos pages HTML (ceux-ci seront invisibles lors de laffichage de la page), en utilisant la balise <!-- Commentaires -->. Remarque : Si vous voulez insrer deux balises dans une page HTML, il ne faut jamais crire : <BALISE1> texte1 <BALISE2> texte2 </BALISE1> texte3 </BALISE2>.

1.1.1 Balises de structure


<HTML>...</HTML> : indique qu'il s'agit d'un document HTML. Tout le contenu et le code HTML doivent tre inclus entre <HTML> et </HTML>. <HEAD>...</HEAD> : Contient les balises qui composent l'en-tte du document (titre,). <TITLE>...</TITLE> : Donne un titre descriptif du document. Ce titre s'affiche sur la barre de titre des navigateurs. Exemple: <TITLE> Facult des Sciences, Knitra </TITLE>

<BODY>...</BODY> : Contient l'ensemble du contenu et des balises qui constituent le corps du document.

Syntaxe: <BODY Bgcolor="couleur d'arrire-plan" Background="URL de l'image d'arrire-plan" Link="couleur des liens non visits" VLink="couleur des liens visits" ALink="couleur des liens activs" Text="couleur du texte" > Corps du document </BODY>

Chaque attribut de couleur peut prendre pour valeur l'un des 16 noms de couleurs rservs: Black, White, Aqua, Silver, Gray, Maroon, Red, Purple, Fuschia, Green, Lime, Olive, Yellow, Navy, Blue et Teal, ou un nombre de six chiffres hexadcimaux codant les intensit de RVB (exemple : Blue=#0000FF). Exemple : <BODY Bgcolor="fuschia" Text="Maroon"> Contenu et code HTML du corps de document </BODY>

Il existe d'autres balises de structure particulires qu'on verra par la suite.

1.1.2 Balises de formatage et mise en page


Ces balises permettent d'utiliser divers attributs de police, de style et de mise en forme. <B>...</B> : Affiche le texte en gras. <I>...</I> : Affiche le texte en italique. <U>...</U> : Affiche le texte en soulign. <S>...</S>, <STRIKE>...</STRIKE> : Affiche le texte en barr (barr). <SUB>...</SUB> : Affiche le texte en indice. <SUP>...</SUP> : Affiche le texte en exposant. <Hn>...</Hn> o 1 n 6 : Etablit une hirarchie entre les niveaux de titre du document. La taille du caractre dcrot pour chaque niveau de titre, <H1> tant le plus lev. Les titres s'affichent en gras. Syntaxe: <Hn ALIGN = "LEFT/RIGHT/CENTER/JUSTIFY"> O n=1, 2, 3, 4, 5 ou 6. <BR> : Insre un saut de ligne dans le document. Les retours chariot dans le code HTML n'tant pas interprts par le navigateur, les sauts de lignes doivent tre alors exprims explicitement par la balise <BR>. texte </Hn>

<CENTER>...</CENTER> : Centre tous les textes et les lments contenus dans la balise <DIV>...</DIV> : Applique un alignement spcial une partie du document. <DIV ALIGN = "LEFT/RIGHT/CENTER/JUSTIFY">.</DIV>

Syntaxe:

L'attribut ALIGN dtermine l'alignement du texte ou des lments inclus entre <DIV> et </DIV>. Il peut prendre les valeurs LEFT, RIGHT, CENTER ou JUSTIFY. <HR>: Insre une ligne horizontale. Les lignes horizontales permettent de scinder la page en plusieurs sections. Syntaxe: <HR ALIGN="alignement" NOSHADE SIZE= paisseur WIDTH=longueur> - ALIGN: spcifie l'alignement de la ligne. Il prend les valeurs LEFT, RIGHT ou CENTER qui est la valeur par dfaut. Il n'a d'effet que lorsque la longueur de la ligne est infrieure la largeur de la page. - NOSHADE: Supprime l'ombrage 3D et n'affiche qu'une ligne simple. - SIZE: Spcifie l'paisseur (en pixels) de la ligne. - WIDTH: spcifie la largeur de la ligne. Il peut prendre une valeur en pixels ou en pourcentage de la largeur de la page. Il est recommand d'utiliser une valeur en pourcentage car on ne peut jamais connatre d'avance la taille d'cran du visiteur. <BASEFONT>: Dfinit les proprits de rfrence du texte (taille, couleur et police). On prfre aujourd'hui utiliser les feuilles de style. Syntaxe: <BASEFONT SIZE= taille COLOR= "couleur" FACE ="liste de polices"> SIZE: prend pour valeur un entier compris entre 1 et 7. La valeur par dfaut est 3. COLOR: prend pour valeur le nom d'une couleur ou un code hexadcimal RVB. La couleur par dfaut est le noir. FACE: prend pour valeur une liste de polices dans lesquelles le texte sera affich. Le navigateur utilise la premire police disponible. Si aucune des polices n'est disponible le navigateur utilise sa propre police par dfaut. <P></P>: Dfinit un paragraphe.

Syntaxe:

<P

ALIGN= "alignement"> paragraphe

</P> ALIGN: dfinit l'alignement du paragraphe. Les valeurs possibles sont LEFT, RIGHT, CENTER et JUSTIFY. <PRE></PRE>: Indique au navigateur qu'il faut afficher le texte dans une police pas fixe et prendre en compte les espaces, les tabulations et les retours chariot inclus entre <PRE> et </PRE>. Syntaxe: <PRE WIDTH= largeur maximale> texte </PRE> WIDTH: prend pour valeur le nombre de caractres contenu dans la ligne la plus longue du bloc. 1.5. Balises de listes

Les listes font partie des techniques de mise en forme. Mais leur varit justifie que les balises de listes soient traites dans une section part. Il existe deux types de listes : Listes numrotes Listes puces <LI> texte </LI>: Dfinit un lment de liste. <LI> Rabat</LI> <LI> Casablanca</LI> <LI> Agadir</LI> Remarque: Bien que <LI> soit une balise conteneur (avec un dbut et une fin), on l'emploie souvent de faon autonome (sans </LI>). <OL> texte </OL>: Formate une liste numrote.

Exemple:

Syntaxe : <OL TYPE="1/ A / a / I / i" START= "valeur initiale" COMPACT> <LI> texte </LI> <LI> texte </LI> <LI> texte </LI> .. </OL> - TYPE: Peut prendre les valeurs suivantes: 1: pour les chiffres arabes (1, 2, 3, ). A: pour les lettres capitales, dans l'ordre alphabtiques (A, B, C, ). a: pour les lettres minuscule, dans l'ordre alphabtiques (a, b, c, ). I pour les chiffres romains en capitales (I, II, III, IV, ). i pour les chiffres romains en minuscules (i, ii, iii, iv, ). - START: Spcifie la valeur initiale (1 par dfaut). Par exemple, en donnant START la valeur 3 et TYPE la valeur I, on obtient une liste dont la numrotation commence III. - COMPACT: Indique au navigateur de rduire au maximum l'interlignage des lments. Exemple: Plan <OL TYPE="A"> <LI> HTML </LI> <LI> JAVASCRIPT </LI> <LI> Active Server Pages (ASP) </LI> </OL> <UL></UL>: Formate une liste puces.

Syntaxe: <UL TYPE="DISC / SQUARE / CIRCLE" COMPACT> <LI> texte </LI>

10

<LI> texte </LI> <LI> texte </LI> . </UL> - TYPE: Spcifie le type de puces. Cet attribut est particulirement utile dans le cas de listes puces imbriques. Les valeurs possibles pour TYPE sont: DISC SQUARE CIRCLE : cercle avec fond. : carr avec fond. : cercle sans fond.

- COMPACT: A la mme fonction que dans <OL>. Exemple: Navigateurs: <UL TYPE= "SQUARE"> <LI> Netscape Communicator </LI> <LI> Microsoft Internet Explorer </LI> <LI> Mozilla </LI> </UL>

1.6.

Balises dhyperliens

1.6.1. Les liens HTML (HyperText Markup Language) est un langage hypertexte (et hypergraphique) qui permet en cliquant sur un mot, gnralement soulign (ou une image) de passer: vers un autre endroit du document. vers un autre fichier HTML situ sur votre ordinateur. vers un autre fichier HTML situ sur le Web. Pour spcifier un lien on utilise la balise <A> dont la syntaxe simplifie est : <A HREF="URL ou adresse"> texte et/ou image </A>

11

Selon la valeur de l'attribut HREF on peut dgager trois types de lien: Lien externe: Permet d'accder un autre ordinateur situ sur le rseau Internet en utilisant son adresse ou URL (Universal Ressource Locator). Ce sont les adresses du type : http://serveur/chemin.../fichier ftp://serveur/chemin.../fichier mailto:utilisateur@hte Exemples: Pour accder des pages Web Pour faire un transfert de fichiers Pour envoyer un mail

<A HREF="http://www.microsoft.com/acceuil.htm > Microsoft </A> <A HREF="mailto:amine@caramail.com" > Ecrire Amine </A>

Lien local: Permet de charger un fichier HTML situ dans le mme rpertoire que le fichier contenant le lien (fichier appelant). L'adresse du lien sera alors tout simplement: fichier.html

Exemple:

<A HREF="info.html" > Pour des Informations cliquer ici </A>

Lien mixte: C'est un lien vers un fichier situ un autre endroit de votre ordinateur, et donc non situ dans le rpertoire de votre site (contenant le fichier appelant). L'adresse prendra la forme file:///lecteur:/rpertoire/fichier.htm (en adressage absolu). ../../../fichier.htm (en adressage relatif).

Exemples:

1- <A HREF= "file:///c:/cours/cours1.html" > Cours n1</A> 2- <A HREF= "../astuces/astuces.html" > Des Astuces Intressants </A> 3- <A HREF="exercices/exercice1.html> exercice N1 </A>

Dans le deuxime exemple, si le fichier contenant le lien se trouve dans le rpertoire c:\formation\supports, alors, pour que le lien marche, le fichier astuces.html doit se trouver dans le rpertoire c:\formation\astuce Il faut noter donc que "../ " vous ramne "d'un rpertoire en arrire" (vers le rpertoire parent du rpertoire courant). Dans le troisime exemple, si le fichier contenant le lien se trouve dans le rpertoire c:\formation\supports, alors il faut que:

12

- Le rpertoire exercices soit un sous rpertoire du rpertoire supports cest dire on doit avoir le rpertoire c:\formation\supports\exercices - Le fichier exercices.html se trouve dans c:\formation\supports\exercices 1.6.2. Les ancres Des liens peuvent aussi pointer vers un endroit prcis du mme ou d'un autre document. C'est ce qu'on appelle les ancres [Anchor], ancrages ou pointeurs Pour dfinir l'endroit vers lequel on veut pointer (ou point d'ancrage), on utilise la balise <A> avec l'attribut NAME: Exemple: <A NAME="nom de l'ancre"> cible </A>

<A NAME= "activ"> Programme de formation: </A> Ce programme vise former des experts en gnie logiciel et ..

L'ancre "activ" peut donc tre utilis par un lien pour accder directement l'endroit dtermin. Deux situations se posent: 1) Si le lien se trouve dans le mme document que l'ancre alors la syntaxe de ce lien est: <A HREF="#nom de l'ancre">texte et/ou images</A> Exemple: <H1 ALIGN="Center"> SOMMAIRE</H1> * Introduction * Ressources humaines * <A HREF= "#activ"> Programme de Formation </A> 2) Si le lien se trouve dans un autre document que l'ancre, la syntaxe du lien est: <A HREF="URL du fichier contenant l'ancre #nom de l'ancre">texte et/ou images</A> Exemple: Soit etude.html un fichier contenant un ancre "info" dfini par: <A NAME="info"> Information Pratique </A> Pour accder cette ancre partir d'un autre document on utilise, par exemple, le lien: <A HREF= "etude.html#info"> des informations qui vous intressent </A>

13

1.7.

Les images

Sans images, le Web n'aurait pas sans doute connu son succs actuel. Le visiteur est souvent attir par le contenu graphique. Le placement d'une image sur une page Web est trs simple, il suffit pour cela d'utiliser une seule balise HTML. Les nombreux attributs que cette balise peut contenir donnent un contrle trs prcis de l'image insre. Mais avant d'insrer une image sur une page Web, il faut: Cerner l'ide exprimer. Trouver l'image qui l'exprime le mieux. Dterminer le format le plus approprie (GIF, JPEG) Gnralement, il y a quatre types d'utilisations des images sur des pages WEB: Les photos de personnes, de produits, de lieux, Les bandeaux, et les logotypes. Les boutons ou icnes. Les textures d'arrire-plan ou papiers peints qui forment le fond des pages. La balise <IMG> Cette balise permet de placer une image sur une page Web. C'est une balise qui peut recevoir les attributs suivants: Attribut SRC WIDTH HEIGHT BORDER ALT Fonction Spcifie l'URL (chemin) du fichier qui contient l'image. Spcifie la largeur de l'image en pixels. Spcifie la hauteur de l'image en pixels. Dfinit l'paisseur du cadre de l'image Spcifie le texte de remplacement de l'image destin pour les navigateurs Non graphiques ou dans lesquels l'utilisateur a dsactiv le chargement des images.

14

ALIGN HSPACE VSPACE

Gre l'alignement du texte adjacent l'image. Dfinit l'espace qui sera rserv droite et gauche de l'image. Dfinit l'espace qui sera rserv en haut et en bas de l'image.

Syntaxe de <IMG>: <IMG SRC= "URL du fichier image" WIDTH= largeur HEIGHT= hauteur BORDER= paisseur du cadre

ALT= "texte de remplacement"

ALIGN= "TOP/ MIDDLE/ BOTTOM/ LEFT/ RIGHT" HSPACE= espacement horizontal VSPACE= espacement vertical> Attributs indispensables: Techniquement, SRC est le seul attribut obligatoire dans une balise <IMG>, mais on peut considrer comme indispensables les attributs suivants: HEIGHT et WIDTH: En spcifiant ces attributs de l'image, on acclre l'affichage de la page. En effet, le navigateur se sert des valeurs de ces attributs pour rserver l'emplacement de l'image, qu'il viendra occuper au terme de son chargement. En l'absence de ces informations, le navigateur charge en mmoire l'image entire, calcule ses dimensions, la place sur la page et alors continue ensuite d'afficher le reste du document. Ainsi l'absence de ces attributs peut rend lent l'affichage de la page. ALT: Cet attribut spcifie un texte de remplacement destin aux navigateurs non graphiques. Ce texte sera affich la place de l'image. Il est galement utilis par les moteurs d'indexation qui n'interprtent pas les images et doivent par consquent se rfrer au contenu de ALT. Une balise <IMG> devrait ressembler cela: <IMG SRC= "URL du fichier graphique" ALT= "texte de remplacement" WIDTH= largeur en pixels HEIGHT= hauteur en pixels > Exemple : <IMG SRC= "terre.gif" ALT= "la terre tourne" WIDTH= 50 HEIGHT= 60>

15

Les autres attributs: BORDER: Dfinit l'paisseur du cadre autour de l'image. Par dfaut BORDER=0 ce qui provoque un affichage de l'image sans cadre. Exemple: <IMG BORDER=5> HSPACE et VSPACE: Dfinissent l'espace qui sera laiss autour de l'image ce qui permet de la placer mieux et disposer sur la page. HSPACE prend pour valeur le nombre de pixels qui seront rservs droite et gauche de l'image. VSPACE prend pour valeur le nombre de pixels qui seront rservs en haut et en bas. Exemple: <IMG SRC="terre.gif" ALT="la terre tourne" WIDTH= 50 HEIGHT= 60 HSPACE= 10 VSPACE= 10> ALIGN: Gre l'habillage de l'image par le texte et prend les valeurs indiques dans le tableau ci-dessous. Les valeurs TOP, MIDDLE et BOTTOM fixent l'alignement du texte adjacent par rapport l'image. LEFT et RIGHT aligne l'image sur la marge de gauche ou la marge de droite Valeur TOP MIDDLE BOTTOM Fonction Aligne le haut du texte adjacent sur le sommet de l'image. Aligne la ligne de base du texte adjacent sur le milieu de l'image. Aligne la ligne de base du texte adjacent sur la base de l'image.(valeur par dfaut) LEFT Aligne l'image sur la marge gauche et permet son habillage par le texte sur sa droite. RIGHT Aligne l'image sur la marge droite et permet son habillage par le texte sur sa gauche. SRC="terre.gif" ALT="la terre tourne" WIDTH= 50 HEIGHT= 60

16

Les valeurs LEFT et RIGHT permettent l'habillage de l'image par le texte, ce qui donne des mises en pages cratives. Pour centrer une image, il faut utiliser la balise <CENTER> ou la balise <DIV>: Exemple: Comment centrer une image <DIV ALIGN="CENTER"> <IMG SRC="terre.gif" WIDTH= 50 HEIGHT= 60> </DIV> Exemples: Utilisation de ALIGN 1- Diffrence entre TOP, MIDDLE et BOTTOM: <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= TOP WIDTH= 50 HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile. <br> <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= MIDDLE WIDTH= 50

HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile. <br> <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= BOTTOM WIDTH= 50

HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile.

17

ALIGN= TOP

ALIGN= BOTTOM

ALIGN= MIDDLE

2- Utilisation de LEFT pour l'habillage de l'image par du texte: <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= LEFT WIDTH= 50 HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile.

18

3- Utilisation de RIGHT pour l'habillage de l'image par du texte: <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= RIGHT WIDTH= 50

HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile.

4- Utilisation de LEFT et RIGHT conjointement pour entourer le texte par deux images. <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= LEFT WIDTH= 50 HEIGHT= 60> <IMG SRC="terre.gif" ALT="la terre tourne" ALIGN= RIGHT WIDTH= 50

HEIGHT= 60> "Et pourtant elle tourne " avait <BR> dit le sage Galile.

19

1.8.

Les tableaux

Les tableaux ont t initialement destins la prsentation des donnes en colonnes. Aujourd'hui, ils sont principalement utiliss pour l'laboration de mises en page complexes. Un tableau est compos dun ensemble de lignes, et chaque ligne est compose par des cellules. En rsum, on a: Les cellules sont les lments constituant un tableau. Elles contiennent soit des donnes, soit des enttes de colonnes. Les cellules sont ordonnes en lignes. Les lignes composent le tableau.

1.8.1. balises de tableaux Pour crer un tableau en HTML, on utilise quatre balises: <TABLE>, <TR>, <TH> et <TD>. La syntaxe de base d'un tableau est: <TABLE> <TR> <TH> En-tte 1 </TH> <TH> En-tte 2 </TH> <TH> En-tte n </TH> </TR> <TR> <TD> Elment de colonne 1 </TD> <TD> Elment de colonne 2 </TD> <TD> Elment de colonne n </TD> </TR> Cellule n Cellule 1 Cellule 2 Ligne 2 En-tte 1 En-tte 2 Ligne 1 pour les en-ttes En-tte n

20

<TR> <TD> Elment de colonne 1 </TD> <TD> Elment de colonne 2 </TD> <TD> Elment de colonne n </TD> </TR> </TABLE> Cellule n Cellule 1 Cellule 2 Ligne m

Rgle respecter: Toutes les balises de tableaux (<TR></TR>, <TH></TH> et <TD></TD>) doivent apparatre entre les balises <TABLE> et </TABLE>. Toute balise de tableau place l'extrieur de ces balises sera ignore.

Exemple de tableau <TABLE> <TR> <TH> Matire </TH> <TH> Trimestre </TH> <TH> Volume Horaire </TH> </TR> <TR> <TD> HTML </TD> <TD> 1 </TD> <TD> 20 </TD> </TR> <TR>

21

<TD> JavaScript </TD> <TD> 2 </TD> <TD> 30 </TD> </TR> <TR> <TD> ASP </TD> <TD> 2 </TD> <TD> 40 </TD> </TR> </TABLE>

Ce tableau sera affich sur le Web comme suit :

Commentaires sur la syntaxe gnrale des balises de tableaux: Les balises <TABLE> et </TABLE> spcifient le dbut et la fin du tableau. Le tableau est justifi gauche par dfaut. Les balises <TR> et </TR> indiquent le dbut et la fin d'une ligne du tableau. Les balises <TH> et </TH> sont utilises pour prsenter les cellules de la premire ligne qui sera utilise comme en-tte du tableau. Le contenu des cellules de l'en-tte est automatiquement centr et affich en caractres gras.

22

On peut utiliser un tableau sans en-tte. Dans ce cas on n'utilise pas le pair de balises <TH> </TH>.

Les balises <TD> et </TD> dfinissent les cellules de donnes. Le contenu de ces cellules est justifi gauche par dfaut.

Tout formatage supplmentaire (gras, italique, couleur,) des donnes devra tre spcifi par les balises appropries l'intrieur de chaque pair <TD></TD>.

Chacune des balises de tableau dispose d'un ensemble d'attributs qu'on examinera cidessous

Le contenu des cellules peut tre: du texte des images d'hyperliens (ou liens) des arrire-plans et mme des tableaux

1.8.2. Lgende Pour ajouter une lgende au tableau, on insre le texte correspondant entre les balises <CAPTION> et </CAPTION>. La lgende sera centre au-dessus du tableau. Le texte de la lgende peut tre mis en forme en utilisant les diffrentes balises de formatage. Les balises <CAPTION> et </CAPTION> doivent tre places entre <TABLE> et </TABLE> : <TABLE> <CAPTION> texte de lgende </CAPTION> </TABLE> Exemple : Insertion et formatage (<FONT>) de la lgende. <TABLE WIDTH= 100% BORDER= 2> <CAPTION> <FONT SIZE=4 COLOR="BLUE"> Nouvelles Matires Introduites </FONT> </CAPTION> <TR ALIGN= LEFT>

23

<TH> Matire </TH> <TH> Trimestre </TH> <TH> Volume Horaire </TH> </TR> <TR> <TD> HTML </TD> <TD> 1 </TD> <TD> 20 </TD> </TR> <TR> <TD> JavaScript </TD> <TD> 2 </TD> <TD> 30 </TD> </TR> <TR> <TD> ASP </TD> <TD> 2 </TD> <TD> 40 </TD> </TR> </TABLE>

24

1.8.3. Fusion des cellules Par dfaut, une cellule n'a que la hauteur d'une ligne et la largeur d'une colonne. Ce qui est suffisant pour la plupart des tableaux standards. Lorsque l'on se sert des tableaux des fins de mise en page, il arrive qu'une cellule doive s'tendre sur plusieurs lignes et/ou plusieurs colonnes. Dans ce cas, on doit faire une fusion de cellules la manire des tableurs. Fusion Horizontale : L'attribut COLSPAN des balises <TH> et <TD> permet d'tendre la cellule dfinie sur plusieurs colonnes. COLSPAN prend pour valeur le nombre de colonnes que doit occuper la cellule.

Exemple : <TABLE WIDTH= 100% BORDER= 2 CELLPADDING=10 CELLSPACING=5> <TR> <TD ALIGN= CENTER COLSPAN= 2 > <IMG SRC= "images/telephone1.gif"> </TD> <TD> <IMG SRC= "images/telephone2.gif"> </TD> </TR> <TR> <TD> Premire srie <BR> En octobre 2000 </TD> <TD> Deuxime srie <BR> En septembre 2001 </TD> <TD> Sortie en 1999</TD> </TR>

25

</TABLE>

Fusion verticale : L'attribut ROWSPAN fonctionne de la mme manire que COLSPAN, mais s'applique aux lignes du tableau. Elle permet d'tendre une cellule sur plusieurs lignes. Exemple : <TABLE WIDTH= 100% BORDER= 2 CELLPADDING=10 CELLSPACING=5> <TR> <TD ALIGN= CENTER ROWSPAN= 2 > <IMG SRC= "images/telephone1.gif"> </TD> <TD> Premire srie <BR> En octobre 2000 </TD> </TR> <TR>

26

<TD> Deuxime srie <BR> En septembre 2001 </TD> </TR> <TR> <TD ALIGN= CENTER> <IMG SRC= "images/telephone2.gif"> </TD> <TD> Sortie en 1999</TD> </TR> </TABLE>

27

1.9.

Les cadres : Frames

Les premires versions dHTML ne comprenaient pas les frames. Il a t introduit par la suite pour surmonter cette limitation dHTML. Le concept est le suivant : la fentre du navigateur est divise en plusieurs parcelles appeles frames ou cadres dont chacune peut contenir un document diffrent. Si un document est long, le frame qui le contient affiche ses propres barres de dfilement.

1.9.1. Quelques utilisations des frames: Les frames ne doivent pas tre employs uniquement parce qu'ils offrent un joli design au site WEB. Ils doivent rpondre aux besoins et aux caractristiques du visiteur du site, et amliorer de faon significative la prsentation du contenu. L'application la plus courante consiste fournir un contenu statique (une table de matires par exemple) dans un frame et un contenu variable dans un autre. A cet effet, deux frames seulement sont ncessaires: L'un situ gauche de la fentre, l'autre occupant l'espace restant et charg d'afficher les documents. Dans les frames statiques, on trouve souvent des: Liens de navigation vers d'autres pages. Tables de matires Bannires et logos Outils de recherche

28

Le visiteur interagit dans le frame statique (clique un lien, saisie d'un critre de recherche, etc.), et les rsultats s'affichent dans le frame variable.

1.9.2. Cration des frames Avant de commencer le codage HTML, il est conseill de faire un croquis de la page finale. Cela permet de dcider de la construction la plus efficace du document contenant des cadres.

1.1.1 La balise <FRAMESET> Il faut donc commencer par diviser la page en zones indpendantes; c'est le rle des balises <FRAMESET> et </FRAMESET>. Les attributs que reoivent ces balises sont essentiels la dfinition des cadres. La balise <FRAMESET> requiert l'un des deux attributs suivants : Attribut Fonction Divise l'cran Valeurs Possibles en Des nombres, des pourcentages ou des astrisques (*)

zones horizontales (en spars par des virgules (,) qui indiquent les tailles lignes) ROWS L'astrisque indiquant que la carde occupe tout l'espace restant. COLS Divise l'cran en (Identiques ROWS) des cadres.

zones verticales (en colonnes)

Remarque : Gnralement, on utilise des pourcentages et des astrisques (*) pour indiquer la taille de chaque cadre. La structure de base du document HTML, o on dfinit des cadres, est la suivante : <HTML> <HEAD>

29

<TITLE> titre de la page </TITLE> </HEAD> <FRAMESET ROWS="tailles de zones horizontales" OU COLS="tailles de zones verticales"> Dfinition du contenu de chaque cadre </FRAMESET> </HTML>

Remarques: 1) On note que dans la structure de base d'un document contenant des cadres, les balises <FRAMESET> et </FRAMESET> ne sont pas mises entre les deux balises <BODY> et </BODY> 2) On ne doit utiliser que l'un des attributs ROWS ou COLS dans la balise <FRAMESET>. Si les deux sont prsents dans la mme balise <FRAMESET>, le navigateur n'interprtera que le premier attribut rencontr. 1.1.2 Bordure des cadres: On peut modifier l'paisseur des bords des cadres ou de supprimer les bords. Les documents se prsentent comme une page Web ordinaire, sans les bords des cadres. On utilise pour cela les deux attributs: Attribut FRAMEBORDER Fonction Valeurs Possibles

Affiche ou masque la bordure du 1 pour afficher la bordure. cadre. 0 pour masquer la bordure. Un entier

BORDER

Spcifie l'paisseur de la bordure

Remarque:

Si FRAMEBORDER=0 et BORDER=0, le contenu des cadres parat continu sans sparateurs.

30

1.1.3 Dfinition des contenus des cadres: <FRAME> La balise <FRAMESET> ne fait que dfinir les diffrents cadres (ou frames). Il reste placer dans chaque frame le contenu qui lui convient. C'est le rle de la balise <FRAME> et de ses nombreux attributs. L'attribut important et obligatoire de la balise <FRAME> est SRC qui indique au navigateur l'URL du document charger dans le frame. Cette balise peut recevoir les attributs suivants: Attribut SRC Fonction Indique l'URL du document charger dans le frame (attribut obligatoire) NAME="nom" Attribue au frame un nom unique, qui servira de rfrence l'attribut TARGET NORESIZE Interdit le redimensionnement du frame par l'utilisateur.

SCROLLING=YES/NO/AUTO Gre l'apparition des barres de dfilement, la valeur par dfaut est AUTO: - YES : Affiche les barres de dfilement. - NO : Masque les barres de dfilement. - AUTO : Affiche les barres de dfilement si ncessaire. MARGINHEIGHT=n Spcifie n pixels comme marge intrieure rserver en haut et en bas du frame MARGINWIDTH=n Spcifie n pixels comme marge intrieure rserver droite et gauche du frame

Exemples 1) Division de la fentre du navigateur en deux cadres verticaux pour afficher respectivement les deux documents HTML tabmat.html et accueil.html. Le premier cadre occupera 30% de

31

la fentre, et le deuxime occupera le reste. On suppose que les trois fichiers HTML de l'exemple sont stocks dans le mme dossier. tabmat.html <HTML> <HEAD> <TITLE> Sommaire </TITLE> </HEAD> <BODY> <H3 ALIGN=CENTER>Tables des Matires </H3> <BR> .. </BODY> </HTML> accueil.html <HTML> <HEAD> <TITLE> Accueil </TITLE> </HEAD> <BODY> <H3 ALIGN=CENTER>Bienvenue sur notre site</H3> <BR> .. </BODY> </HTML> index.html : Utilis pour la dcomposition de la fentre du navigateur pour afficher les deux documents prcdents. <HTML> <HEAD> <TITLE> Index </TITLE> </HEAD> <FRAMESET COLS="30% , *"> <FRAME SRC="tabmat.html"> <FRAME SRC="accueil.html" NAME= "contenu"> </FRAMESET>

32

</HTML>

2) On reprend l'exemple 1, mais cette fois on divise la fentre du navigateur en deux cadres horizontaux. Pour cela on utilise l'attribut ROWS au lieu de COLS dans la balise <FRAMESET> dans index.html. index.html <HTML> <HEAD> <TITLE> Index </TITLE> </HEAD> <FRAMESET ROWS="30% , *"> <FRAME SRC="tabmat.html"> <FRAME SRC="accueil.html" NAME= "contenu"> </FRAMESET> </HTML>

33

1.1.4 L'attribut TARGET L'une des applications courantes des frames est l'utilisation d'un cadre dont le contenu est statique et un ou plusieurs autres cadres dont le contenu change. Ce changement peut tre fait suite un clic sur un lien par exemple. Pour cela, il faut spcifier dans le lien: Le document HTML charger (valeur de l'attribut HREF de la balise <A>) Le cadre dans lequel on doit faire l'affichage du document, c'est le rle de l'attribut TARGET de la balise <A>. L'attribut TARGET prend comme valeur le nom du cadre vers lequel on veut rediriger le document indiqu dans l'attribut HREF: <A HREF=" URL du document HTML" TARGET= "Nom de cadre" > Exemple On reprend l'exemple prcdent et on ajoute dans tabmat.html un lien vers le document chapitre1.html qui sera charg dans la frame "contenu". tabmat.html <HTML> <HEAD> <TITLE> Sommaire </TITLE> </HEAD> <BODY> <H3 ALIGN=CENTER>Tables des Matires </H3> <BR> .. <BR> <A HREF="chapitre1.html" TARGET= "contenu"> <B> CHAPITRE I </B></A> </BODY> </HTML>

34

accueil.html <HTML> <HEAD> <TITLE> Accueil </TITLE> </HEAD> <BODY> <H3 ALIGN=CENTER>Bienvenue sur notre site</H3> <BR> . </BODY> </HTML> index.html : Utilis pour la dcomposition de la fentre du navigateur pour afficher les deux documents prcdents. <HTML> <HEAD> <TITLE> Index </TITLE> </HEAD> <FRAMESET COLS="30% , *"> <FRAME SRC="tabmat.html"> <FRAME SRC="accueil.html" NAME= "contenu"> </FRAMESET> </HTML>

35

1.1.5 Balises <FRAMESET> imbriques On peut laborer des mises en page complexes en imbriquant des balises <FRAMESET> et </FRAMESET>. Supposons, par exemple, qu'on veuille diviser la page en huit rgions gales. On commence par dfinir quatre frames horizontaux, comme cela: <FRAMESET ROWS="25%, 25% ,25%, 25%"> . </FRAMESET> Il faut ensuite diviser en deux colonnes chacune de ranges. Le code pour chaque frame vertical serait: <FRAMESET COLS="50%, 50%"> . </FRAMESET> Reste donc imbriquer ces balises dans le premier code, comme suit: <FRAMESET ROWS="25%, 25% ,25%, 25%"> <FRAMESET COLS="50%, 50%"> colonnes --> . </FRAMESET> <FRAMESET COLS="50%, 50%"> colonnes --> . </FRAMESET> <FRAMESET COLS="50%, 50%"> colonnes --> . </FRAMESET> <!-- Divise la range 3 en deux <!-- Divise la range 2 en deux <!-- Divise la range 1 en deux

36

<FRAMESET COLS="50%, 50%"> colonnes --> . </FRAMESET> </FRAMESET> Exemple

<!-- Divise la range 4 en deux

On va diviser la fentre du navigateur en deux ranges verticales. La premire, dont le contenu sera statique, sert charger le fichier tabmat.html (voir l'exemple prcdent). La deuxime range sera divise en deux ranges horizontales. La premire, dont le contenu sera statique, sert charger le fichier entete.html, et la deuxime sert charger en premier lieu le fichier accueil.html (voir l'exemple prcdent); mais son contenu peut changer selon le lien sollicit dans la premire range verticale (tabmat.html). entete.html <HTML> <HEAD> <TITLE>Algorithmique & Programmation </TITLE> </HEAD> <BODY> <H3 ALIGN=CENTER>Matriser Algorithmique et Programmation en QBasic</H3> <HR> <A HREF="mailto:webmaster@EIG.UV.fr"> <IMG SRC="images/mail8.gif" BORDER=0 ALT="Pour nous crire"> </A> </BODY> </HTML> index2.html : Sert diviser la fentre du navigateur en trois ranges et charger dans chacune un fichier HTML. On utilise l'attribut NORESIZE de la balise <FRAME> pour empcher le redimensionnement du cadre contenant le fichier entete.html. <HTML> <HEAD> <TITLE> Index </TITLE> </HEAD> <FRAMESET COLS="20%, *"> <FRAME SRC="tabmat.html">

37

<FRAMESET ROWS="30%, *"> <FRAME SRC="entete.html" NORESIZE> <FRAME SRC="accueil.html" NAME="contenu"> </FRAMESET> </FRAMESET></HTML>

1.10. Les formulaires L'interactivit a connu une grande volution sur le WEB grce l'introduction des composants de l'interface permettant de collecter les donnes utilisateur. Ces composants constituent les lments des formulaires qui reprsentent la partie visible de l'interactivit WEB. L'utilisateur entre des informations par le biais des champs et contrles, puis clique sur un bouton pour valider les donnes. Le navigateur rassemble alors ces donnes, ouvre une connexion HTTP et les transmet au serveur. Le serveur traitera, ensuite, les donnes reues et envoie la rponse l'utilisateur sous forme d'une page HTML.

38

Les donnes transmises par un formulaire sont traites par un programme CGI, un script ASP ou PHP.

1.10.1. Cration de formulaire Les balises permettant de spcifier les composants du formulaire doivent tre places entre les conteneurs <FORM> et </FORM>. Ces composants peuvent tre: des champs de saisie, des listes de slection, des cases cocher, des boutons de commandes ou d'options, etc. La balise <FORM> La balise ouvrante <FORM> dfinit galement l'en-tte du formulaire l'aide des attributs cits ci-dessous. Seul la proprit ACTION est obligatoire. 1.1.5.1 Attribut 1.1.6 ACTION 1.1.7 METHOD Fonction Spcifie l'URL du script qui doit traiter les donnes du formulaire. Indique la mthode HTTP employe pour transmettre les donnes au serveur. Les valeurs possibles sont: GET (valeur par dfaut) ou POST. 1.1.8 TARGET NAME ENCTYPE ACCEPT Indique le cadre vers lequel la rponse du script doit tre charge. Spcifie le nom du formulaire. Spcifie le type du fichier envoy. Spcifie la liste des contenus acceptables par le serveur de traitement. ACCEPT-CHARSET Spcifie la liste des jeux de caractres acceptables par le script de traitement.

ACTION indique l'URL du script de traitement, de sorte que le navigateur sache o envoyer les donnes aprs validation. L'URL peut tre donne:

39

Sous forme absolue: ACTION="protocole://serveur/chemin/fichier de script" Exemple: ACTION="HTTP://www.ensias.ac.ma/traitement/biblio/consulter.asp" Sous forme relative: Cette forme est utilise dans le cas o le script de traitement se trouverait sur le mme serveur que le formulaire. Exemple: ACTION= "consulter.asp" METHOD: spcifie la mthode HTTP employe pour passer les donnes au script. Les valeurs possibles sont: GET: le navigateur concatne les donnes du formulaire l'URL du script de traitement. L'emploi de cette mthode limite la taille des donnes envoyes environ 1 Ko. Cette limitation pose problme lorsqu'on dsire envoyer une grande quantit de donnes. Les donnes concatnes l'URL, la chane rsultante peut tre trop longue. Dans ce cas, on privilgie la mthode POST. POST: les donnes sont transmises au serveur via une transaction HTTP distincte. TARGET: permet d'envoyer la rponse du script vers un cadre donn. NAME: indique le nom du formulaire. Cette proprit est utilise, surtout, dans les scripts ct client (en JavaScript, VBScript). ENCTYPE: employ dans le cas o les donnes transmises seraient constitues par un ou plusieurs fichiers que le serveur doit traiter. Il prend pour valeur le type MIME du fichier de donnes transmis par le formulaire. Cet attribut renseigne le navigateur sur le type de fichier qu'il envoie. Pour permettre l'envoi d'un fichier au serveur, on doit utiliser la balise <INPUT> avec l'attribut TYPE= "File" (Voir la balise <INPUT>). Exemple: <FORM ACTION = "trait_logo.cgi" METHOD = POST ENCTYPE = "image/gif"> Indiquez le nom de votre fichier GIF contenant votre logo: <INPUT TYPE="FILE" NAME="logo"> <INPUT TYPE="SUBMIT" VALUE="Envoyer"> </FORM>

40

L'en-tte de ce petit formulaire indique au serveur que les donnes seront traites par le script trait_logo.cgi, que la mthode POST est employe, et que le type du fichier transmis est image/gif. ACCEPT: indique les types MIME reconnus par le serveur. Ainsi, lorsque plusieurs fichiers sont transmis via le formulaire, on peut assurer qu'ils relvent tous de types acceptables. Exemple: ACCEPT = "image/gif,image/jpeg". ACCEPT-CHARSET: indiquent les tables de caractres reconnues par le serveur. Exemple: ACCEPT-CHARSET = "EUC-JP" La valeur EUC-JP spcifie que les donnes transmises au serveur sont en caractres Japonais.

Exemple Gnral: <FORM ACTION = "trait_logo.cgi" NAME="form1" "image/gif,image/jpeg" ACCEPT-CHARSET = "EUC-JP" > Indiquez le nom de votre fichier GIF contenant votre logo: <INPUT TYPE="FILE" NAME="logo"> <INPUT TYPE="SUBMIT" VALUE="Envoyer"> </FORM> METHOD = POST TARGET = "frame1" ACCEPT =

ENCTYPE = "image/gif"

1.10.2. Composants des formulaires Ces composants peuvent tre des: Zones de texte. Cases cocher. Boutons d'options.

41

Zones de liste. Boutons de commandes.

Chaque composant doit avoir un nom unique. Ces noms serviront de variables au script de traitement pour identifier le contenu de chaque composant. Pour spcifier les composants d'un formulaire, on utilise les balises <INPUT>, <TEXTAREA> et <SELECT> entre les deux conteneurs <FORM> et </FORM>. Type de Champ Champ de saisie Champ de mot de passe Zone de texte multilignes Fichier Champ masqu Case cocher Bouton d'option Zone de liste Bouton de commande de validation Bouton de commande d'initialisation Bouton de commande "script" Balise HTML <INPUT TYPE = "TEXT"> <INPUT TYPE = "PASSWORD"> <TEXTAREA> .</TEXTAREA> <INPUT <INPUT <INPUT <INPUT TYPE = "FILE"> TYPE = "HIDDEN"> TYPE = "CHECKBOX"> TYPE = "RADIO">

<SELECT><OPTION></SELECT> <INPUT <INPUT <INPUT TYPE = "SUBMIT"> TYPE = "RESET"> TYPE = "BUTTON">

Comme le montre le tableau ci-dessus, la balise <INPUT> gre la plupart des types de champs; cela grce aux multiples valeurs que prend son attribut TYPE. Selon le type de champ, <INPUT> devra galement recevoir d'autres attributs qu'on indiquera dans les sections suivantes.

42

Les balises cites dans le tableau prcdent ne font que produire les champs eux-mmes. C'est au concepteur de la page HTML de prcder chaque champ d'un libell qui indique l'utilisateur quelle information entrer. Gnralement, on utilise un tableau (souvent sans bordure) pour justifier ces libells et les composants du formulaire.

1.10.2.1 Zones de texte 1) Zone de texte monoligne: Ce type de composant permet de saisir un texte sur une seule ligne. Pour produire un champ de saisie, on se sert d'un code comme celui-ci (les attributs entre crochets sont facultatifs):

<INPUT TYPE = "TEXT" NAME = "nom" [VALUE = "texte par dfaut"] [SIZE = longueur] [MAXLENGTH = longueur maximale]>

L'attribut NAME est obligatoire en ce qu'il identifie les donnes reues par le champ. L'attribut facultatif VALUE prend pour valeur la chane de caractres qui apparatra par dfaut dans le champ. Ainsi, on pargne l'utilisateur de saisir le texte lui-mme lorsque les donnes sont prvisibles. Le texte par dfaut sert aussi indiquer le type d'information attendu. L'attribut SIZE indique la longueur (en caractres) qu'occupera le champ c d le nombre de caractres visibles du champ. La valeur par dfaut est de vingt caractres. L'attribut MAXLENGTH spcifie le nombre maximal de caractres que pourra recevoir le champ. Exemple: Nom d'utilisateur: <INPUT MAXLENGTH= 15> TYPE = TEXT NAME = "nom_login" SIZE = 20

2) Champ de mot de passe:

43

Ce champ ne diffre de la zone de texte que sur un seul point: le texte entr dans un champ de mot de passe est remplac, l'cran, par des astrisques (*). On utilise le code suivant pour produire un champ de mot de passe: <INPUT TYPE ="PASSWORD" NAME= "nom" [VALUE= "texte par dfaut"] [SIZE = longueur] [MAXLENGTH = longueur maximale]>

Exemple: <INPUT TYPE = "PASSWORD" NAME = "mot_passe" SIZE = 10 MAXLENGTH= 6>

3) Zone de texte multilignes: Les champs de saisie et de mot de passe ne peuvent contenir qu'une seule ligne de texte. Pour crer des zones de texte multilignes, on utilise les balises <TEXTAREA> et </TEXTAREA>. En voici la syntaxe: <TEXTAREA NAME = "nom" [ROWS = nombre de lignes] [COLS = nombre de colonnes] > Texte par dfaut </TEXTAREA>

L'attribut NAME assigne la zone de texte un identifiant unique. Les attributs facultatifs ROWS et COLS spcifient les dimensions de la zone de texte (la taille par dfaut varie selon les navigateurs). Le texte inclus entre <TEXTAREA> et <TEXTAREA> apparatra comme contenu par dfaut. Les zones de texte multilignes se prtent parfaitement aux longues entres de texte, tels que commentaires ou messages lectroniques Exemple: Commentaire: <TEXTAREA NAME = "notes" ROWS = 5 COLS = 20> </TEXTAREA> 4) Fichier:

44

On peut envoyer au serveur un fichier via un formulaire. Pour cela, il est impratif de stipuler l'attribut ENCTYPE dans la balise <FORM>, ainsi qu'une instruction <INPUT TYPE = "FILE">: <FORM ACTION = "URL d'un script" ENCTYPE = "type MIME du fichier"> Fichier Envoyer: <INPUT TYPE = "FILE" NAME = "nom"> </FORM>

Le fichier transmis peut tre un fichier Word, une image, etc. Les champs de transfert de fichiers sont accompagns d'un bouton Parcourir, qui permet l'utilisateur d'aller chercher le fichier sur son disque. Ce bouton Parcourir est automatiquement insr par le navigateur.

5) Champ masqu: Les champs masqus ne sont pas utiliss pour recevoir des donnes, mais seulement pour fournir au serveur des informations qui n'apparaissent pas sur le formulaire. Les champs masqus sont dfinis par des balises du type: <INPUT TYPE = "HIDDEN" NAME = "nom" VALUE = "valeur">

Les champs masqus permettent notamment d'exploiter un seul script gnral pour le traitement de diffrents formulaires. Le script doit savoir de quel formulaire particulier lui parvient les donnes; un champ masqu peut livrer cette information cette information sans intervention de l'utilisateur. Ainsi, on peut crer un champ masqu, dans chaque formulaire, qui indiquera l'identit de ce dernier. La position du champ masqu dans le code n'est pas importante, du moment qu'il apparatra entre les balises <FORM> et </FORM>.

1.10.2.2. Cases cocher

45

Les cases cocher permettent l'utilisateur d'effectuer une slection multiple entre plusieurs options. Pour gnrer une case cocher on utilise le code suivant: <INPUT TYPE = "CHECKBOX" NAME = "nom" VALUE = "valeur" [CHECKED] > Chaque case cocher est dfinie par sa propre balise <INPUT>. L'attribut NAME spcifie le nom de la case. Ce nom doit tre unique. En effet, si toutes les cases cocher d'un groupe portent le mme nom, le script de traitement n'aura aucun moyen d'interprter la slection de l'utilisateur. L'attribut VALUE indique quelles donnes devront tre envoyer au serveur si l'utilisateur coche la case; cette information est transparente pour l'utilisateur. L'attribut facultatif CHECKED, lorsqu'il est stipul, indique que la case est coche par dfaut. Seules les donnes relatives aux cases cocher slectionnes sont transmises au serveur. Il n'est pas fait mention des autres. Exemple: <INPUT TYPE = CHECKBOX NAME = "BD" VALUE = "1"> Bases de Donnes <BR> <INPUT TYPE = CHECKBOX NAME = "RES" VALUE = "2"> Rseaux <BR> <INPUT TYPE = CHECKBOX NAME = "MT" VALUE = "3"> Maintenance <BR>

1.10.2.3. Boutons doptions Contrairement aux cases cocher, les boutons d'option sont utiliss pour effectuer une seule slection entre plusieurs options possibles. Pour produire un bouton d'option, on utilise le code suivant: <INPUT TYPE = "RADIO" NAME = "nom" VALUE = "valeur" [CHECKED]>

Les attributs VALUE et CHECKED jouent le mme rle que pour les cases cocher.

46

Gnralement, on cre un groupe de boutons d'option en utilisant plusieurs balises <INPUT> avec le mme nom (NAME). L'ensemble des boutons d'un groupe ne peut envoyer qu'une seule valeur au serveur. Exemple: <INPUT TYPE = RADIO NAME = "ACT" VALUE = "etudiant" CHECKED > Etudiant <BR> <INPUT TYPE = RADIO NAME = "ACT" VALUE = "prof" > Enseignant <BR> <INPUT TYPE = RADIO NAME = "ACT" VALUE = "tech" > Technicien <BR>

1.10.2.4. Zones de liste Les balises <SELECT> et </SELECT> permettent de gnrer des zones de liste droulantes ou de type "ComboBox". La syntaxe gnrale de ces composants est: <SELECT NAME = "nom" [SIZE = nombre d'lments affiches] [MULTIPLE] > <OPTION VALUE = "valeur1" [SELECTED] > texte d'option 1 </OPTION> <OPTION VALUE = "valeur2" [SELECTED] > texte d'option 2 </OPTION> <OPTION VALUE ="valeurN" [SELECTED] > texte d'option N </OPTION> </SELECT>

L'attribut NAME de la balise <SELECT> attribue un nom unique la liste. L'attribut facultatif SIZE spcifie le nombre d'options affiches simultanment. Les options non affiches seront accessibles grce aux barres de dfilement. La valeur par dfaut de SIZE est 1. L'attribut facultatif MULTIPLE autorise les slections multiples (par Ctrl-clic). Si on stipule SIZE = 1 sans spcifier l'attribut MULTIPLE, la liste sera reprsente comme une liste droulante. Autrement, la liste prendra la forme d'une zone de liste avec barres de dfilement (ou liste "Combo").

47

La balise <OPTION> dfinit un lment de la liste. L'attribut VALUE de la balise <OPTION> spcifie la valeur qui doit tre pass au serveur si l'option est slectionne. En l'absence de l'attribut VALUE, le texte de l'option sera transmis au serveur. L'attribut SELECTED de la balise <OPTION> permet de slectionner l'option par dfaut. Exemple: <SELECT NAME = "pays" SIZE = 1 > <OPTION VALUE = "ma" SELECTED > Maroc </OPTION> <OPTION VALUE = "arabe" > Pays Arabe </OPTION> <OPTION VALUE ="autre" > Autre </OPTION> </SELECT>

1.10.2.5. Boutons de commande La balise <INPUT> permet galement de gnrer des boutons de commande. Ces boutons sont rparties en trois types: SUBMIT (valider): Lorsque l'utilisateur clique sur ce bouton, les donnes du formulaire sont rassembles et envoyes au serveur. RESET (rinitialiser): En cliquant sur ce bouton, l'ensemble des donnes est effac et les champs reprennent leur valeur par dfaut. BUTTON: C'est un bouton "script" utilis, gnralement, pour dclencher un traitement en utilisant un script ct client (en JavaScript, VBScript).

1) Bouton de validation: Tout formulaire doit contenir un bouton de validation, afin que les donnes puissent tre transmises au serveur. Si le formulaire ne contient qu'un seul champ, la prsence d'un bouton de validation est optionnelle. Dans ce cas, la frappe de la touche Entre provoque automatiquement la validation des donnes. Pour crer un bouton de validation, on utilise le code:

48

<INPUT TYPE = "SUBMIT" NAME = "nom" VALUE = "valeur">

L'attribut NAME attribue un nom unique au bouton. Ce nom est utilis dans des script ct client (En JavaScript, VBScript,). L'attribut VALUE spcifie le texte qui apparatra sur le bouton. Exemple: <INPUT TYPE = "SUBMIT" VALUE = "Envoyer">

2) Bouton de rinitialisation: Le bouton de rinitialisation permet de remettre les champs leurs valeurs par dfaut. On utilise l'instruction suivante pour gnrer un bouton RESET:

<INPUT TYPE = "RESET" NAME = "nom" VALUE = "valeur">

Les attributs NAME et VALUE ont la mme fonction que pour le bouton de validation.

3) Bouton "script": Les boutons "scripts" ragissent au clic en excutant un script ct client. Un tel bouton ne peut rien faire par lui-mme. Pour qu'il ragisse aux clics, on doit utiliser l'vnement OnClick pour spcifier le script excuter. La dfinition d'un bouton "script" ressemble cela: <INPUT TYPE = "BUTTON" NAME = "nom" VALUE = "valeur" OnClick="fonction" >

Les attributs NAME et VALUE jouent le mme rle que pour les autres boutons.

49

L'vnement OnClick spcifie le script (une fonction en JavaScript ou VBScript,) excuter suite un clic sur le bouton.

Exemple: <INPUT TYPE =BUTTON NAME ="verifier" VALUE ="Vrifier les donnes"

OnCilck="verif()"> <!Lorsqu'on clique sur ce bouton, le navigateur excutera la fonction verif ().-->

1.11. Microsoft FrontPage Lors de llaboration de ce cours consacr la cration de pages Web, notre souci tait de prsenter les bases du langage HTML bien quil existe des diteurs de pages Web qui ne ncessitent nullement la connaissance du langage HTML. Un exemple de tels diteurs est le Microsoft FrontPage. Nous avons prfr quil soit la partie concluante de ce chapitre. Nous donnons ici une prsentation titre informatif et le plus brivement possible. Microsoft FrontPage fait partie de la suite de logiciels Office et a une interface commune avec ceux-ci. Il ressemble en quelque sorte Word avec des diffrences majeures : Le but de FrontPage est dditer et de publier des pages web. Ces pages sont seulement accessibles avec lutilisation dun navigateur. FrontPage enregistre ses documents dans le format HTML.

50

La barre des affichages permet de voir votre site Web de diffrentes perspectives. Elle contient des icnes permettant de grer des informations importantes sur votre site. Laffichage Page montre la page en cours. Laffichage Dossiers permet de visualiser les dossiers de votre site. Laffichage Rapport gnre un rapport avec des informations utiles voire des statistiques sur votre site. Le mode Navigation aide structurer et organiser les pages du site. Laffichage Liens Hypertexte permet de voir tous les liens dune page vers dautres destinations. La vue tches permet denregistrer les tches accomplir pour vous ou dautres personnes.

51

Sur la barre dtat se trouve un sablier rouge avec un nombre de secondes droite. Cette priode de temps reprsente le temps approximatif que la page prendra pour se charger dans un navigateur. Un site Web est un ensemble de pages HTML relies entre elles par des liens Hypertextes. Un site comprend les pages ainsi que les images rfrences dans chaque page de ce site. Lorsque vous commencez une nouvelle page, il est recommand de commencer par la saisie du texte. Une fois termine, vous pouvez appliquer la mise en forme.

Mise en forme et enregistrement Pour faire de la mise en forme, utilisez les boutons de la barre doutils Mise en forme ainsi que les commandes disponibles dans le menu Format. La bote de dialogue denregistrement comporte deux options supplmentaires : Titre de la page et Modifier. Ces deux derniers permettent dattribuer un titre de page pour la page Web en cours denregistrement. Lors de lenregistrement dune page Web, FrontPage affiche parfois une bote de dialogue signifiant que le mode page a un objet en mmoire et quil ne sait pas o lenregistrer.

52

1.1.9 Les listes FrontPage vous permet de crer plusieurs sortes de listes comme dans Word. Il ya des listes puce et numrotes. Pour crer une liste, cliquez sur la commande Puces et numros du menu Format.

Les liens Hypertextes Les liens Hypertextes sont le fondement de la navigation sur internet. FrontPage rend la tche de cration de toutes sortes de liens hypertextes trs facile. Pour crer un lien vers une autre page dans votre site : slectionnez le texte, puis cliquer sur la commande lien hypertexte du menu Insertion, la bote de dialogue suivante souvre :

La barre lien hypertexte permet de crer quatre types de liens : Un lien vers un fichier sur votre disque dur ou votre site. Un lien externe vers une autre page Web sur Internet ou dans votre site. Un lien vers une page vierge qui sera cre quand vous confirmerez la cration du lien.

53

Un lien de courrier lectronique. La procdure de cration de liens hypertextes est la mme si vous utilisez du texte ou une image.

Insertion de tableaux, images et cadres. Pour insrer un tableau, dplacez le point dinsertion lendroit o vous voulez crer le tableau, puis slectionnez Tableau/Insrer/Tableau. Pour insrer une image, cliquer sur le bouton Insertion/Image/A partir du fichier. Atteindre le dossier contenant limage et cliquez sur OK. Pour crer une page Web avec plusieurs cadres. Choisissez Nouvelle page du menu Nouveau, puis cliquez sur longlet cadres dans la bote de dialogue modle de pages et choisissez le modle qui vous convient. Pour dventuelles modifications, utilisez le menu Cadres.

54

55

Вам также может понравиться

  • Programmation Web 1
    Programmation Web 1
    Документ27 страниц
    Programmation Web 1
    Mejri Siwar
    Оценок пока нет
  • CoursCSS Id1466
    CoursCSS Id1466
    Документ21 страница
    CoursCSS Id1466
    Mariem Ben Kamel
    Оценок пока нет
  • 01 HTML Ensa
    01 HTML Ensa
    Документ165 страниц
    01 HTML Ensa
    Abderrahmane MoA
    Оценок пока нет
  • 2-HTML Partie 1
    2-HTML Partie 1
    Документ53 страницы
    2-HTML Partie 1
    Constan Tino
    Оценок пока нет
  • Cours HTML
    Cours HTML
    Документ34 страницы
    Cours HTML
    Hadj Hani Abed Elhamid
    Оценок пока нет
  • Cours Web-2022
    Cours Web-2022
    Документ182 страницы
    Cours Web-2022
    Ali Hamedoun
    Оценок пока нет
  • Le Langage HTML: Etude Des Balises HTML
    Le Langage HTML: Etude Des Balises HTML
    Документ16 страниц
    Le Langage HTML: Etude Des Balises HTML
    YAHIA JAMALEDDINE
    Оценок пока нет
  • HTML Et CSS
    HTML Et CSS
    Документ29 страниц
    HTML Et CSS
    wissem
    Оценок пока нет
  • HTML CSS JS
    HTML CSS JS
    Документ24 страницы
    HTML CSS JS
    Prince Tiwari
    Оценок пока нет
  • Act1 HTML css3 Creer Page Web
    Act1 HTML css3 Creer Page Web
    Документ7 страниц
    Act1 HTML css3 Creer Page Web
    api-237699078
    Оценок пока нет
  • Dev - Web - HTML
    Dev - Web - HTML
    Документ13 страниц
    Dev - Web - HTML
    Utilisateur 2
    Оценок пока нет
  • Pgmation Internet ISP
    Pgmation Internet ISP
    Документ230 страниц
    Pgmation Internet ISP
    Eddy SHANGA
    Оценок пока нет
  • HTML CSS
    HTML CSS
    Документ136 страниц
    HTML CSS
    Chaymae bellahcene
    Оценок пока нет
  • Cours HTML All
    Cours HTML All
    Документ56 страниц
    Cours HTML All
    alexis bab
    Оценок пока нет
  • HTML Ut
    HTML Ut
    Документ25 страниц
    HTML Ut
    Al Hassane bah
    Оценок пока нет
  • Cours Complet HTML & CSS
    Cours Complet HTML & CSS
    Документ109 страниц
    Cours Complet HTML & CSS
    djamel bentorkia
    100% (1)
  • HTML Partie 2
    HTML Partie 2
    Документ28 страниц
    HTML Partie 2
    Naima Zaki
    Оценок пока нет
  • CHTML
    CHTML
    Документ59 страниц
    CHTML
    marwa lmt
    Оценок пока нет
  • Chapitre1 HTML
    Chapitre1 HTML
    Документ18 страниц
    Chapitre1 HTML
    Amina Gtf
    Оценок пока нет
  • Programmation Web
    Programmation Web
    Документ13 страниц
    Programmation Web
    Meveille Manfo
    Оценок пока нет
  • Web Statique PDF
    Web Statique PDF
    Документ24 страницы
    Web Statique PDF
    Hiba Hfaidh
    Оценок пока нет
  • TP HTML
    TP HTML
    Документ6 страниц
    TP HTML
    Youssef Don Rajawi
    Оценок пока нет
  • Cours 1 Initiation À La Programmation WEB
    Cours 1 Initiation À La Programmation WEB
    Документ26 страниц
    Cours 1 Initiation À La Programmation WEB
    Gofly
    Оценок пока нет
  • CoursHTML Id2093
    CoursHTML Id2093
    Документ53 страницы
    CoursHTML Id2093
    kassimi
    Оценок пока нет
  • Chapitre 2 HTML5 Version 0 PDF
    Chapitre 2 HTML5 Version 0 PDF
    Документ83 страницы
    Chapitre 2 HTML5 Version 0 PDF
    buuuz tn
    Оценок пока нет
  • Cours Projet
    Cours Projet
    Документ76 страниц
    Cours Projet
    Farid Bou
    Оценок пока нет
  • Cours 1
    Cours 1
    Документ51 страница
    Cours 1
    Abdelaali Bakhouche
    Оценок пока нет
  • Internet Et Web
    Internet Et Web
    Документ57 страниц
    Internet Et Web
    Amira jablaoui
    Оценок пока нет
  • Cours HTML
    Cours HTML
    Документ26 страниц
    Cours HTML
    Achraf
    Оценок пока нет
  • Introduction Au HTML
    Introduction Au HTML
    Документ23 страницы
    Introduction Au HTML
    Med Aziz Saadaoui
    Оценок пока нет
  • 0122 Crswebhtml
    0122 Crswebhtml
    Документ6 страниц
    0122 Crswebhtml
    raphael lombard
    Оценок пока нет
  • Presentation HTML
    Presentation HTML
    Документ6 страниц
    Presentation HTML
    70moz
    Оценок пока нет
  • 2-HTML - Partie1
    2-HTML - Partie1
    Документ53 страницы
    2-HTML - Partie1
    nissrin.mahan
    Оценок пока нет
  • Memento Html5
    Memento Html5
    Документ16 страниц
    Memento Html5
    NerminZehic
    0% (2)
  • Export HTML Et CSS 2023-01-23 0047
    Export HTML Et CSS 2023-01-23 0047
    Документ7 страниц
    Export HTML Et CSS 2023-01-23 0047
    Miahy RAHARIJAONA
    Оценок пока нет
  • HTML (I)
    HTML (I)
    Документ4 страницы
    HTML (I)
    Zakaria Benharref
    Оценок пока нет
  • Cours Tech Web - v2
    Cours Tech Web - v2
    Документ88 страниц
    Cours Tech Web - v2
    Jesus Tekonbo
    Оценок пока нет
  • HTML - Les Bases
    HTML - Les Bases
    Документ70 страниц
    HTML - Les Bases
    Ngounou dorissa
    Оценок пока нет
  • Programmation Web: Prof. Hafida ZROURI
    Programmation Web: Prof. Hafida ZROURI
    Документ120 страниц
    Programmation Web: Prof. Hafida ZROURI
    ibtissam errachdi
    Оценок пока нет
  • Travaux Pratiques
    Travaux Pratiques
    Документ6 страниц
    Travaux Pratiques
    Moussa Mallé
    Оценок пока нет
  • Intro HTML
    Intro HTML
    Документ12 страниц
    Intro HTML
    Georges Abiad
    Оценок пока нет
  • Fiche N°1 Rappels HTML5
    Fiche N°1 Rappels HTML5
    Документ2 страницы
    Fiche N°1 Rappels HTML5
    Anonymous rQyZjgRM
    Оценок пока нет
  • HTML Html5
    HTML Html5
    Документ76 страниц
    HTML Html5
    Glenne Poaty
    Оценок пока нет
  • NSI HTML Et CSS: Les Bases: Nteraction Entre L Homme Et La Machine Sur Le Web
    NSI HTML Et CSS: Les Bases: Nteraction Entre L Homme Et La Machine Sur Le Web
    Документ8 страниц
    NSI HTML Et CSS: Les Bases: Nteraction Entre L Homme Et La Machine Sur Le Web
    Bruno Bucciarati
    Оценок пока нет
  • Cours HTML Css
    Cours HTML Css
    Документ52 страницы
    Cours HTML Css
    Mohamed Ayari
    100% (2)
  • I. Le Langage HTML: Chapitre 1 HMTL Et Css
    I. Le Langage HTML: Chapitre 1 HMTL Et Css
    Документ6 страниц
    I. Le Langage HTML: Chapitre 1 HMTL Et Css
    Madingu Kindamba
    Оценок пока нет
  • Programmation Web
    Programmation Web
    Документ58 страниц
    Programmation Web
    Meriem Benftima
    Оценок пока нет
  • WWW - Cours Gratuit - Com Coursinformatique Id3259
    WWW - Cours Gratuit - Com Coursinformatique Id3259
    Документ16 страниц
    WWW - Cours Gratuit - Com Coursinformatique Id3259
    allanriches49
    Оценок пока нет
  • 2 HTML
    2 HTML
    Документ95 страниц
    2 HTML
    Mostafa Ben Mousa
    Оценок пока нет
  • Cours HTML Juillet 21 Copie
    Cours HTML Juillet 21 Copie
    Документ56 страниц
    Cours HTML Juillet 21 Copie
    Abdel Gansonre
    Оценок пока нет
  • HTML CSS
    HTML CSS
    Документ118 страниц
    HTML CSS
    Younes Oulad Sayad
    Оценок пока нет
  • HTML5
    HTML5
    Документ72 страницы
    HTML5
    Mohamed Elmasoudi
    Оценок пока нет
  • TD HTML5
    TD HTML5
    Документ46 страниц
    TD HTML5
    Sirine Hedhli
    Оценок пока нет
  • CHAP1 Les Evenements
    CHAP1 Les Evenements
    Документ6 страниц
    CHAP1 Les Evenements
    GGDA
    Оценок пока нет
  • HTML Pour Article E-Sidoc
    HTML Pour Article E-Sidoc
    Документ3 страницы
    HTML Pour Article E-Sidoc
    pmommessin
    Оценок пока нет
  • Partie1 HTML GI4 2021 2022 Etudiants
    Partie1 HTML GI4 2021 2022 Etudiants
    Документ58 страниц
    Partie1 HTML GI4 2021 2022 Etudiants
    badi3bahida15
    Оценок пока нет
  • HTML Documentation
    HTML Documentation
    Документ4 страницы
    HTML Documentation
    Ibrahima sory Bah
    Оценок пока нет
  • Programmer en JavaScript
    Programmer en JavaScript
    От Everand
    Programmer en JavaScript
    Рейтинг: 4.5 из 5 звезд
    4.5/5 (2)
  • Bien débuter avec HTML: Formation professionnelle
    Bien débuter avec HTML: Formation professionnelle
    От Everand
    Bien débuter avec HTML: Formation professionnelle
    Оценок пока нет
  • Getting started with HTML: Professional training
    Getting started with HTML: Professional training
    От Everand
    Getting started with HTML: Professional training
    Оценок пока нет
  • Solution de Virtualisation
    Solution de Virtualisation
    Документ39 страниц
    Solution de Virtualisation
    Moulay Youssef Hadi
    100% (1)
  • Diagramme de Classe
    Diagramme de Classe
    Документ130 страниц
    Diagramme de Classe
    Moulay Youssef Hadi
    Оценок пока нет
  • Diagramme de Classe
    Diagramme de Classe
    Документ130 страниц
    Diagramme de Classe
    Moulay Youssef Hadi
    Оценок пока нет
  • TD Héritage
    TD Héritage
    Документ1 страница
    TD Héritage
    Moulay Youssef Hadi
    Оценок пока нет
  • Atelier 1
    Atelier 1
    Документ2 страницы
    Atelier 1
    Ferhati Azdine
    Оценок пока нет
  • Algo Iteratif-2
    Algo Iteratif-2
    Документ19 страниц
    Algo Iteratif-2
    Moulay Youssef Hadi
    Оценок пока нет
  • TP Prise en Main VB2005
    TP Prise en Main VB2005
    Документ23 страницы
    TP Prise en Main VB2005
    Moulay Youssef Hadi
    Оценок пока нет
  • C Superflu
    C Superflu
    Документ38 страниц
    C Superflu
    Moulay Youssef Hadi
    Оценок пока нет
  • C Superflu
    C Superflu
    Документ38 страниц
    C Superflu
    Moulay Youssef Hadi
    Оценок пока нет
  • Bure
    Bure
    Документ6 страниц
    Bure
    Moulay Youssef Hadi
    Оценок пока нет
  • CoursJavaScript Id1783 PDF
    CoursJavaScript Id1783 PDF
    Документ25 страниц
    CoursJavaScript Id1783 PDF
    Apollos_80
    Оценок пока нет
  • Formation HTML Css Niveau PDF
    Formation HTML Css Niveau PDF
    Документ76 страниц
    Formation HTML Css Niveau PDF
    najeh lsf
    100% (1)
  • Cours de Proyo
    Cours de Proyo
    Документ99 страниц
    Cours de Proyo
    Souheil Béji
    Оценок пока нет
  • Rapport Stage D x27 Initiation Informatique Ocp Safi
    Rapport Stage D x27 Initiation Informatique Ocp Safi
    Документ30 страниц
    Rapport Stage D x27 Initiation Informatique Ocp Safi
    Souhail Ghalim
    Оценок пока нет
  • Fascicule 3SI-TIC - Version Finale
    Fascicule 3SI-TIC - Version Finale
    Документ60 страниц
    Fascicule 3SI-TIC - Version Finale
    KhalilGhenimi
    Оценок пока нет
  • TP 3
    TP 3
    Документ9 страниц
    TP 3
    Radwan Chouayette
    Оценок пока нет
  • Cours - Architecture N-Tier
    Cours - Architecture N-Tier
    Документ27 страниц
    Cours - Architecture N-Tier
    Djadel Mourad
    Оценок пока нет
  • Cour HTML Licenc Info
    Cour HTML Licenc Info
    Документ31 страница
    Cour HTML Licenc Info
    SawsanDaki
    Оценок пока нет
  • Application Pour La Repartitio - NAIT ABDELLAH OUALI Ismail - 455
    Application Pour La Repartitio - NAIT ABDELLAH OUALI Ismail - 455
    Документ44 страницы
    Application Pour La Repartitio - NAIT ABDELLAH OUALI Ismail - 455
    changi
    Оценок пока нет
  • Section04 Papier
    Section04 Papier
    Документ22 страницы
    Section04 Papier
    NG WIL
    Оценок пока нет
  • Cyber Docs
    Cyber Docs
    Документ58 страниц
    Cyber Docs
    Isabel Silva
    Оценок пока нет
  • Création Site WEB
    Création Site WEB
    Документ86 страниц
    Création Site WEB
    Henri paterne Boundio
    Оценок пока нет
  • MVC Entity Framework
    MVC Entity Framework
    Документ13 страниц
    MVC Entity Framework
    guy
    Оценок пока нет
  • Exam Tecweb 2015-2016 SR
    Exam Tecweb 2015-2016 SR
    Документ2 страницы
    Exam Tecweb 2015-2016 SR
    hassanett21
    Оценок пока нет
  • Conception Et Réalisation Des Sites Web: Pr. Aziz Mabrouk
    Conception Et Réalisation Des Sites Web: Pr. Aziz Mabrouk
    Документ62 страницы
    Conception Et Réalisation Des Sites Web: Pr. Aziz Mabrouk
    hello
    Оценок пока нет
  • Cours Websem1
    Cours Websem1
    Документ20 страниц
    Cours Websem1
    Aymen SHA
    Оценок пока нет
  • Rapport WebServices
    Rapport WebServices
    Документ52 страницы
    Rapport WebServices
    houssem yahyaoui
    Оценок пока нет
  • Re-Mise en Forme
    Re-Mise en Forme
    Документ80 страниц
    Re-Mise en Forme
    Zela Tahire
    Оценок пока нет
  • ArcView9 II Annexe A
    ArcView9 II Annexe A
    Документ12 страниц
    ArcView9 II Annexe A
    Néhémson RANDRIANARISOANASY
    Оценок пока нет
  • Memento HTML
    Memento HTML
    Документ4 страницы
    Memento HTML
    Goldsmart Achraf
    Оценок пока нет
  • Cours de Programmation Web
    Cours de Programmation Web
    Документ134 страницы
    Cours de Programmation Web
    Jean Didier Batubenga
    100% (3)
  • Architecture Client Serveur
    Architecture Client Serveur
    Документ23 страницы
    Architecture Client Serveur
    strideworld
    Оценок пока нет
  • PHP 2
    PHP 2
    Документ17 страниц
    PHP 2
    Massi Yahi
    Оценок пока нет
  • Dev Web Cours1 PDF
    Dev Web Cours1 PDF
    Документ19 страниц
    Dev Web Cours1 PDF
    Chimere Gueye
    Оценок пока нет
  • Bien Utiliser Les Sprites Css
    Bien Utiliser Les Sprites Css
    Документ13 страниц
    Bien Utiliser Les Sprites Css
    Mohamed Namez
    Оценок пока нет
  • Module1 PHP
    Module1 PHP
    Документ111 страниц
    Module1 PHP
    Waldo Gost
    Оценок пока нет
  • TP Creer Un Site Statique
    TP Creer Un Site Statique
    Документ11 страниц
    TP Creer Un Site Statique
    Driss Essaadi
    Оценок пока нет
  • PHP Mise A Niveau
    PHP Mise A Niveau
    Документ14 страниц
    PHP Mise A Niveau
    Djamel Jamel
    Оценок пока нет
  • Whats New
    Whats New
    Документ208 страниц
    Whats New
    Aladin Ijijr
    Оценок пока нет
  • Mémento Pour L'enrichissement Typographique Dans Spip: Fonctionnalités Méthodes Commentaires
    Mémento Pour L'enrichissement Typographique Dans Spip: Fonctionnalités Méthodes Commentaires
    Документ1 страница
    Mémento Pour L'enrichissement Typographique Dans Spip: Fonctionnalités Méthodes Commentaires
    yacine-brahmi-2210
    Оценок пока нет