Retour

Le Web

🎲 Quiz GRATUIT

📝 Mini-cours GRATUIT

Introduction et repères historiques

Le World Wide Web (littéralement la toile d'araignée à l'échelle mondiale) ou le Web désigne un système donnant accès à un ensemble de données (page, image, son, vidéo) reliées par des liens hypertextes et accessibles sur le réseau internet.

Repères historiques

  • 1989 : Tim Berners Lee propose un système hypertexte afin d'améliorer la diffusion interne des documents du CERN à Genève (Organisation européenne pour la recherche nucléaire).

  • 1990 : création du premier serveur web, du premier navigateur internet nommé WorldWideWeb.

  • 1993 : mise dans le domaine public, disponibilité du navigateur Mosaic qui permet notamment de visualiser des images.

  • 1995 : mise à disposition de technologies pour le développement de sites Web dynamiques avec les langages Javascript (côté client) et Java ou PHP (côté serveur).

Création du moteur de recherche Altavista :

  • 2001 : standardisation des pages grâce au DOM (Document Object Model). 
  • 2004 : concept de Web 2.0 (web participatif et web social).

  • 2010 : mise à disposition de technologies pour le développement d’applications sur mobiles.

Les langages HTML et CSS

L’affichage des pages Web est réalisé chez l’utilisateur par un programme appelé navigateur (ou browser en anglais).

Les pages Web sont écrites dans le langage de balises HTML (Hypertext Markup Language). 

Leur style graphique est défini dans le langage CSS (Cascading Style Sheets).

Le World Wide Web Consortium (W3C) est un organisme qui définit des formats normalisés des technologies utilisées par le Web.

Les URL

Les pages sur le Web ont une adresse unique, nommée URL (Uniform Ressource Locator).

Exemple d'URL : 

http://www.exemple.com/chemin/vers/monfichier.html?clé1=valeur1&clé2=valeur2

Une URL se décompose en plusieurs éléments :

  • le protocole : « http » (pour HyperText Transfer Protocol).
    Il existe une version sécurisée (les données sont chiffrées) de ce protocole nommée « https ».

  • Le nom de domaine.
    C’est le serveur web avec lequel le navigateur communique pour échanger du contenu.
    Ce nom de domaine est la traduction en mots de l’adresse numérique (ou adresse IP).
    Dans notre exemple « www.exemple.com ».
        L’extension du nom de domaine permet d’identifier le pays ou le type de site : .fr, .com, .org, .gouv.fr (pour les sites officiels du gouvernement), etc.

  • Le chemin d’accès.
    C’est une précision apportée pour aider le serveur à repérer l’emplacement de la ressource, ou le « chemin » qui mène à cette ressource.
    Dans notre exemple : /chemin/vers/.

  • La ressource elle-même.
    Dans notre exemple : monfichier.html
    Il s'agit ici d'une page html.

  • Des paramètres (facultatifs) fournis au serveur web.
    Dans notre exemple :
    ?clé1=valeur1&clé2=valeur2#QuelquePartDansLeDocument
    Ces paramètres sont construits sous la forme d'une liste de paires de clé/valeur dont chaque élément est séparé par une esperluette (&). Le serveur web pourra utiliser ces paramètres pour effectuer des actions supplémentaires avant d'envoyer la ressource.

Le modèle client-serveur

Le Web repose sur un dialogue entre des machines clientes et des machines serveurs. 

Voici le principe de fonctionnement du modèle client-serveur dans le cadre d'un échange de pages Web sur Internet :

  • Le client : c’est le visiteur du site Web. Il demande la page Web au serveur. Plus précisément c’est le navigateur Web (Firefox, Chrome, Safari, IE, Edge,…) qui est le client car c’est lui qui demande la page Web.

  • Le(s) serveur(s) : ce sont les ordinateurs qui délivrent les sites Web aux internautes, c’est-à-dire aux clients.

Le client fait une requête au serveur, qui lui répond en donnant la page Web.

Le protocole HTTP

Les URL sont accessibles via Internet en utilisant le protocole HTTP (Hypertext Transfer Protocol).

Un protocole de communication est un ensemble de règles qui permettent à 2 ordinateurs de communiquer ensemble.

