Revision sheet: Introduction au Web et HTML

📋 Plan du Cours

1. Fonctionnement du Web
2. URL et éléments
3. Modèle client-serveur HTTP
4. Langage HTML
5. Balises HTML et syntaxe

📖 1. Fonctionnement du Web

🔑 Notions clés & Définitions

Web : AUTEUR (date) : système utilisant le protocole HTTP, permettant de visiter des pages sur Internet.

Navigateur : logiciel permettant d’afficher des sites Internet (Cher, Firefox, Edge, etc.).

Serveur : machine ou système qui stocke les pages Web et répond aux requêtes des postes clients.

Réseau Internet : infrastructure mondiale permettant la transmission de données entre différents dispositifs, facilitant l’accès aux serveurs et aux pages Web.

HTTP (Hyper Text Transfer Protocol) : protocole de transmission permettant d’accéder à des pages Web via un navigateur.

📝 Points essentiels

Le Web est un service d’Internet qui permet de consulter des sites web via un navigateur. Ces sites sont composés de pages Web écrites dans un langage compréhensible par tous les navigateurs, généralement HTML. Les pages Web sont stockées sur des serveurs, accessibles à distance grâce au réseau Internet. Lorsqu’un utilisateur souhaite voir une page, son poste client envoie une requête au serveur via le protocole HTTP. Le serveur répond en envoyant les ressources nécessaires (textes, images, etc.), qui sont mises en forme par le navigateur pour l’affichage. La communication entre le client et le serveur repose sur le protocole HTTP ou HTTPS, ce dernier étant sécurisé pour protéger la confidentialité et l’intégrité des données échangées.

💡 À retenir

Le Web fonctionne comme un système d’interaction entre clients et serveurs via Internet, basé sur des protocoles standardisés, notamment HTTP et HTTPS, pour assurer la transmission des pages Web.

📖 2. URL et éléments

🔑 Notions clés & Définitions

URL (Uniform Resource Locator)

• AUTEUR : voir section 1 C’est l’adresse qui indique comment accéder à une ressource spécifique sur le Web, en regroupant plusieurs éléments.

Protocole HTTP/HTTPS
AUTEUR (date) : « Le mode de communication entre le client (navigateur) et le serveur. »
HTTP (HyperText Transfer Protocol) est le protocole standard pour la transmission de données, tandis que HTTPS est sa version sécurisée utilisant un cryptage pour protéger les échanges.

Nom de domaine
AUTEUR (date) : « L’identifiant du serveur ou du site web ciblé. »
Il représente l’adresse du serveur où se trouve la ressource, souvent associé à une marque ou une organisation.

Chemin d’accès
AUTEUR (date) : « La localisation précise de la ressource ou de la page sur le serveur. »
Il indique la structure de dossiers ou la page spécifique à atteindre sur le serveur.

📝 Points essentiels

Une URL est l’adresse complète d’une page Web, composée du protocole, du nom de domaine et du chemin vers la ressource.
Le protocole indique le mode de communication, avec « http:// » ou « https:// » pour sécurisé.
Le nom de domaine identifie le serveur ou le site web ciblé.
Le chemin précise la ressource ou la page exacte sur le serveur.

💡 À retenir

Savoir décomposer une URL permet de localiser précisément une ressource sur le Web en identifiant son protocole, son nom de domaine et son chemin d’accès.

📖 3. Modèle client-serveur HTTP

🔑 Notions clés & Définitions

• AUTEUR : voir section 1

Requête HTTP : AUTEUR (date) : demande envoyée par le client au serveur pour obtenir une page ou une ressource spécifique. Elle contient des informations sur la demande et le type de contenu souhaité.

Réponse HTTP : AUTEUR (date) : message envoyé par le serveur en réponse à une requête HTTP, contenant les données demandées ou un message d’erreur si la ressource n’est pas disponible.

