L'essentiel à connaître
Quand tu ouvres une page Web, ton navigateur, le client, envoie une requête (une demande) à un serveur, qui lui renvoie la page ; leur échange suit des règles communes, le protocole HTTP. Le HTML donne le contenu (titres, paragraphes, liens), le CSS donne le style (couleurs, mise en page). Par exemple, <p>Bonjour</p> crée un paragraphe, et la règle CSS p { color: red; } l'écrit en rouge.
Une balise est un mot entre chevrons, comme <p>. Le <head> regroupe ce qui ne s'affiche pas dans la page, comme le <title>, nom de l'onglet ; le <body> contient tout ce qui s'affiche. Un lien s'écrit <a href="page.html">, une image <img src="photo.jpg">. En CSS, p vise toutes les balises <p>, .menu les éléments de classe menu, #menu l'élément unique d'identifiant menu.
Une URL est l'adresse d'une ressource. Dans https://www.example.com/cours/web.html?niveau=2, https est le protocole, www.example.com le nom de domaine, qui désigne le serveur, /cours/web.html le chemin du fichier et niveau=2 un paramètre, placé après le « ? ». Avec la méthode GET, les paramètres voyagent dans l'URL ; avec POST, dans le corps de la requête, hors de l'URL (MDN Web Docs). Le serveur répond par un code : 200 si tout va bien, 403 si l'accès est interdit, 404 si la ressource est introuvable.
HTTP est sans état : le serveur ne se souvient pas de ta requête précédente. Pour te reconnaître, un site dépose un cookie, un petit morceau de données que ton navigateur garde et lui renvoie à chaque requête. Le serveur peut fabriquer la page avec un langage comme PHP, mais c'est ton navigateur qui applique le CSS pour l'afficher.
Définition : Internet est le réseau mondial qui relie les machines. Le Web, inventé en 1989 au CERN par Tim Berners-Lee, est un service qui utilise Internet, comme le courrier électronique en est un autre.
Piège classique : Le https chiffre les échanges, si bien qu'un tiers qui les intercepte ne peut pas les lire. Il ne prouve pas que le site est honnête. Et un mot de passe envoyé par POST vers une adresse en http circule en clair.
Quiz : teste tes connaissances
Les questions vont de la plus facile à la plus piégeuse : garde ta vigilance pour les trois dernières.
Question 1 : Dans une page Web, quel langage décrit le contenu, comme les titres et les liens ?
Réponse : C. Le HTML (HyperText Markup Language) décrit le contenu avec des balises. Le CSS ne règle que l'apparence : sans HTML, il n'aurait rien à mettre en forme.
Question 2 : Quand tu ouvres une page Web sur ton téléphone, qui joue le rôle du client ?
Réponse : A. Le client est le programme qui envoie la requête : ton navigateur. Le serveur, la B, reçoit cette requête et renvoie la page.
Question 3 : Quelle ligne HTML crée un lien cliquable vers la page suite.html ?
Réponse : D. Un lien s'écrit avec la balise <a> et l'adresse visée dans l'attribut href. La B garde la bonne balise mais prend src, l'attribut des images.
Question 4 : Le serveur répond à ta requête avec le code 404. Que signifie-t-il ?
Réponse : B. Le code 404 veut dire « non trouvé » : rien ne correspond à l'adresse demandée. L'accès interdit, la C, correspond au code 403.
Question 5 : Quelle ligne HTML affiche l'image chat.jpg ?
Réponse : B. La balise <img> cherche le fichier à afficher dans son attribut src. La A emprunte href aux liens : le navigateur ne sait alors pas quelle image charger.
Question 6 : Quelle règle CSS écrit en rouge le texte de tous les paragraphes ?
Réponse : D. Pour viser une balise, le sélecteur est son nom, sans chevrons ni point, et la couleur du texte se règle avec color. La B est tentante, mais text-color n'existe pas en CSS.
Question 7 : Dans l'URL https://www.example.com/cours/web.html, quelle partie désigne le serveur à contacter ?
Réponse : A. Le nom de domaine, www.example.com, désigne le serveur. Le protocole est https, et /cours/web.html est le chemin du fichier sur ce serveur : il dit quoi demander, pas à qui.
Question 8 : Où se place la balise qui donne son nom à l'onglet du navigateur ?
Réponse : C. Le <head> regroupe ce qui ne s'affiche pas dans la page, dont le <title>, nom de l'onglet. Le <h1>, grand titre visible, va dans le <body> et ne change pas l'onglet.
Question 9 : Une page contient <div id="menu">. Quel sélecteur CSS cible cet élément ?
Réponse : C. Le dièse cible un identifiant, donné par l'attribut id et unique dans la page. Le point cible une classe : .menu viserait les éléments écrits avec class="menu", pas celui-ci.
Question 10 : Ton navigateur envoie la requête GET /recherche?q=volcan&page=2 HTTP/1.1. Quelle partie contient les paramètres ?
Réponse : A. Avec GET, les paramètres suivent le « ? », sous la forme nom=valeur, séparés par « & ». Le piège B, /recherche, n'est que le chemin de la ressource.
Question 11 : HTTP est « sans état ». Comment un site peut-il te garder connecté d'une page à l'autre ?
Réponse : D. « Sans état » veut dire que le serveur ne se souvient pas de tes requêtes, ce qui exclut la A. Le cookie, renvoyé par ton navigateur à chaque requête, permet au site de te reconnaître.
Question 12 : Quelle phrase distingue correctement Internet et le Web ?
Réponse : B. Internet relie les machines ; le Web, né en 1989 au CERN, est un service qui circule dessus, comme le courrier électronique. La A inverse simplement les deux rôles.
Question 13 : Une page s'ouvre en https, avec un cadenas dans la barre d'adresse. Que peux-tu en conclure à coup sûr ?
Réponse : D. Le « s » de https signale le chiffrement des échanges. Mais un faux site peut lui aussi être en https : la A est fausse, et seul le nom de domaine te dit où tu es.
Question 14 : Un formulaire envoie ton mot de passe par POST vers une adresse en http (sans « s »). Que devient-il ?
Réponse : A. POST place les données dans le corps de la requête, pas dans l'URL. Mais seul https chiffre : en http, qui intercepte la requête lit le mot de passe tel quel. La B confond « absent de l'URL » et « chiffré ».
Question 15 : Le serveur envoie à ton navigateur un fichier HTML et un fichier CSS. Qui applique le CSS pour afficher la page ?
Réponse : C. C'est ton navigateur, le client, qui applique le CSS et dessine la page. La A confond avec un langage comme PHP, qui, lui, s'exécute sur le serveur avant l'envoi.
Sources
CERN, « A short history of the Web » (en anglais).
MDN Web Docs, « Un aperçu de HTTP » et « Envoyer et extraire les données des formulaires ».