Aller au contenu

World Wide Web

Le World Wide Web (WWW), souvent abrégé en web, est un système d'information mondial basé sur Internet. Il permet aux utilisateurs de naviguer et d'accéder à une vaste quantité de contenu numérique, y compris des pages web, des documents, des images, des vidéos, et bien plus encore.

Invention et histoire

  • Le web a été inventé par le scientifique britannique Tim Berners-Lee au CERN à Genève en 1989.
  • Il a publié la première page web et développé le premier navigateur web en 1990, posant ainsi les bases du web moderne.
  • La technologie a été diffusée en dehors du CERN vers d'autres institutions de recherche à partir de janvier 1991, puis à l'ensemble de l'Internet le 23 août 1991.

La naissance du web

Le premier site web créé au CERN, et dans le monde, était destiné au projet World Wide Web lui-même. Il était hébergé sur l'ordinateur NeXT de Tim Berners-Lee.

tim-berners-lee.png

Source image

www-evolution.png

Source image

Principales technologies du web

Adresse web (URL)

Une URL (Uniform Resource Locator) est une adresse numérique qui permet d'identifier de manière unique une ressource sur Internet, telle qu'une page web, un fichier ou un service en ligne. Elle se compose de plusieurs éléments, notamment :

  • Le protocole (comme http ou https),
  • Le nom de domaine (comme www.example.com),
  • Le chemin d'accès (indiquant la localisation de la ressource sur le serveur),
  • Et éventuellement des paramètres supplémentaires.

Note

Uniform Resource Locator (URL) : une URI qui identifie une ressource sur un réseau (où).

Uniform Resource Name (URN) : une URI qui identifie une ressource par son nom (quoi).

Uniform Resource Identifier (URI) : peut être soit une URL, soit une URN selon le contexte.

Exemple

  • URL (Uniform Resource Locator) : https://www.exemple.com

    • Cette URL pointe vers une page web sur le site "www.exemple.com" via une connexion sécurisée HTTPS.
    • Cependant, elle ne fournit pas d'informations sur le contenu de la page, seulement sur la manière d'y accéder.

  • URN (Uniform Resource Name) : urn:ietf:rfc:2141

    • Cette URN identifie de manière unique une ressource dans un registre spécifique, ici une RFC (Request for Comments) publiée par l'IETF (Internet Engineering Task Force). Le numéro 2141 fait référence à un document précis dans ce registre.
    • Contrairement à une URL, une URN n'indique pas où ou comment accéder à la ressource, mais elle assure une identification unique.

Analogie

  • Adresse postale :

    • Comparable à une URL, elle vous indique comment accéder physiquement à un emplacement (par exemple, une maison), en fournissant des détails comme la rue et la ville.
    • Cependant, elle ne dit rien sur ce qui se trouve à cet emplacement.

  • Numéro ISBN :

    • Semblable à une URN, le numéro ISBN est un identifiant unique pour un livre.
    • Comme une URN, il n'indique pas où se trouve le livre, mais permet de l'identifier dans une librairie ou une bibliothèque qui utilise ce système.

uri.png

Source image

Syntaxe

uri-syntax.png

Source image

Source : Uniform Resource Identifier (URI): Generic Syntax - RFC 3986

Exemple

uri-examples.png

Source image

Hypertext Transfer Protocol (HTTP)

HTTP (Hypertext Transfer Protocol) est un protocole de communication utilisé sur Internet pour permettre l'échange de données entre les clients (comme les navigateurs web) et les serveurs web.

http-request.png

Source image

Évolution

HTTP/0.9 (1991)

  • La première version de HTTP, appelée HTTP/0.9, est apparue en 1991.
  • Elle était très simple, ne prenant en charge que la méthode GET pour récupérer des documents HTML à partir de serveurs.

HTTP/1.0 (1996)

  • En 1996, HTTP/1.0 est devenue la première version largement adoptée du protocole HTTP.
  • Elle a introduit de nouvelles méthodes de requête, telles que POST et HEAD, ainsi que des en-têtes plus élaborés.
  • Cette version permettait également de spécifier la version du protocole dans les requêtes.

HTTP/1.1 (1997)

  • HTTP/1.1, devenue la version dominante en 1997, est encore largement utilisée aujourd'hui.
  • Elle a apporté des améliorations significatives en termes de performances, comme la réutilisation des connexions ( Keep-Alive), la compression des en-têtes et la prise en charge de la négociation de contenu.
  • HTTP/1.1 a également introduit des concepts tels que le chunked transfer encoding et le pipelining pour améliorer la vitesse de transfert des données.