Protocole HTTPS : AUTEUR (date) : version sécurisée du protocole HTTP, qui assure la confidentialité et l’intégrité des échanges entre le client et le serveur grâce à un chiffrement des données.

📝 Points essentiels

Le modèle client-serveur constitue la base de la communication sur le Web. Le client, généralement un navigateur, envoie une requête HTTP au serveur pour demander une page ou une ressource. Le serveur traite cette requête et renvoie une réponse HTTP contenant les données demandées. Le protocole HTTPS, lorsqu’il est utilisé, garantit la sécurité et la confidentialité des échanges entre le client et le serveur, en chiffrant les données transmises.

💡 À retenir

Le Web fonctionne comme un échange structuré de requêtes et réponses entre clients et serveurs, avec une couche de sécurité possible via le protocole HTTPS pour protéger la confidentialité des échanges.

📖 4. Langage HTML

🔑 Notions clés & Définitions

• AUTEUR : voir section 1

Balise HTML : élément syntaxique composée de chevrons ouvrants et fermants, utilisée pour délimiter et organiser le contenu dans une page web. Elle possède une syntaxe stricte avec un chevron ouvrant <, le nom de la balise, éventuellement des attributs, puis un chevron fermant >.

Attribut HTML : propriété optionnelle d’une balise HTML, permettant de préciser ou de modifier ses caractéristiques. Il se présente sous la forme d’un nom d’attribut suivi d’un signe égal et d’une valeur entre guillemets, par exemple alt="description".

Balise autofermante : balise qui ne nécessite pas de balise de fermeture séparée, car elle se termine automatiquement. Selon AUTEUR (date), une balise autofermante comme <img /> est utilisée pour insérer des éléments sans contenu ou avec un contenu implicite.

📝 Points essentiels

HTML est un langage de description qui structure le contenu des pages Web à l’aide de balises. Chaque balise possède une syntaxe stricte : elle commence par un chevron ouvrant <, suivie du nom de la balise, éventuellement d’attributs optionnels séparés par des espaces, puis d’un chevron fermant >. Les balises peuvent contenir du contenu ou être autofermantes. Certaines balises, comme <img />, sont autofermantes, ce qui signifie qu’elles ne nécessitent pas de balise de fermeture distincte.

Les balises HTML sont invisibles à l’écran mais jouent un rôle crucial en permettant au navigateur d’interpréter et d’afficher le contenu. Le contenu visible (images, textes, vidéos, liens, etc.) est rendu à partir de ce code HTML. La syntaxe stricte garantit une interprétation cohérente par tous les navigateurs.

💡 À retenir

HTML est le langage fondamental qui organise et décrit le contenu des pages Web à l’aide de balises, dont certaines sont autofermantes, permettant au navigateur d’interpréter et d’afficher le contenu de façon structurée.

📖 5. Balises HTML et syntaxe

🔑 Notions clés & Définitions

Balise ouvrante : Marque de début d’une balise HTML, elle indique le début d’un élément HTML. Elle se présente sous la forme <nom_de_balise>.

Balise fermante : Marque de fin d’un élément HTML, elle indique la fin de cet élément. Elle se présente sous la forme </nom_de_balise>. Chaque balise ouvrante doit avoir une balise fermante correspondante, sauf pour les balises autofermantes.

Syntaxe des balises : Structure qui inclut le nom de la balise et éventuellement des attributs entre chevrons. La syntaxe correcte est essentielle pour assurer la validité et le bon fonctionnement du code HTML.

Principales balises HTML : Ce sont <p>, <h1>, <h2>, <img>, <a>, <table>, <tr>. Elles servent à structurer le contenu, insérer des images, créer des liens ou des tableaux.

Lien hypertexte <a> : Balise utilisée pour créer des liens permettant la navigation entre pages ou sections. Elle peut contenir un attribut href pour spécifier la destination du lien.

📝 Points essentiels