Le protocole HTTP va permettre au client d'effectuer des requêtes à destination d'un serveur web. 

En retour, le serveur web va envoyer une réponse.

Voici une version simplifiée de la composition d'une requête HTTP (du client vers le serveur) :

Cette requête http contient les informations suivantes :

  • "GET" est la méthode employée pour demander à accéder à une page.

  • "/monrepertoire /monFichier.html" correspond l'URL de la ressource demandée.

  • "HTTP/1.1" : la version utilisée du protocole HTTP (1.1 ici).

  • "Mozilla/5.0" : le navigateur web employé est Firefox de la société Mozilla.

  • "text/html" : le client s'attend à recevoir du HTML.

Voici un exemple de réponse possible :

Voici quelques explications sur la réponse envoyée par le serveur :

  • HTTP/1.1 200 OK : Le code 200 signifie que la ressource est bien présente sur le serveur.
    Il existe d'autres code de retour, le plus courant en cas d'erreur étant le code "404 : not found" lorsque la ressource demandée par le client n'existe pas sur le serveur.
  • Server: Apache/2.0.54 (Debian GNU/Linux) DAV/2 SVN/1.1.4 :
    On a ici une information sur la machine serveur : le type de serveur est un serveur Apache fonctionnant sur le système d'exploitation Linux.

Les liens hypertextes

Un lien hypertexte (appelé aussi hyperlien) est un texte augmenté de renvois automatiques à des textes, des images, ou des sons. 

Voici un exemple de lien hypertexte traduit dans le langage HTML :

<a href="www.wikipedia.fr">Encyclopédie Wikipedia</a>

La structure du Web peut être définie par le graphe qui matérialise les liens hypertextes (ce qui a donné le nom au Web : la toile d’araignée).

Les moteurs de recherche

Les moteurs de recherche permettent de trouver des ressources sur le Web à partir d'une requête formulée par des mots clefs.

Le fonctionnement d'un moteur de recherche peut se décomposer en 3 phases :

  1. L'exploration (ou crawl en anglais)
    Un robot d'indexation (ou bot en anglais) parcourt tous les hyperliens des pages du Web.

  2. L'indexation
    Les pages récoltées par le robot sont analysées.
    On construit alors un annuaire inversé qui associe à chaque mot d'une page les URL des pages le contenant.

  3. La recherche
    À chaque fois qu’un internaute formule une requête, on construit une liste ordonnée des pages comportant les mots clés de la requête. L'ordre dépend de leur popularité (principe des liens), de leur pertinence (par rapport aux mots de la requête), et de l’ordre des termes de la requête.

Les sites Web dynamiques

Les sites dits statiques sont réalisés uniquement à l’aide de HTML/CSS.

Pour changer leur contenu, il faut intervenir « manuellement » sur le code HTML/CSS et transférer ensuite les pages du site sur le serveur Web les hébergeant.

Au contraire, les sites dynamiques utilisent d’autres langages exécutés sur le serveur Web tels que PHP (ou Java, ou Python) pour générer du HTML et CSS. 

Les sites Web dynamiques peuvent présenter par exemple : un espace membres, un forum, un compteur de visiteurs, des actualités, une vitrine des produits à acheter pour des sites marchands.

Confidentialité des données

Des fichiers textes stockés sur la machine locale client nommé cookies, enregistrent des informations sur l'utilisateur surfant sur un site Web.

D'autre part, un navigateur peut garder l'historique de toutes les pages visitées.

Une technique frauduleuse nommée l’hameçonnage des utilisateurs consiste à proposer de fausses pages Web pour récupérer des informations sensibles aux utilisateurs.

C'est pourquoi, il faut toujours examiner l'url d'un lien hypertexte avant de l'activer par un clic.

🍀 Fiches de révision PREMIUM

PREMIUM

Html et CSS

PREMIUM

Architecture Client Serveur

PREMIUM

Python

PREMIUM

Le réseau

PREMIUM

Les réseaux sociaux

PREMIUM

Html formulaire

Nomad+, Le pass illimité vers la réussite 🔥

NOMAD EDUCATION

L’app unique pour réussir !