HTTP/2 (2015)

  • HTTP/2, introduit en 2015, a été conçu pour améliorer les performances des sites web.
  • Il a introduit le multiplexage, permettant de gérer plusieurs requêtes simultanément sur une seule connexion TCP.
  • Il prend également en charge la compression des en-têtes et résout certains problèmes de performance de HTTP/1.1.

HTTP/3 (2020)

  • HTTP/3, également connu sous le nom de QUIC (Quick UDP Internet Connections), est apparu en 2020.
  • Il utilise UDP au lieu de TCP pour améliorer la vitesse de transfert des données et réduire la latence.
  • HTTP/3 a également été conçu pour être plus résilient face aux perturbations de la connexion.

http-version.png

Source image

http-version-usage.png

Source image

Sécurité

HTTPS (Hypertext Transfer Protocol Secure) est une extension de HTTP qui ajoute une couche de chiffrement via TLS ( Transport Layer Security). Cela sécurise les données échangées entre le client et le serveur, garantissant la confidentialité et l'intégrité des informations.

Ports

80 (HTTP)

  • Le port 80 est le port par défaut pour les connexions HTTP non sécurisées.
  • Lorsque vous saisissez une URL dans un navigateur sans spécifier de port, le navigateur utilise par défaut le port 80 pour la communication HTTP.

443 (HTTPS)

  • Le port 443 est le port par défaut pour les connexions sécurisées via HTTPS (HTTP Secure).

Ces ports sont des numéros de destination utilisés pour diriger les requêtes HTTP vers les serveurs web appropriés. Il est important de noter que ces numéros de port peuvent être configurés pour d'autres valeurs personnalisées, mais les ports 80 et 443 sont les standards par défaut pour HTTP et HTTPS.

Port

Un port est un mécanisme de communication qui permet aux ordinateurs et aux dispositifs réseau d'envoyer et de recevoir des données sur un réseau. Les ports sont essentiels dans les communications réseau et permettent de différencier les services et applications fonctionnant sur un même appareil ou serveur.

Numéro de port

  • Un port est identifié par un numéro entier, compris entre 0 et 65535.
  • Les ports dirigent le trafic réseau vers des applications spécifiques fonctionnant sur un appareil.

Port de destination

  • Lorsqu'un appareil reçoit des données, il utilise le numéro de port de destination pour déterminer quelle application ou service doit traiter ces données.
  • Par exemple, un serveur web peut écouter sur le port 80, tandis qu'un serveur de messagerie peut utiliser le port 25.

Port source

  • Lorsqu'un appareil envoie des données, il utilise un numéro de port source pour indiquer où la réponse est attendue.
  • Le destinataire peut ainsi envoyer la réponse au bon port source.

Exemples

  • 20 : File Transfer Protocol (FTP) - Data Transfer
  • 21 : File Transfer Protocol (FTP) - Command Control
  • 22 : Secure Shell (SSH)
  • 25 : Simple Mail Transfer Protocol (SMTP)
  • 53 : Domain Name System (DNS)
  • 80 : Hypertext Transfer Protocol (HTTP)
  • 123 : Network Time Protocol (NTP)
  • 161 : Simple Network Management Protocol (SNMP)
  • 194 : Internet Relay Chat (IRC)
  • 443 : HTTP Secure (HTTPS)

Méthodes HTTP

Les méthodes HTTP sont des commandes utilisées dans le protocole HTTP pour indiquer au serveur web quelle action doit être effectuée sur une ressource.

GET

  • La méthode GET est utilisée pour récupérer des données depuis un serveur.
  • Elle est principalement utilisée pour obtenir des informations sans modifier l'état du serveur ou des ressources, comme lors de l'affichage d'une page web.

POST

  • La méthode POST est utilisée pour envoyer des données au serveur afin de créer ou de mettre à jour une ressource.
  • Elle est couramment utilisée pour soumettre des formulaires web, envoyer des données de connexion, et réaliser des opérations qui modifient l'état du serveur.