• Chaque balise ouvrante doit avoir une balise fermante correspondante, sauf les balises autofermantes comme <img />.
• La syntaxe des balises inclut le nom de la balise et, si nécessaire, des attributs placés entre chevrons. Par exemple, <a href="page.html">.
• Les principales balises HTML pour structurer une page sont <p> pour le paragraphe, <h1> et <h2> pour les titres, <img> pour insérer une image, <a> pour les liens, <table> et <tr> pour les tableaux.
• La balise <a> est essentielle pour créer des liens hypertextes, permettant la navigation entre différentes pages ou sections d’un site.

💡 À retenir

Maîtriser la structure syntaxique des balises HTML, notamment leur ouverture, fermeture et utilisation des attributs, est indispensable pour construire des pages Web fonctionnelles et navigables.

📅 Repères chronologiques

Date	Événement
(Aucune date explicitement mentionnée dans le contenu fourni)

📊 Tableaux de Synthèse

Tableau 1 : Composants d'une URL

Élément	Description	Auteur / Source
Protocole (http/https)	Mode de communication, sécurisé ou non	Section 2
Nom de domaine	Identifiant du serveur ou site web	Section 2
Chemin d’accès	Localisation précise de la ressource sur le serveur	Section 2

Tableau 2 : Modèle client-serveur HTTP

Élément	Description	Auteur / Source
Requête HTTP	Demande envoyée par le client pour obtenir une ressource	Section 3
Réponse HTTP	Message du serveur contenant la ressource demandée	Section 3
HTTPS	Version sécurisée du protocole HTTP, chiffrement des échanges	Section 3

⚠️ Pièges & Confusions Fréquentes

1. Confondre balises autofermantes <img /> avec balises nécessitant une fermeture <div></div>.
2. Oublier que chaque balise ouvrante doit avoir une balise fermante sauf pour les autofermantes.
3. Confusion entre le protocole http:// et https://, notamment en ce qui concerne la sécurité.
4. Mauvaise décomposition d'une URL : ne pas identifier correctement protocole, nom de domaine et chemin.
5. Confondre requête HTTP et réponse HTTP, ou leur rôle dans le modèle client-serveur.
6. Omettre l’attribut href dans la balise <a> lors de la création d’un lien hypertexte.
7. Mal comprendre la syntaxe des attributs HTML, notamment l’utilisation des guillemets.
8. Confusion entre balises de structure (<p>, <h1>) et balises fonctionnelles (<img>, <a>).

✅ Checklist Examen

1. Connaître la définition du Web selon l’auteur (date) : système utilisant le protocole HTTP permettant de visiter des pages sur Internet.

2. Savoir distinguer un navigateur, un serveur, et leur rôle dans le fonctionnement du Web.

3. Expliquer le rôle du protocole HTTP/HTTPS dans la communication client-serveur.

4. Définir ce qu’est une URL, en décomposant ses éléments : protocole, nom de domaine, chemin d’accès.

5. Connaître la différence entre requête HTTP et réponse HTTP, ainsi que leur rôle dans le modèle client-serveur.

6. Comprendre que HTTPS chiffre les échanges pour assurer la sécurité et l’intégrité des données.

7. Maîtriser la syntaxe des balises HTML : balise ouvrante <, nom, attributs éventuels, chevron fermant >.

8. Savoir qu’une balise autofermante comme <img /> ne nécessite pas de balise de fermeture séparée.

9. Identifier les principales balises HTML pour structurer une page : <p>, <h1>, <a>, <img>, <table>.

10. Connaître la syntaxe correcte pour créer un lien hypertexte avec <a href="...">.

11. Comprendre l’importance des attributs HTML et leur syntaxe (ex : alt, href).

12. Savoir que chaque balise doit respecter une syntaxe stricte pour assurer la compatibilité et le bon affichage.

13. Maîtriser la différence entre les éléments structurels et fonctionnels en HTML.

Fin de la fiche de révision