Créer son premier site web : HTML & CSS
Texte· 19 min

URL, HTTP et le voyage d'une page

Décomposer une adresse

Une URL n'est pas une chaîne magique, elle a une grammaire. Prenons https://developer.mozilla.org/fr/docs/Web :

  • https est le protocole, la langue commune client/serveur. Le s signifie que l'échange est chiffré.
  • developer.mozilla.org est le nom de domaine, l'adresse lisible d'un serveur. En coulisse, un annuaire appelé DNS le traduit en une adresse numérique (une IP).
  • /fr/docs/Web est le chemin, qui pointe vers une ressource précise sur ce serveur.

Deux morceaux optionnels complètent la grammaire. Les paramètres de requête, après un ? : dans https://www.google.com/search?q=html, le q=html transmet ta recherche au serveur, et plusieurs paramètres s'enchaînent avec des &. Et le fragment, après un #, qui pointe vers une section précise à l'intérieur d'une page : le navigateur fait défiler jusqu'à l'élément qui porte cet identifiant. Tu recroiseras ce # dans la leçon sur les liens.

À toi

Décompose cette adresse sans tricher : https://www.leboncoin.fr/recherche?category=9&text=velo. Protocole ? Domaine ? Chemin ? Paramètres ?

Correction : protocole https (échange chiffré), domaine www.leboncoin.fr, chemin /recherche, et deux paramètres séparés par un & : category=9 et text=velo. C'est comme ça qu'une page de résultats sait quoi afficher : tout est dans l'URL. Tu peux d'ailleurs la copier et l'envoyer à quelqu'un, il verra la même recherche.

Le s de https, en deux mots

Entre http et https, la différence n'est pas cosmétique. En http, tout ce qui circule entre toi et le serveur passe en clair : sur un wifi public, une personne équipée peut lire au passage ce que tu envoies, mots de passe compris. En https, l'échange est chiffré de bout en bout grâce à un certificat installé sur le serveur. Les navigateurs signalent d'ailleurs les pages http par un « Non sécurisé » dans la barre d'adresse. Bonne nouvelle : les hébergeurs que tu utiliseras à la fin du cours fournissent le https automatiquement et gratuitement, tu n'auras rien à configurer.

HTTP, la langue de l'échange

Le protocole s'appelle HTTP (HTTPS quand il est chiffré). Le navigateur envoie une requête et reçoit une réponse. La requête la plus courante est un GET : "donne-moi cette ressource". La réponse contient le fichier demandé, plus un code de statut qui résume ce qui s'est passé.

Ces codes, tu vas vite les rencontrer :

  • 200 : tout va bien, voici la page.
  • 301 / 302 : la ressource a déménagé, suis la redirection.
  • 403 : le serveur a compris la demande mais refuse l'accès.
  • 404 : introuvable, l'adresse ne correspond à rien.
  • 500 : le serveur a planté en préparant la réponse.

Le fameux 404 n'est donc pas un bug mystérieux, juste un serveur qui dit poliment "je n'ai pas ça".

Ce qui se passe en une fraction de seconde

  1. Tu valides une adresse.
  2. Le DNS traduit le domaine en IP.
  3. Le navigateur ouvre une connexion et envoie une requête GET.
  4. Le serveur répond avec le HTML (statut 200).
  5. En lisant ce HTML, le navigateur voit qu'il a besoin d'autres fichiers : CSS, images, polices. Il envoie une requête pour chacun.
  6. Il assemble le tout et dessine la page.
Chronologie du chargement d'une page1. DNSdomaine vers IP2. GETla requête part3. HTMLstatut 2004. CSS, imagesrequêtes en plusle temps passe (quelques centaines de millisecondes)
La chronologie d'un chargement : le HTML arrive en premier, le reste suit

Tu peux observer ce ballet toi-même. Ouvre les outils de développement de ton navigateur (touche F12), onglet Réseau, puis recharge une page. Chaque ligne est une requête, avec son statut et son poids.

Prends deux minutes pour le faire maintenant : c'est le réflexe de débogage le plus rentable de tout le cours. Sur la page d'accueil de Wikipédia, tu verras d'abord le document HTML, puis une cascade de requêtes pour les styles, les scripts et les images. Clique sur une ligne : tu peux lire les en-têtes envoyés et reçus, le code de statut, la taille transférée. Le jour où une image refusera de s'afficher sur ton site, c'est ici que tu trouveras la ligne en rouge avec son 404, et le nom exact du fichier que le navigateur a cherché en vain.

À retenir : une page n'arrive pas d'un bloc. Le HTML arrive en premier, puis le navigateur va chercher les fichiers qu'il mentionne. Un site lent, c'est souvent trop de requêtes ou des fichiers trop lourds.

Doc de référence pour approfondir : MDN – Aperçu de HTTP.

On mesure l'audience du site (GA4) et, si vous dites oui, on affine aussi la pub Meta. Rien ne se déclenche avant votre réponse — et votre choix tient 6 mois.