PUT

  • La méthode PUT est utilisée pour mettre à jour ou créer une ressource spécifiée à l'emplacement indiqué.
  • Elle est similaire à POST, mais généralement utilisée pour des mises à jour spécifiques. Elle est souvent idempotente, ce qui signifie que la répétition de la requête n'a pas d'effets secondaires.

DELETE

  • La méthode DELETE est utilisée pour demander la suppression d'une ressource spécifiée par l'URI.
  • Elle permet de supprimer des données du serveur en supprimant la ressource associée.

PATCH

  • La méthode PATCH est utilisée pour appliquer partiellement des modifications à une ressource existante.
  • Elle permet d'envoyer uniquement les modifications à apporter, sans avoir à transférer l'intégralité de la ressource.

HEAD

  • La méthode HEAD est similaire à GET, mais elle ne renvoie que les en-têtes de réponse, sans le corps.
  • Elle est utile pour obtenir des métadonnées sur une ressource ou pour vérifier sa disponibilité sans la récupérer intégralement.

OPTIONS

  • La méthode OPTIONS est utilisée pour demander les options de communication disponibles pour une ressource ou un serveur.
  • Elle permet de savoir quelles méthodes, en-têtes ou origines sont acceptées par le serveur.

CONNECT

  • La méthode CONNECT est principalement utilisée pour établir une connexion réseau avec un serveur, souvent à des fins de proxy.
  • Elle est utilisée pour créer un tunnel sécurisé vers un autre serveur, permettant par exemple la navigation sécurisée via un proxy.

TRACE

  • La méthode TRACE est peu couramment utilisée et sert principalement à des fins de diagnostic et de débogage, pour retracer le chemin d'une requête HTTP.

Source : HTTP Semantics - RFC 9110

En-tête HTTP

Les requêtes et réponses HTTP contiennent des en-têtes (headers) qui transportent des métadonnées sur la requête ou la réponse. Ces en-têtes peuvent spécifier des informations telles que le type de contenu, la langue, les cookies, etc.

Ci-dessous, les en-têtes les plus courants :

Pour les requêtes HTTP

  • Host : Cet en-tête est généralement obligatoire dans une requête HTTP/1.1 et spécifie le nom de domaine du serveur auquel la requête est destinée.

  • User-Agent : Bien qu'il ne soit pas strictement obligatoire, cet en-tête est généralement inclus pour indiquer le type de navigateur ou d'agent utilisateur utilisé pour la requête.

  • Accept : Cet en-tête indique les types de médias (formats de contenu) que le client accepte. Bien que non obligatoire, il est important pour la négociation de contenu.

Pour les réponses HTTP

  • Status : Cet en-tête est obligatoire dans toutes les réponses HTTP et contient un code de statut HTTP (par exemple, 200 OK ou 404 Not Found) pour indiquer le résultat de la requête.

  • Server : Bien que non obligatoire, cet en-tête est souvent inclus pour identifier le logiciel serveur utilisé par le serveur web.

  • Content-Type : Cet en-tête est crucial car il spécifie le type de contenu de la réponse (par exemple, text/html ou application/json). Sans lui, le client ne saurait pas comment interpréter la réponse.

  • Content-Length : Cet en-tête indique la longueur en octets du contenu de la réponse. Bien qu'il ne soit pas strictement obligatoire, il est fortement recommandé pour garantir l'intégrité de la réponse.

  • Date : Cet en-tête indique la date et l'heure à laquelle la réponse a été générée. Bien que non obligatoire, il est recommandé pour la gestion du cache et pour des raisons de traçabilité.

Source : HTTP Semantics - RFC 9110

Code de statut HTTP

Les codes de statut HTTP (ou codes de réponse HTTP) sont des nombres à trois chiffres inclus dans les réponses HTTP envoyées par un serveur web pour indiquer le résultat d'une requête effectuée par le client.

Voici un résumé des codes de statut HTTP les plus couramment rencontrés :

Série 1xx (Informations)

  • 100 Continue : Indique que la première partie de la requête a été acceptée, et le client peut continuer à envoyer le reste de la requête.

Série 2xx (Succès)

  • 200 OK : La requête a réussi et le serveur a retourné la réponse demandée.
  • 201 Created : Indique que la requête a créé une nouvelle ressource avec succès.
  • 204 No Content : La requête a réussi, mais la réponse n'inclut pas de contenu (souvent utilisé pour les requêtes POST sans réponse).

