UniversityLibHub Documents

Historique d'Internet et HTML Basics

1/13
100%

Chapitre I : Historique de Internet et services

I.1 Introduction

Internet est un syst me d'interconnexion de machines qui constitue un r seau informatique mondial, utilisant un ensemble standardis de protocoles de transfert de donn es. C'est un r seau de r seaux, compos de millions de r seaux aussi bien publics que priv s, universitaires, commerciaux et gouvernementaux. Internet transporte un large spectre d'information et permet l' laboration d'applications et de services vari s comme le courrier lectronique, la messagerie instantan e et le World Wide Web.

Internet ayant t popularis par l'apparition du World Wide Web, les deux sont parfois confondus par le public non averti. Le World Wide Web n'est pourtant que l'une des applications d'Internet.

I.2 D finitions

R seau : Ensemble des ordinateurs et p riph riques connect s les uns aux autres. Notons que deux ordinateurs connect s ensemble constituent eux seuls un r seau minimal.

Protocole : m thode standard qui permet la communication entre des processus (s'ex cutant ventuellement sur diff rentes machines), c'est- -dire un ensemble de r gles et de proc dures respecter pour mettre et recevoir des donn es sur un r seau.

TCP/IP : Transmission Control Protocol/Internet Protocol : ensemble des r gles de communication sur internet se basant sur la notion adressage IP, c'est- -dire le fait de fournir une adresse IP chaque machine du r seau afin de pouvoir acheminer des paquets de donn es.

Adresse IP : Sur Internet, les ordinateurs communiquent entre eux gr ce au protocole IP (Internet Protocol), qui utilise des adresses num riques, appel es adresses IP, compos es de 4 nombres entiers (4 octets) entre 0 et 255 et not es sous la forme xxx.xxx.xxx.xxx. Par exemple, 194.153.205.26 est une adresse IP donn e sous une forme technique.

  • Ces adresses servent aux ordinateurs du r seau pour communiquer entre-eux, ainsi chaque ordinateur d'un r seau poss de une adresse IP unique sur ce r seau.
  • C'est l'ICANN (Internet Corporation for Assigned Names and Numbers, rempla ant l'IANA, Internet Assigned Numbers Agency, depuis 1998) qui est charg e d'attribuer des adresses IP publiques, c'est- -dire les adresses IP des ordinateurs directement connect s sur le r seau public internet.

Nom de domaine : Chaque ordinateur directement connect internet poss de au moins une adresse IP propre. Cependant, les utilisateurs ne veulent pas travailler avec des adresses num riques du genre 194.153.205.26 mais avec un nom de domaine ou des adresses plus explicites (appel es adresses FQDN) du type .

Web : On appelle Web (nom anglais signifiant toile ), contraction de World Wide Web (d'o l'acronyme www), une des possibilit s offertes par le r seau Internet de naviguer entre des documents reli s par des liens hypertextes.

Navigateur : cest loutil de l'internaute, lui permettant de surfer entre les pages web de ses sites pr f r s. Il s'agit d'un logiciel poss dant une interface graphique compos e de boutons de navigation, d'une barre d'adresse, d'une barre d' tat (g n ralement en bas de fen tre) et dont la majeure partie de la surface sert afficher les pages web.

Exemple : internet Explorer, Mozilla Firefox, Google Chrome&

Site Web : Un site web (aussi appel site internet) est un ensemble de fichiers HTML stock s sur un ordinateur connect en permanence internet et h bergeant les pages web (serveur web).

Un site web est habituellement architectur autour d'une page centrale, appel e page d'accueil et proposant des liens vers un ensemble d'autres pages h berg es sur le m me serveur, et parfois des liens dits externes , c'est- -dire de pages h berg es par un autre serveur.

Site Web statique : site web dont le contenu de ses pages web ne varie pas en fonction de la demande des internautes.

Site Web dynamique : site web contenant des pages web g n r es la demande et leur contenu varie en fonction des caract ristiques de la demande (heure, adresse IP de l'ordinateur du demandeur, formulaire rempli par le demandeur, etc.) qui ne sont connues qu'au moment de sa consultation.

URL(Uniform Resource Locator) : permet didentifier de mani re unique une ressource sur le Web. Elle pr cise le protocole dacc s, le nom du serveur qui h berge cette ressource et sa localisation sur le serveur. Exemple : <http://fr.wikipedia.org/wiki/Uniform_Resource_Locator> est lURL de la page web du site wikipedia d crivant lURL.

I.3 Historique dInternet

1962 : Joseph Liklider publie ses travaux sur les interactions sociales qui seraient possibles avec un r seau dordinateurs

1969 : naissance de lARPANET : un r seau d centralis reliant quatre grands centres universitaires am ricains par des c bles 50Kbps, et utilisant le NCP ("Network Control Protocol")

1972 : Ray Tomlison cr e le courrier lectronique

1973 : Vinton Cerf sp cifie le r seau TCP/IP

Fin des ann es 80 : ARPAnet

D but 1990 : Internet tel que nous le connaissons

I.4 Services dInternet

I.4.1 World Wide Web

Le concept du Web a t mis au point au CERN (Centre Europ en de Recherche Nucl aire) en 1991 par une quipe de chercheurs laquelle appartenaient Tim-Berners LEE, le cr ateur du concept d'hyperlien, consid r aujourd'hui comme le p re fondateur du Web.

Le principe de web repose sur l'utilisation d'hyperliens pour naviguer entre des documents (appel s pages web ) gr ce un logiciel appel navigateur. Une page web est ainsi un simple fichier texte crit dans un langage de description appel HTML (Hypertext Markup Language), permettant de d crire la mise en page du document et d'inclure des l ments graphiques ou bien des liens vers d'autres documents l'aide de balises.

I.4.2 Courrier lectronique

Le courrier lectronique, courriel, e-mail, mail (parfois m l), est un service de transmission de messages crits et de documents envoy s lectroniquement via un r seau informatique (principalement Internet) dans la bo te aux lettres lectronique dun destinataire choisi par l metteur.

Pour mettre et recevoir des messages par courrier lectronique, il faut disposer dune adresse lectronique et d'un client de messagerie ou dun (http://fr.wikipedia.org/wiki/Webmail) permettant l'acc s aux messages via un navigateur Web.

I.4.3 Internet Relay Chat (IRC)

IRC st un protocole de communication textuelle sur Internet. Il sert la communication instantan e principalement sous la forme de discussions en groupe par linterm diaire de canaux de discussion, mais peut aussi tre utilis pour de la communication de un un. Il peut par ailleurs tre utilis pour faire du transfert de fichier.

I.4.4 Messagerie instantan e

Contrairement au IRC, la messagerie Instantan e vous permet de contacter seulement les personnes qui vous int ressent. Aussi, pas besoin de se connecter l'un des serveurs IRC et d'entrer dans une chambre pour savoir qui est l . En ouvrant le logiciel, vous savez instantan ment si une personne de votre liste de contact est disponible ou pas ou commencer une conversation.

(http://www.icq.com/), Yahoo Messenger, AOL Instant Messenger (AIM), Microsoft Messenger sont parmi les logiciels les plus utilis s de ce service.

I.4.5 T l phonie sur lInternet

Ce service vous permet d'avoir des conversations par la voix sur l'Internet. C'est l' quivalent d'interurbains sans payer de frais. Vous payer seulement les co ts d'abonnement du service d'acc s l'Internet. Ce service ne fait que s'am liorer en qualit .

I.4.6 Vid o Conf rence sur l'Internet

La vid o conf rence est la communication entre les usagers en utilisant de la vid o et le son. Avec une petite cam ra vid o et un programme sp cialis , vous pouvez vous connecter un serveur qui s'occupe de la communication entre deux ou plusieurs personnes. Le logiciel plus connu est appel Skype.

I.5 Protocoles dInternet

Chaque protocole a des fonctions propres et, ensemble, ils fournissent un ventail de moyens permettant de r pondre la multiplicit et la diversit des besoins sur Internet.

HTTP (HyperText Transfer Protocol) : protocole mis en Suvre pour le chargement des (http://fr.wikipedia.org/wiki/Page_Web).

[HTTPS](http://fr.wikipedia.org/wiki/HTTPS) : version s curis e du HTTP pour la navigation en mode s curis .

[FTP](http://fr.wikipedia.org/wiki/File_Transfer_Protocol)(File Transfer Protocol) : protocole utilis pour le transfert de fichiers sur Internet.

[SMTP](http://fr.wikipedia.org/wiki/Simple_Mail_Transfer_Protocol) (Simple Mail Transfer Protocol) : mode d' change du (http://fr.wikipedia.org/wiki/Courrier_%C3%A9lectronique) en envoi.

[POP3](http://fr.wikipedia.org/wiki/Post_Office_Protocol) (Post Office Protocol version 3) : mode d' change du courrier lectronique en r ception.

(http://fr.wikipedia.org/wiki/Internet_Message_Access_Protocol) (Internet Message Access Protocol) : un autre mode d' change de courrier lectronique.

IRC (Internet Relay Chat) : protocole de discussion instantan e.

[SSL](http://fr.wikipedia.org/wiki/Transport_Layer_Security) ou [TLS](http://fr.wikipedia.org/wiki/Transport_Layer_Security): protocoles de transaction s curis e, utilis s notamment pour le paiement s curis .

Chapitre II : Le langage HTML

II.1 D finition

Publicité

Le HTML ( HyperText Mark-Up Language ) est un langage dit de marquage (de structuration ou de balisage ) dont le r le est de formaliser l' criture d'un document avec des balises de formatage. Les balises permettent d'indiquer la fa on dont doit tre pr sent le document et les liens qu'il tablit avec d'autres documents.

Le langage HTML permet notamment la lecture de documents sur (http://www.commentcamarche.net/contents/522-internet) partir de machines diff rentes, gr ce au (http://www.commentcamarche.net/contents/520-le-protocole-http).

Le langage HTML est un standard publi par W3C (World Wide Web Consortium).

II.2 Historique de HTML

1991 : naissance du Web et du langage HTML

1993 : premi re version de HTML : HTML 1.0, navigateur NCSA Mosa c

1995 : premi re version officielle de HTML HTML2.0 rfc 1866

Janvier 1997 :HTML 3.2, apports : standardisation des tableaux et un grand nombre d l ments de pr sentation

D cembre 1997 : HTML4.0 standardise les feuilles de style et les cadres.

2012 : HTML 5 : nouvelles possibilit s dans la cr ation dapplications web avec lint gration d l ments mutim dia.

II.3 Structure dun document HTML

La structure g n rale dun document HTML doit tre selon cette allure :

![](data:image/png;base64...)

  • Le document doit tre entour de marqueurs (Angl. tags) <html> ....</html>
  • Len-t te (head) est utilis pour stocker de linformation propos du document. Dans la plupart des cas, il sagit uniquement du titre.
  • Le titre (title) du document est utilis deux fins:

+ Dans la plupart des browsers, le titre est affich dans la barre sup rieure de la fen tre.

+ Le titre est souvent utilis par les search robots pour indexer votre page. Choisissez donc quelque chose de significatif.

  • Toute la page HTML proprement dite (ce qui est visible dans le browser) est incluse dans le corps (BODY).

II.4 Notions de base

II.4.1 Balise HTML

  • Une balise est un l ment du texte (un nom) encadr par (<) et (>). Exemple : <head>
  • Les balises HTML ne sont pas sensibles la casse : pas de diff rence entre majuscules et minuscules.
  • Les balises fonctionnent par paire afin dagir sur les l ments quelles encadrent. La premi re balise est dite ouvrant et la seconde est dite fermante. La balise fermante est pr c d e par /.

Exemple :

<b> Ce texte est en gras </b> : met le texte encadr en gras.

  • Les balises HTML peuvent tre uniques. Exemple : <br> repr sente un retour la ligne.
  • Les balises peuvent tre imbriqu es de mani re hi rarchique. Le chevauchement nest pas accept .

Exemple :

<i><u>Bonjour</u>tout le monde</i> (Bonjour tout le monde)

<i><b>Ceci est un exemple</i>incorrect </b> (incorrect)

II.4.2 Attribut HTML

Un attribut est un l ment, pr sent au sein de la balise ouvrante, permettant de d finir des propri t s suppl mentaires. Les attributs se pr sentent la plupart du temps comme une paire cl =valeur, mais certains attributs ne sont parfois d finis que par la cl .

Exemple :

<p align="right">Exemple de paragraphe</p>

Dans cet exemple, dans la balise de paragraphe <p>, on a sp cifi lattribut align="right"> qui permet daligner droite le texte du paragraphe.

II.5 Titres, s parateurs et paragraphes

II.5.1 Titres

Il existe 6 niveaux de titre dans HTML.

Un retour la ligne est automatiquement ins r apr s un titre.

Syntaxe: <Hn>...</Hn>

o n est compris entre 1 et 6 (H1 est le plus grand titre possible)

Exemple

<H1>Titre de niveau 1</H1>

<H4>Titre de niveau 4</H4>

Attribut:

  • ALIGN sert sp cifier lalignement horizontal dun titre.

Syntaxe: ALIGN="LEFT ou CENTER ou RIGHT"

<h1 align="center">Texte du titre centr </h1>

II.5.2 Paragraphe

a/ Paragraphe simple

Le marqueur de paragraphe "p" produit un double retour de ligne.

Syntaxe: <p>...</p>

A l'int rieur d'un paragraphe, les espaces, tabulations et retours chariot comptent pour un seul espace.

Attribut:

  • ALIGN sert sp cifier lalignement horizontal du paragraphe.

Syntaxe: ALIGN="LEFT ou CENTER ou RIGHT"

Exemple

<p align="center">Ceci est un premier paragraphe centr </p>

Publicité

<p align="right">Ceci est un paragraphe align droite</p>

b/ Paragraphe en retrait

  • Le marqueur blockquote d cale le paragraphe droite.

Syntaxe: <blockquote>...</ blockquote >

Exemple

<blockquote>ce paragraphe a un retrait droite</blockquote>

c/ Paragraphe format

Le marqueur pre" est utilis lorsquon d sire afficher du texte avec un caract re non-proportionnel (monospaced font). Un m prendra autant de place quun i.

Lorsquon ins re plusieurs espaces la suite, ceux-ci sont maintenus laffichage (ce qui nest pas le cas avec le texte normal)

Syntaxe: <pre> ... </pre>

Exemple

<pre>

ligne 1

ligne2 pr c d e despaces

</pre>

d/ Adresse et signature

Address est utilis pour les indications relatives lauteur, la date de cr ation et la version du document.

Syntaxe: <address> ... </address>

Exemple

<address>

Ce document a t cr par les tidients de lISET de Bizerte

Derni re modification: 12/1/2011

</address>

II.5.3 S parateur

a/ Retour la ligne

Le marqueur br effectue un simple retour de ligne.

Il nest pas n cessaire de le fermer par </br>.

Syntaxe: <br>

Attribut :

CLEAR permet de forcer lalignement du texte. Ce param tre est particuli rement utile lorsquon lutilise conjointement avec des images. Il introduit des retours de lignes jusqu ce que la marge droite, gauche ou les deux soient libres.

CLEAR="LEFT ou RIGHT ou ALL"

<br clear=left>

<br clear=all>

b/ Ligne horizontale

Le marqueur hr ins re une barre horizontale.

Syntaxe: <hr>

Attributs :

  • SIZE : sp cifie l paisseur de la barre horizontale en pixels. La valeur par d faut est 1.
  • WIDTH : sp cifie la longueur de la ligne, soit en pixels, soit en pourcentage de la largeur de la fen tre.
  • ALIGN : sp cifie lalignement de la barre

ALIGN="LEFT ou RIGHT ou CENTER"

  • NOSHADE : ne prend pas de valeur. Lorsquil est pr sent dans le marqueur hr leffet est une ligne pleine sans ombrage.

Exemple :

<hr size="3" width="200" align="center" noshade>

c/ La balise DIV

La balise DIV permet de regrouper des l ments.

On peut associer des attributs communs aux l ments contenus entres les balises <div>

<div align="center">

<h1> Introduction </h1>

<p>

Bonjour

</p></div>

Cette balise est surtout utile pour associer des styles

<DIV class="cours">

.....

</DIV>

Publicité

II.6 Mise en forme de caract res et caract res sp ciaux

II.6.1 Balises de style

Les balises de style modifient la typographie du texte. Elles peuvent tre imbriqu es dans d'autres balises de style de la m me fa on qu'on le ferait avec un traitement de texte.

| | |

| --- | --- |

| Balise de style | Effet Visuel |

| <ABBREV> | Abr viation |

| <ACRONYM> | Acronyme |

| <B> | Met la police en gras |

| <BIG> | Police plus grande |

| <CITE> | Citation |

| <CODE> | Instruction |

| <DEL> | ~~Texte supprim mais qui reste pr sent~~ |

| <DFN> | D finition d'instance |

| <EM> | Emphase |

| <I> | Italique |

| <INS> | Nouveau texte ins r cet endroit |

| <KBD> | Clavier - Suite de caract res devant tre tap s tel quel |

| <Q> | Encadre le texte par des guillemets |

| <S> | ~~Comme strike (barr )~~ |

| <SAMP> | Exemple |

| <SMALL> | Police plus petite |

| <STRONG> | Forte accentuation rendue par du gras |

| <STRIKE> | ~~Texte barr (comme S)~~ |

| <SUB> | Texte en Indice |

| <SUP> | Texte en Exposant |

| <TT> | Caract re de machine |

II.6.2 Police

Pour modifier la police de votre texte il suffit dutiliser la balise: <font>.

Syntaxe : <font face= & color= & size= & >.votre texte</font>

Attributs :

  • Face : sp cifie la police utilis e.
  • size : sp cifie la taille de la police.
  • color : sp cifie la couleur de la police soit en sp cifiant le nom de la couleur soit le code de la couleur en "#RRVVBB" (RR, VV et BB repr sentent respectivement un nombre hexad cimal entre 00 et FF pour le Rouge, le Vert et le Bleu).

Exemple :

<font face="Times New Roman, Times, serif" color="#FF0000" size="+2" >exemple de police </font>

![](data:image/png;base64...)

II.6.3 Caract res sp ciaux

Le standard HTML demande de respecter le codage des caract res ASCII 7 bits, c'est- -dire que les caract res accentu s ne sont pas autoris s. Il faut pour cela utiliser un codage particulier.

Exemple :

| | |

| --- | --- |

| Caract re | Code |

| " | &quot; |

| & | &amp; |

| Space | &nbsp; |

| | &agrave; |

| E | &egrave ; |

| E | &eacute; |

II.7 Les listes

II.7.1 Liste puce

Pour cr er une liste puce, on dispose de la balise <ul>

Pour sp cifier le titre de la liste, on utilise <lh>

Les l ments de la liste sont r alis s gr ce la balise <li>

Syntaxe:

<ul>

Publicité

<lh>&</lh>

<li>&</li>

<li>&</li>

&

</ul>

Exemple :

<ul>

<lh>Titre de la liste</lh>

<li>El ment 1</li>

<li>El ment 2</li>

</ul>

II.7.2 Liste num rot e

Syntaxe: <ol> ... </ol>

<ol>

<lh>Titre de la liste</lh>

<li>El ment 1</li> <li>El ment 2</li>

</ol>

II.7.3 Liste de d finition

Le marqueur dl : D limite une zone de liste de d finition qui contient des termes "dt" et des descriptions "dd"

Syntaxe: <dl> ... </dl>

Le marqueur dt : Introduit un nouveau terme de d finition.

Syntaxe: <dt> ... </dt>

Le marqueur dd : introduit une description du terme de d finition. Le r sultat l cran est un d calage du texte vers la droite.

Syntaxe: <dd> ... </dd>

<dl>

<th>Titre de la liste

<dt>Terme 1</dt>

<dd>D finition du terme 1</dd>

<dt>Terme 2</dt>

<dd>D finition du terme 2</dd>

....

</dl>

II.7.4 Attributs de liste

Il existe des attributs sp cifiques aux listes:

| | | |

| --- | --- | --- |

| Attribut | Valeur | Effet Visuel |

| | | |

| COMPACT | | resserre l'interligne |

| PLAIN | | supprime les puces |

| SEQNUM | | d finit le premier num ro |

| START | | d finit le premier num ro |

| CONTINUE | | repart du num ro o il s' tait arr t la liste pr c dente |

| TYPE (pour les listes ordonn es) | 1 A a I i | num rotation chiffr e (par d faut) num rotation en capitales num rotation en bas de casse num rotation en chiffres romains (I, II, III, IV ...) num rotation en chiffres romains en bas de casse |

| TYPE (pour les listes non-ordonn es) | circle square disc | puce circulaire puce carr e puce en disque |

II.7.5 Combinaison de liste

Les listes peuvent tre embo t es les unes dans les autres, il suffit pour cela de d finir un l ment dune liste comme tant une autre liste.

| |

| --- |

| <ol> <li> Achats faire </li> <p> <ul> <li> 2 litres de lait </li> <li> 1 kg de pain mi-blanc </li> </ul> <li> Recette </li> <dl> <dt>Pain</dt> <dd>Il faut de la farine et de leau, de la levure.</dd> <dt>Lait</dt> <dd>Si vous tes en ville, aucune chance ... Il faut trouver une vache </dd> </dl> <li> Dernier l ment num rot </li> </ol> |

![](data:image/png;base64...)

Historique d'Internet et HTML Basics

Computer Science · notes

Voir tous les documents en développement web

Chapitre I : Historique de Internet et services

I.1 Introduction

Internet est un syst me d'interconnexion de machines qui constitue un r seau informatique mondial, utilisant un ensemble standardis de protocoles de transfert de donn es. C'est un r seau de r seaux, compos de millions de r seaux aussi bien publics que priv s, universitaires, commerciaux et gouvernementaux. Internet transporte un large spectre d'information et permet l' laboration d'applications et de services vari s comme le courrier lectronique, la messagerie instantan e et le World Wide Web.

Internet ayant t popularis par l'apparition du World Wide Web, les deux sont parfois confondus par le public non averti. Le World Wide Web n'est pourtant que l'une des applications d'Internet.

I.2 D finitions

R seau : Ensemble des ordinateurs et p riph riques connect s les uns aux autres. Notons que deux ordinateurs connect s ensemble constituent eux seuls un r seau minimal.

Protocole : m thode standard qui permet la communication entre des processus (s'ex cutant ventuellement sur diff rentes machines), c'est- -dire un ensemble de r gles et de proc dures respecter pour mettre et recevoir des donn es sur un r seau.

TCP/IP : Transmission Control Protocol/Internet Protocol : ensemble des r gles de communication sur internet se basant sur la notion adressage IP, c'est- -dire le fait de fournir une adresse IP chaque machine du r seau afin de pouvoir acheminer des paquets de donn es.

Adresse IP : Sur Internet, les ordinateurs communiquent entre eux gr ce au protocole IP (Internet Protocol), qui utilise des adresses num riques, appel es adresses IP, compos es de 4 nombres entiers (4 octets) entre 0 et 255 et not es sous la forme xxx.xxx.xxx.xxx. Par exemple, 194.153.205.26 est une adresse IP donn e sous une forme technique.

  • Ces adresses servent aux ordinateurs du r seau pour communiquer entre-eux, ainsi chaque ordinateur d'un r seau poss de une adresse IP unique sur ce r seau.
  • C'est l'ICANN (Internet Corporation for Assigned Names and Numbers, rempla ant l'IANA, Internet Assigned Numbers Agency, depuis 1998) qui est charg e d'attribuer des adresses IP publiques, c'est- -dire les adresses IP des ordinateurs directement connect s sur le r seau public internet.

Nom de domaine : Chaque ordinateur directement connect internet poss de au moins une adresse IP propre. Cependant, les utilisateurs ne veulent pas travailler avec des adresses num riques du genre 194.153.205.26 mais avec un nom de domaine ou des adresses plus explicites (appel es adresses FQDN) du type .

Web : On appelle Web (nom anglais signifiant toile ), contraction de World Wide Web (d'o l'acronyme www), une des possibilit s offertes par le r seau Internet de naviguer entre des documents reli s par des liens hypertextes.

Navigateur : cest loutil de l'internaute, lui permettant de surfer entre les pages web de ses sites pr f r s. Il s'agit d'un logiciel poss dant une interface graphique compos e de boutons de navigation, d'une barre d'adresse, d'une barre d' tat (g n ralement en bas de fen tre) et dont la majeure partie de la surface sert afficher les pages web.

Exemple : internet Explorer, Mozilla Firefox, Google Chrome&

Site Web : Un site web (aussi appel site internet) est un ensemble de fichiers HTML stock s sur un ordinateur connect en permanence internet et h bergeant les pages web (serveur web).

Un site web est habituellement architectur autour d'une page centrale, appel e page d'accueil et proposant des liens vers un ensemble d'autres pages h berg es sur le m me serveur, et parfois des liens dits externes , c'est- -dire de pages h berg es par un autre serveur.

Site Web statique : site web dont le contenu de ses pages web ne varie pas en fonction de la demande des internautes.

Site Web dynamique : site web contenant des pages web g n r es la demande et leur contenu varie en fonction des caract ristiques de la demande (heure, adresse IP de l'ordinateur du demandeur, formulaire rempli par le demandeur, etc.) qui ne sont connues qu'au moment de sa consultation.

URL(Uniform Resource Locator) : permet didentifier de mani re unique une ressource sur le Web. Elle pr cise le protocole dacc s, le nom du serveur qui h berge cette ressource et sa localisation sur le serveur. Exemple : <http://fr.wikipedia.org/wiki/Uniform_Resource_Locator> est lURL de la page web du site wikipedia d crivant lURL.

I.3 Historique dInternet

1962 : Joseph Liklider publie ses travaux sur les interactions sociales qui seraient possibles avec un r seau dordinateurs

1969 : naissance de lARPANET : un r seau d centralis reliant quatre grands centres universitaires am ricains par des c bles 50Kbps, et utilisant le NCP ("Network Control Protocol")

1972 : Ray Tomlison cr e le courrier lectronique

1973 : Vinton Cerf sp cifie le r seau TCP/IP

Fin des ann es 80 : ARPAnet

D but 1990 : Internet tel que nous le connaissons

I.4 Services dInternet

I.4.1 World Wide Web

Le concept du Web a t mis au point au CERN (Centre Europ en de Recherche Nucl aire) en 1991 par une quipe de chercheurs laquelle appartenaient Tim-Berners LEE, le cr ateur du concept d'hyperlien, consid r aujourd'hui comme le p re fondateur du Web.

Le principe de web repose sur l'utilisation d'hyperliens pour naviguer entre des documents (appel s pages web ) gr ce un logiciel appel navigateur. Une page web est ainsi un simple fichier texte crit dans un langage de description appel HTML (Hypertext Markup Language), permettant de d crire la mise en page du document et d'inclure des l ments graphiques ou bien des liens vers d'autres documents l'aide de balises.

I.4.2 Courrier lectronique

Le courrier lectronique, courriel, e-mail, mail (parfois m l), est un service de transmission de messages crits et de documents envoy s lectroniquement via un r seau informatique (principalement Internet) dans la bo te aux lettres lectronique dun destinataire choisi par l metteur.

Pour mettre et recevoir des messages par courrier lectronique, il faut disposer dune adresse lectronique et d'un client de messagerie ou dun (http://fr.wikipedia.org/wiki/Webmail) permettant l'acc s aux messages via un navigateur Web.

I.4.3 Internet Relay Chat (IRC)

IRC st un protocole de communication textuelle sur Internet. Il sert la communication instantan e principalement sous la forme de discussions en groupe par linterm diaire de canaux de discussion, mais peut aussi tre utilis pour de la communication de un un. Il peut par ailleurs tre utilis pour faire du transfert de fichier.

I.4.4 Messagerie instantan e

Contrairement au IRC, la messagerie Instantan e vous permet de contacter seulement les personnes qui vous int ressent. Aussi, pas besoin de se connecter l'un des serveurs IRC et d'entrer dans une chambre pour savoir qui est l . En ouvrant le logiciel, vous savez instantan ment si une personne de votre liste de contact est disponible ou pas ou commencer une conversation.

(http://www.icq.com/), Yahoo Messenger, AOL Instant Messenger (AIM), Microsoft Messenger sont parmi les logiciels les plus utilis s de ce service.

I.4.5 T l phonie sur lInternet

Ce service vous permet d'avoir des conversations par la voix sur l'Internet. C'est l' quivalent d'interurbains sans payer de frais. Vous payer seulement les co ts d'abonnement du service d'acc s l'Internet. Ce service ne fait que s'am liorer en qualit .

I.4.6 Vid o Conf rence sur l'Internet

La vid o conf rence est la communication entre les usagers en utilisant de la vid o et le son. Avec une petite cam ra vid o et un programme sp cialis , vous pouvez vous connecter un serveur qui s'occupe de la communication entre deux ou plusieurs personnes. Le logiciel plus connu est appel Skype.

I.5 Protocoles dInternet

Chaque protocole a des fonctions propres et, ensemble, ils fournissent un ventail de moyens permettant de r pondre la multiplicit et la diversit des besoins sur Internet.

HTTP (HyperText Transfer Protocol) : protocole mis en Suvre pour le chargement des (http://fr.wikipedia.org/wiki/Page_Web).

[HTTPS](http://fr.wikipedia.org/wiki/HTTPS) : version s curis e du HTTP pour la navigation en mode s curis .

[FTP](http://fr.wikipedia.org/wiki/File_Transfer_Protocol)(File Transfer Protocol) : protocole utilis pour le transfert de fichiers sur Internet.

[SMTP](http://fr.wikipedia.org/wiki/Simple_Mail_Transfer_Protocol) (Simple Mail Transfer Protocol) : mode d' change du (http://fr.wikipedia.org/wiki/Courrier_%C3%A9lectronique) en envoi.

[POP3](http://fr.wikipedia.org/wiki/Post_Office_Protocol) (Post Office Protocol version 3) : mode d' change du courrier lectronique en r ception.

(http://fr.wikipedia.org/wiki/Internet_Message_Access_Protocol) (Internet Message Access Protocol) : un autre mode d' change de courrier lectronique.

IRC (Internet Relay Chat) : protocole de discussion instantan e.

[SSL](http://fr.wikipedia.org/wiki/Transport_Layer_Security) ou [TLS](http://fr.wikipedia.org/wiki/Transport_Layer_Security): protocoles de transaction s curis e, utilis s notamment pour le paiement s curis .

Chapitre II : Le langage HTML

II.1 D finition

Publicité

Le HTML ( HyperText Mark-Up Language ) est un langage dit de marquage (de structuration ou de balisage ) dont le r le est de formaliser l' criture d'un document avec des balises de formatage. Les balises permettent d'indiquer la fa on dont doit tre pr sent le document et les liens qu'il tablit avec d'autres documents.

Le langage HTML permet notamment la lecture de documents sur (http://www.commentcamarche.net/contents/522-internet) partir de machines diff rentes, gr ce au (http://www.commentcamarche.net/contents/520-le-protocole-http).

Le langage HTML est un standard publi par W3C (World Wide Web Consortium).

II.2 Historique de HTML

1991 : naissance du Web et du langage HTML

1993 : premi re version de HTML : HTML 1.0, navigateur NCSA Mosa c

1995 : premi re version officielle de HTML HTML2.0 rfc 1866

Janvier 1997 :HTML 3.2, apports : standardisation des tableaux et un grand nombre d l ments de pr sentation

D cembre 1997 : HTML4.0 standardise les feuilles de style et les cadres.

2012 : HTML 5 : nouvelles possibilit s dans la cr ation dapplications web avec lint gration d l ments mutim dia.

II.3 Structure dun document HTML

La structure g n rale dun document HTML doit tre selon cette allure :

![](data:image/png;base64...)

  • Le document doit tre entour de marqueurs (Angl. tags) <html> ....</html>
  • Len-t te (head) est utilis pour stocker de linformation propos du document. Dans la plupart des cas, il sagit uniquement du titre.
  • Le titre (title) du document est utilis deux fins:

+ Dans la plupart des browsers, le titre est affich dans la barre sup rieure de la fen tre.

+ Le titre est souvent utilis par les search robots pour indexer votre page. Choisissez donc quelque chose de significatif.

  • Toute la page HTML proprement dite (ce qui est visible dans le browser) est incluse dans le corps (BODY).

II.4 Notions de base

II.4.1 Balise HTML

  • Une balise est un l ment du texte (un nom) encadr par (<) et (>). Exemple : <head>
  • Les balises HTML ne sont pas sensibles la casse : pas de diff rence entre majuscules et minuscules.
  • Les balises fonctionnent par paire afin dagir sur les l ments quelles encadrent. La premi re balise est dite ouvrant et la seconde est dite fermante. La balise fermante est pr c d e par /.

Exemple :

<b> Ce texte est en gras </b> : met le texte encadr en gras.

  • Les balises HTML peuvent tre uniques. Exemple : <br> repr sente un retour la ligne.
  • Les balises peuvent tre imbriqu es de mani re hi rarchique. Le chevauchement nest pas accept .

Exemple :

<i><u>Bonjour</u>tout le monde</i> (Bonjour tout le monde)

<i><b>Ceci est un exemple</i>incorrect </b> (incorrect)

II.4.2 Attribut HTML

Un attribut est un l ment, pr sent au sein de la balise ouvrante, permettant de d finir des propri t s suppl mentaires. Les attributs se pr sentent la plupart du temps comme une paire cl =valeur, mais certains attributs ne sont parfois d finis que par la cl .

Exemple :

<p align="right">Exemple de paragraphe</p>

Dans cet exemple, dans la balise de paragraphe <p>, on a sp cifi lattribut align="right"> qui permet daligner droite le texte du paragraphe.

II.5 Titres, s parateurs et paragraphes

II.5.1 Titres

Il existe 6 niveaux de titre dans HTML.

Un retour la ligne est automatiquement ins r apr s un titre.

Syntaxe: <Hn>...</Hn>

o n est compris entre 1 et 6 (H1 est le plus grand titre possible)

Exemple

<H1>Titre de niveau 1</H1>

<H4>Titre de niveau 4</H4>

Attribut:

  • ALIGN sert sp cifier lalignement horizontal dun titre.

Syntaxe: ALIGN="LEFT ou CENTER ou RIGHT"

<h1 align="center">Texte du titre centr </h1>

II.5.2 Paragraphe

a/ Paragraphe simple

Le marqueur de paragraphe "p" produit un double retour de ligne.

Syntaxe: <p>...</p>

A l'int rieur d'un paragraphe, les espaces, tabulations et retours chariot comptent pour un seul espace.

Attribut:

  • ALIGN sert sp cifier lalignement horizontal du paragraphe.

Syntaxe: ALIGN="LEFT ou CENTER ou RIGHT"

Exemple

<p align="center">Ceci est un premier paragraphe centr </p>

Publicité

<p align="right">Ceci est un paragraphe align droite</p>

b/ Paragraphe en retrait

  • Le marqueur blockquote d cale le paragraphe droite.

Syntaxe: <blockquote>...</ blockquote >

Exemple

<blockquote>ce paragraphe a un retrait droite</blockquote>

c/ Paragraphe format

Le marqueur pre" est utilis lorsquon d sire afficher du texte avec un caract re non-proportionnel (monospaced font). Un m prendra autant de place quun i.

Lorsquon ins re plusieurs espaces la suite, ceux-ci sont maintenus laffichage (ce qui nest pas le cas avec le texte normal)

Syntaxe: <pre> ... </pre>

Exemple

<pre>

ligne 1

ligne2 pr c d e despaces

</pre>

d/ Adresse et signature

Address est utilis pour les indications relatives lauteur, la date de cr ation et la version du document.

Syntaxe: <address> ... </address>

Exemple

<address>

Ce document a t cr par les tidients de lISET de Bizerte

Derni re modification: 12/1/2011

</address>

II.5.3 S parateur

a/ Retour la ligne

Le marqueur br effectue un simple retour de ligne.

Il nest pas n cessaire de le fermer par </br>.

Syntaxe: <br>

Attribut :

CLEAR permet de forcer lalignement du texte. Ce param tre est particuli rement utile lorsquon lutilise conjointement avec des images. Il introduit des retours de lignes jusqu ce que la marge droite, gauche ou les deux soient libres.

CLEAR="LEFT ou RIGHT ou ALL"

<br clear=left>

<br clear=all>

b/ Ligne horizontale

Le marqueur hr ins re une barre horizontale.

Syntaxe: <hr>

Attributs :

  • SIZE : sp cifie l paisseur de la barre horizontale en pixels. La valeur par d faut est 1.
  • WIDTH : sp cifie la longueur de la ligne, soit en pixels, soit en pourcentage de la largeur de la fen tre.
  • ALIGN : sp cifie lalignement de la barre

ALIGN="LEFT ou RIGHT ou CENTER"

  • NOSHADE : ne prend pas de valeur. Lorsquil est pr sent dans le marqueur hr leffet est une ligne pleine sans ombrage.

Exemple :

<hr size="3" width="200" align="center" noshade>

c/ La balise DIV

La balise DIV permet de regrouper des l ments.

On peut associer des attributs communs aux l ments contenus entres les balises <div>

<div align="center">

<h1> Introduction </h1>

<p>

Bonjour

</p></div>

Cette balise est surtout utile pour associer des styles

<DIV class="cours">

.....

</DIV>

Publicité

II.6 Mise en forme de caract res et caract res sp ciaux

II.6.1 Balises de style

Les balises de style modifient la typographie du texte. Elles peuvent tre imbriqu es dans d'autres balises de style de la m me fa on qu'on le ferait avec un traitement de texte.

| | |

| --- | --- |

| Balise de style | Effet Visuel |

| <ABBREV> | Abr viation |

| <ACRONYM> | Acronyme |

| <B> | Met la police en gras |

| <BIG> | Police plus grande |

| <CITE> | Citation |

| <CODE> | Instruction |

| <DEL> | ~~Texte supprim mais qui reste pr sent~~ |

| <DFN> | D finition d'instance |

| <EM> | Emphase |

| <I> | Italique |

| <INS> | Nouveau texte ins r cet endroit |

| <KBD> | Clavier - Suite de caract res devant tre tap s tel quel |

| <Q> | Encadre le texte par des guillemets |

| <S> | ~~Comme strike (barr )~~ |

| <SAMP> | Exemple |

| <SMALL> | Police plus petite |

| <STRONG> | Forte accentuation rendue par du gras |

| <STRIKE> | ~~Texte barr (comme S)~~ |

| <SUB> | Texte en Indice |

| <SUP> | Texte en Exposant |

| <TT> | Caract re de machine |

II.6.2 Police

Pour modifier la police de votre texte il suffit dutiliser la balise: <font>.

Syntaxe : <font face= & color= & size= & >.votre texte</font>

Attributs :

  • Face : sp cifie la police utilis e.
  • size : sp cifie la taille de la police.
  • color : sp cifie la couleur de la police soit en sp cifiant le nom de la couleur soit le code de la couleur en "#RRVVBB" (RR, VV et BB repr sentent respectivement un nombre hexad cimal entre 00 et FF pour le Rouge, le Vert et le Bleu).

Exemple :

<font face="Times New Roman, Times, serif" color="#FF0000" size="+2" >exemple de police </font>

![](data:image/png;base64...)

II.6.3 Caract res sp ciaux

Le standard HTML demande de respecter le codage des caract res ASCII 7 bits, c'est- -dire que les caract res accentu s ne sont pas autoris s. Il faut pour cela utiliser un codage particulier.

Exemple :

| | |

| --- | --- |

| Caract re | Code |

| " | &quot; |

| & | &amp; |

| Space | &nbsp; |

| | &agrave; |

| E | &egrave ; |

| E | &eacute; |

II.7 Les listes

II.7.1 Liste puce

Pour cr er une liste puce, on dispose de la balise <ul>

Pour sp cifier le titre de la liste, on utilise <lh>

Les l ments de la liste sont r alis s gr ce la balise <li>

Syntaxe:

<ul>

Publicité

<lh>&</lh>

<li>&</li>

<li>&</li>

&

</ul>

Exemple :

<ul>

<lh>Titre de la liste</lh>

<li>El ment 1</li>

<li>El ment 2</li>

</ul>

II.7.2 Liste num rot e

Syntaxe: <ol> ... </ol>

<ol>

<lh>Titre de la liste</lh>

<li>El ment 1</li> <li>El ment 2</li>

</ol>

II.7.3 Liste de d finition

Le marqueur dl : D limite une zone de liste de d finition qui contient des termes "dt" et des descriptions "dd"

Syntaxe: <dl> ... </dl>

Le marqueur dt : Introduit un nouveau terme de d finition.

Syntaxe: <dt> ... </dt>

Le marqueur dd : introduit une description du terme de d finition. Le r sultat l cran est un d calage du texte vers la droite.

Syntaxe: <dd> ... </dd>

<dl>

<th>Titre de la liste

<dt>Terme 1</dt>

<dd>D finition du terme 1</dd>

<dt>Terme 2</dt>

<dd>D finition du terme 2</dd>

....

</dl>

II.7.4 Attributs de liste

Il existe des attributs sp cifiques aux listes:

| | | |

| --- | --- | --- |

| Attribut | Valeur | Effet Visuel |

| | | |

| COMPACT | | resserre l'interligne |

| PLAIN | | supprime les puces |

| SEQNUM | | d finit le premier num ro |

| START | | d finit le premier num ro |

| CONTINUE | | repart du num ro o il s' tait arr t la liste pr c dente |

| TYPE (pour les listes ordonn es) | 1 A a I i | num rotation chiffr e (par d faut) num rotation en capitales num rotation en bas de casse num rotation en chiffres romains (I, II, III, IV ...) num rotation en chiffres romains en bas de casse |

| TYPE (pour les listes non-ordonn es) | circle square disc | puce circulaire puce carr e puce en disque |

II.7.5 Combinaison de liste

Les listes peuvent tre embo t es les unes dans les autres, il suffit pour cela de d finir un l ment dune liste comme tant une autre liste.

| |

| --- |

| <ol> <li> Achats faire </li> <p> <ul> <li> 2 litres de lait </li> <li> 1 kg de pain mi-blanc </li> </ul> <li> Recette </li> <dl> <dt>Pain</dt> <dd>Il faut de la farine et de leau, de la levure.</dd> <dt>Lait</dt> <dd>Si vous tes en ville, aucune chance ... Il faut trouver une vache </dd> </dl> <li> Dernier l ment num rot </li> </ol> |

![](data:image/png;base64...)