SNT seconde Chapitre n°3 – Le WEB Activité n°1

Objectif de connaissance : le Web, adresse URL et protocole http

I – Le World Wide Web.

Le "World Wide Web", plus communément appelé "Web" a été développé au
CERN (Conseil Européen pour la Recherche Nucléaire) par le Britannique Sir
Timothy John Berners-Lee et le Belge Robert Cailliau au début des années 90. À
cette époque les principaux centres de recherche mondiaux étaient déjà connectés
les uns aux autres, mais pour faciliter les échanges d'information Tim Berners-Lee
met au point un nouveau système.
La première page web publiée est toujours consultable à
l'adresse suivante :
http://info.cern.ch/hypertext/WWW/ TheProject.html

Se connecter sur cette page et répondre aux questions.

1- Quelle différence comporte cette page avec une page simple

de traitement de texte ?

2- Comment se nomment les mots cliquables ? Comment sont-ils repérables ? Quel est leur rôle ?

3- Cliquer sur le premier mot cliquable : « hyperlien ». Que se passe t-il ? Nommer l’adresse URL visible.
Quelle différence présente cette adresse avec la précédente ? Quelle extension termine ces deux pages ?

4- Dans cette deuxième page, cliquer sur « links » puis cliquer sur un mot de vocabulaire en bleu. La page
change t-elle d’adresse ? Que se passe-t-il à chaque mot cliqué ?

5- Vers quel autre type d’élément un mot cliquable peut-il renvoyer ?

Se connecter sur https://fr.wikipedia.org/wiki/Informatique.html. Sur cette page, effectuer un clic droit et choisir
examiner cet élément. Le bandeau du bas s’ouvre sur l’onglet « Inspecteur »
Dans la fenêtre de gauche, on voit le contenu du fichier html de la page. Remonter en haut du fichier à l’aide du
curseur.

6- Par quelle ligne commence le fichier ? Par quels signes commencent et se terminent toutes les lignes ?

7- Recopier la ligne 6. Que pourrait signifier la dernière partie </div> ?

8- Dans la fenêtre du centre, on voit une partie du contenu du fichier css relatif à la page.
Recopier ce qui est écrit dans « Hérité de body ». A quoi pourrait servir l’information entre les accolades {} ?

II – L’URL (Uniform Resource Locator)

L’URL est l'adresse d'une ressource sur le web. Elle est absolument nécessaire pour avoir accès à une ressource
parmi toutes les ressources existantes sur le web.

Pour l'adresse suivante : https://fr.wikipedia.org/wiki/Informatique.html

• https:// le protocole utilisé ( il y en a d'autres : http , ftp, mailto...)
• fr.wikipedia.org est le nom de la machine ( nom de domaine associé à l'adresse IP d'une machine)
• wiki/Informatique.html : la page informatique.html dans le dossier wiki

L'URL indique aussi « l'endroit » où se trouve une ressource sur un ordinateur. Un fichier peut se trouver dans
un dossier qui peut lui-même se trouver dans un autre dossier... On parle d'une structure en arborescence, car
elle ressemble à un arbre à l'envers. La base de l'arbre s'appelle la racine de l'arborescence et se représente par
un / (« slash »).

Chemin absolu ou chemin relatif ?

Pour indiquer la position d'un fichier (ou d'un dossier) dans l'arborescence, il
existe 2 méthodes : indiquer un chemin absolu ou indiquer un chemin relatif.
Le chemin absolu doit indiquer « le chemin » depuis la racine. Par exemple,
l'URL du fichier fichier3.jpg sera : /dossier2/dossier3/fichier3.jpg
Remarque : on démarre bien de la racine / (attention les symboles de
séparation sont aussi des /)

Si le fichier fichier1.css fait appel au fichier fichier3.jpg (comme un fichier

HTML peut faire appel à un fichier CSS), il est possible d'indiquer le chemin
non pas depuis la racine, mais depuis le dossier dossier2 qui accueille le fichier1.css, on parle alors de chemin
relatif : dossier3/fichier3.jpg
Remarque : l’absence du / au début du chemin permet de distinguer un chemin relatif et un chemin absolu.
Comment indiquer le chemin relatif du fichier fichier5.svg depuis l'intérieur du dossier dossier4  ?
Il faut "remonter" d'un "niveau" dans l'arborescence pour se retrouver dans le dossier dossier2 et ainsi pouvoir
repartir vers la bonne "branche" (vers le dossier3). Pour ce faire il faut utiliser 2 points : ..
../dossier3/fichier5.svg
Il est possible de remonter de plusieurs "crans" :
../../ depuis le dossier dossier4 permet de "retourner" à la racine.
Exercice :
Soit la structure en arborescence représentée ci-contre :

1- Le contenu du fichier "fichier7.odp" utilise le fichier "fichier5.svg".

Donner le chemin relatif qui devra être renseigné dans le fichier "fichier7.odp"
afin d'atteindre le fichier "fichier5.svg".

2- Donner le chemin absolu permettant d'atteindre le fichier "fichier6.html".

3- Donner le chemin relatif permettant depuis le fichier "fichier5.svg" d’atteindre le fichier "fichier4.js"

4- Donner le chemin absolu permettant d'atteindre le fichier "fichier7.odp".

III – HTTP (HyperText Transfer Protocol)

• Protocole : c'est une règle.
• Transfert : pour transférer (communiquer).
• HyperTexte : c'est du texte qui contient des liens vers d'autres ressources (documents, images etc.)

http est donc le protocole qui permet à une machine de demander et de recevoir une ressource d'un serveur
Lorsque l'on se connecte à un serveur pour lui demander une
page cela se fait sous forme de requête.
Le navigateur va envoyer une requête au serveur, pour lui
demander une page et celui-ci enverra une réponse, après la
lecture de la requête.
La demande se fait avec la méthode Get ( « to Get » en anglais se traduit par « obtenir », « se procurer » )
La méthode Get va envoyer différentes informations au serveur pour que celui-ci puisse lui renvoyer le contenu
demandé.
Voici les informations que la méthode Get envoie au serveur : évidemment la page demandée (ou le contenu
demandé), le numéro de version du protocole http utilisé, le langage utilisé, le navigateur utilisé, les cookies, la
conservation de la connexion, ...

Aller sur la page : https://fr.wikipedia.org/wiki/Informatique

Appuyer sur F12, puis actualiser la page (avec F5), cela affiche un panneau qui permet de voir dans l'onglet
« réseau  » les requêtes faites par le navigateur et la réponse du serveur.
On peut observer, les différentes requêtes effectuées par le navigateur :
• le code d'état à 200 signifie que la demande a bien été traitée
• le code 304 , si la ressource est déjà dans le cache du navigateur,
• le code 404 si la ressource n'a pas été trouvée
Il y a bien évidemment d'autres méthodes (POST, PUT, DELETE, etc...)