Série 3xx (Redirection)

  • 301 Moved Permanently : La ressource demandée a été déplacée de manière permanente vers une nouvelle URL.
  • 302 Found (ou Moved Temporarily) : La ressource demandée a été temporairement déplacée vers une nouvelle URL.
  • 304 Not Modified : Le contenu de la ressource n'a pas été modifié depuis la dernière requête, permettant au client d'utiliser sa copie en cache.

Série 4xx (Erreurs côté client)

  • 400 Bad Request : La requête du client est incorrecte ou mal formée.
  • 401 Unauthorized : Le client n'est pas autorisé à accéder à la ressource sans authentification.
  • 403 Forbidden : Le client est authentifié mais n'a pas les autorisations nécessaires pour accéder à la ressource.
  • 404 Not Found : La ressource demandée n'a pas été trouvée sur le serveur.

Série 5xx (Erreurs côté serveur)

  • 500 Internal Server Error : Une erreur interne s'est produite sur le serveur, qui ne peut pas traiter la requête correctement.
  • 502 Bad Gateway : Le serveur, agissant comme une passerelle ou un proxy, a reçu une réponse invalide du serveur en amont.
  • 503 Service Unavailable : Le serveur est temporairement indisponible en raison de surcharge ou de maintenance.

Ces codes de statut HTTP permettent une communication claire entre les clients et les serveurs concernant le résultat des requêtes. Ils sont essentiels pour le traitement des erreurs, la gestion de la mise en cache, la redirection, et d'autres aspects de la communication web. Les développeurs web utilisent souvent ces codes pour diagnostiquer et résoudre les problèmes dans leurs applications.

Source : HTTP Semantics - RFC 9110

Hypertext Markup Language (HTML)

L'HyperText Markup Language (HTML) est le pilier fondamental du World Wide Web. Il s'agit d'un langage de balisage utilisé pour créer des pages web, en structurant le contenu et en définissant sa présentation. En d'autres termes, HTML agit comme le squelette de toute page web, organisant les éléments de manière à ce que les navigateurs puissent les afficher de manière cohérente et les utilisateurs puissent les parcourir aisément.

HTML repose sur un système de balises qui encadrent le contenu et lui attribuent une signification spécifique. Ces balises permettent de définir des titres, des paragraphes, des listes, des liens, des images, des formulaires, et bien plus encore. Lorsque vous accédez à un site web ou que vous lisez un article en ligne, vous interagissez avec le résultat du langage HTML, qui rend le contenu accessible et interactif.

HTML permet également l'intégration de divers types de médias, tels que des images, des vidéos, des fichiers audio, des graphiques vectoriels, et bien plus encore.

Exemple

<!doctype html>
<html lang="fr">
    <!-- Métadonnées et informations sur la page -->
    <head>
        <!-- Définition de l'encodage de caractères -->
        <meta charset="utf-8" />
        <!-- Titre de la page affiché dans la barre de titre du navigateur -->
        <title>Page d'exemple</title>
    </head>
    <!-- Contenu affiché dans le navigateur web -->
    <body>
        <!-- Titre principal -->
        <h1>Mon site Web</h1>
        <!-- Paragraphe de texte -->
        <p>Bienvenue sur ma page d'exemple.</p>
        <!-- Image avec description alternative -->
        <img src="example.png" alt="Image d'exemple" />
        <!-- Titre secondaire -->
        <h2>Liens utiles</h2>
        <!-- Liste à puces non ordonnée -->
        <ul>
            <!-- Élément de liste avec un lien externe -->
            <li>
                <a href="https://www.example.com">Site Web d'exemple</a>
            </li>
            <!-- Élément de liste avec un lien interne -->
            <li>
                <a href="blog.html">Mon blog</a>
            </li>
        </ul>
        <!-- Paragraphe de texte -->
        <p>Merci d'avoir visité ma page !</p>
    </body>
</html>

Résultat dans un navigateur web

website-example.png

Points clés

Le langage HTML et ses balises permettent de :

  • Structurer sémantiquement et logiquement le contenu d'un document web.
  • Inclure des ressources multimédias, comme des images, des vidéos ou des fichiers audio.

Le langage CSS, complémentaire à HTML, permet de :

  • Mettre en forme le contenu des pages web.

Évolution

HTML 1.0 (1993)

  • La première version publique de HTML, conçue par Tim Berners-Lee, était relativement simple et servait principalement à lier des documents hypertexte entre eux.

HTML 2.0 (1995)

  • Cette version a introduit des éléments tels que les formulaires et les images.

HTML 3.2 (1997)

  • Une étape importante, cette version a introduit des éléments de mise en page comme les tableaux, les listes imbriquées et les attributs de couleur.

HTML 4.0 (1997)

  • Une mise à jour majeure offrant plus de contrôle sur la mise en page, la création de formulaires, et une meilleure prise en charge des feuilles de style.

HTML 4.01 (1999)

  • Version de maintenance d'HTML 4.0, corrigeant des erreurs et clarifiant certaines spécifications.

XHTML (2000)

  • XHTML (Extensible HyperText Markup Language) est une révision majeure suivant les règles de syntaxe XML. Conçu pour être plus strict et cohérent qu'HTML 4.

HTML5 (2014)

  • HTML5 a introduit de nombreuses améliorations majeures :
    • Nouveaux éléments sémantiques pour améliorer la structure du contenu.
    • Prise en charge native de l'audio et de la vidéo avec les balises <audio> et <video>.
    • Le canvas HTML5 pour le dessin interactif.
    • Prise en charge de la géolocalisation.
    • Améliorations des formulaires, y compris la validation côté client.
    • Stockage local (LocalStorage et SessionStorage) pour des applications web plus puissantes.
    • Améliorations de l'accessibilité et de la sémantique.

HTML Living Standard

  • HTML évolue désormais en tant que HTML Living Standard, un standard en constante évolution pour s'adapter aux besoins du web moderne, sans versions distinctes.

HTML est souvent utilisé avec des technologies complémentaires comme CSS (Cascading Style Sheets) pour la mise en page et JavaScript pour l'interactivité. Ces évolutions visent à répondre aux besoins changeants du World Wide Web et à améliorer l'expérience utilisateur.

World Wide Web Consortium (W3C)

Le W3C est une organisation internationale à but non lucratif qui joue un rôle clé dans le développement du World Wide Web. Son objectif est de garantir que les technologies web restent ouvertes, interopérables et accessibles à tous, tout en encourageant l'innovation continue dans le développement web.

Fondé en 1994 par Tim Berners-Lee, le W3C regroupe des organisations, des entreprises et des experts du monde entier pour collaborer à l'élaboration de normes web.

Le W3C publie des normes et des recommandations techniques qui définissent comment des technologies telles que HTML, CSS, JavaScript, XML, et bien d'autres, doivent être mises en œuvre. Cela assure la cohérence et la compatibilité entre les navigateurs et les différentes plates-formes.

En date du 13 septembre 2024, le consortium compte 360 membres (contre 412 en 2023 et 472 en 2022), parmi lesquels figurent les géants de la tech, comme Google, Apple, Meta, Amazon, et Microsoft.

W3C Current Members

W3C standards

Web Hypertext Application Technology Working Group (WHATWG)

Le WHATWG est une organisation clé dans le développement et l'évolution des technologies web, en particulier HTML et d'autres normes associées. Elle contribue activement à l'innovation, en se concentrant sur des spécifications ouvertes et flexibles pour répondre aux besoins du web moderne.

Le WHATWG a été fondé en 2004 par des employés d'Apple, de la fondation Mozilla, et d'Opera Software, en réponse aux préoccupations concernant la lenteur du développement de HTML par le W3C. L'organisation adopte une approche plus agile et pragmatique, développant le HTML Living Standard, une spécification en constante évolution, mise à jour en fonction des dernières pratiques et exigences du web.

Bien que le W3C et le WHATWG collaborent fréquemment, leurs priorités diffèrent. Le W3C met l'accent sur des normes stables et bien définies, tandis que le WHATWG favorise l'innovation et l'adoption rapide de nouvelles fonctionnalités.

Le WHATWG est actuellement géré par des employés des principales entreprises du secteur des navigateurs web, telles qu'Apple, Microsoft, Google, et Mozilla. Cependant, tout le monde peut contribuer et participer à ses travaux.

HTML Living Standard

Le W3C et le WHATWG vont collaborer pour faire progresser l'Open Web Platform

Le W3C et le WHATWG ont décidé de collaborer sur une version unifiée des spécifications HTML et DOM, mettant fin à leurs développements séparés pour améliorer la cohérence.

Source

Par conséquent, la documentation officielle pour le langage HTML est le HTML Living Standard.