From cd735240863532ec7c1aba87bed440f4f8991a6a Mon Sep 17 00:00:00 2001 From: Florian Mathieu Date: Fri, 2 Oct 2026 10:15:08 +0200 Subject: [PATCH] Web : questions et exercices dans des blocs question --- sequences/web/INTRODUCTION.md | 108 ++++----- sequences/web/activite_decouverte_web.md | 88 +++---- .../web/activite_decouverte_web_correction.md | 91 ++++++++ sequences/web/activite_epoques.md | 76 +++--- sequences/web/historique/README.md | 78 +++---- sequences/web/recherches/README.md | 70 +++--- .../web/recherches/activite_moteurs_2026.md | 40 ++-- sequences/web/tp/tp1_decouverte_html.md | 82 +++---- .../web/tp/tp2_experience_utilisateur.md | 174 +++++++------- sequences/web/tp/tp3_css_ma_page.md | 216 +++++++++--------- 10 files changed, 556 insertions(+), 467 deletions(-) create mode 100644 sequences/web/activite_decouverte_web_correction.md diff --git a/sequences/web/INTRODUCTION.md b/sequences/web/INTRODUCTION.md index 75e1f46..99dd39e 100644 --- a/sequences/web/INTRODUCTION.md +++ b/sequences/web/INTRODUCTION.md @@ -27,16 +27,16 @@ D'autres services utilisent Internet sans être le Web : --- -### Exercice 1 : Vrai ou Faux +!!! question "Exercice 1 : Vrai ou Faux" -Répondez par Vrai ou Faux : + Répondez par Vrai ou Faux : -1. Internet et le Web sont synonymes. -2. Le Web a été inventé avant Internet. -3. On peut utiliser Internet sans utiliser le Web. -4. Les emails font partie du Web. -5. Le Web utilise le protocole HTTP. -6. Internet est un réseau de réseaux. + 1. Internet et le Web sont synonymes. + 2. Le Web a été inventé avant Internet. + 3. On peut utiliser Internet sans utiliser le Web. + 4. Les emails font partie du Web. + 5. Le Web utilise le protocole HTTP. + 6. Internet est un réseau de réseaux. --- @@ -63,14 +63,14 @@ Un **navigateur** est un logiciel qui permet d'afficher des pages web. Il interp --- -### Exercice 2 : Parts de marché des navigateurs +!!! question "Exercice 2 : Parts de marché des navigateurs" -Faites une recherche sur Internet pour répondre aux questions suivantes : + Faites une recherche sur Internet pour répondre aux questions suivantes : -1. Quel est le navigateur le plus utilisé dans le monde en 2025 ? Quel est son pourcentage d'utilisation ? -2. Quel est le navigateur le plus utilisé sur mobile ? -3. Pourquoi la domination d'un seul navigateur peut-elle poser problème ? -4. Qu'est-ce qu'un navigateur "open source" ? Citez-en deux. + 1. Quel est le navigateur le plus utilisé dans le monde en 2025 ? Quel est son pourcentage d'utilisation ? + 2. Quel est le navigateur le plus utilisé sur mobile ? + 3. Pourquoi la domination d'un seul navigateur peut-elle poser problème ? + 4. Qu'est-ce qu'un navigateur "open source" ? Citez-en deux. --- @@ -146,22 +146,22 @@ C'est une partie du Web accessible uniquement via des logiciels spéciaux comme --- -### Exercice 3 : Classez ces contenus +!!! question "Exercice 3 : Classez ces contenus" -Pour chaque élément, indiquez s'il appartient au **Surface Web**, au **Deep Web** ou au **Dark Web** : + Pour chaque élément, indiquez s'il appartient au **Surface Web**, au **Deep Web** ou au **Dark Web** : -| Contenu | Surface / Deep / Dark ? | -|---------|-------------------------| -| La page d'accueil de Google | | -| Votre messagerie Pronote | | -| Un article Wikipédia | | -| Votre historique Netflix | | -| Un forum accessible uniquement via Tor | | -| Le site du lycée | | -| Les résultats du bac sur Cyclades (avec identifiant) | | -| Un blog personnel indexé par Google | | -| Une base de données médicale d'hôpital | | -| Un site de vente illégale en .onion | | + | Contenu | Surface / Deep / Dark ? | + |---------|-------------------------| + | La page d'accueil de Google | | + | Votre messagerie Pronote | | + | Un article Wikipédia | | + | Votre historique Netflix | | + | Un forum accessible uniquement via Tor | | + | Le site du lycée | | + | Les résultats du bac sur Cyclades (avec identifiant) | | + | Un blog personnel indexé par Google | | + | Une base de données médicale d'hôpital | | + | Un site de vente illégale en .onion | | --- @@ -206,38 +206,38 @@ En binôme, choisissez **un sujet** parmi les suivants et préparez une présent --- -## Partie 5 : Quiz récapitulatif +!!! question "Partie 5 : Quiz récapitulatif" -1. Quelle est la différence entre Internet et le Web ? + 1. Quelle est la différence entre Internet et le Web ? -2. Quel pourcentage du Web représente le Surface Web ? - - a) 90% - - b) 50% - - c) 4% - - d) 25% + 2. Quel pourcentage du Web représente le Surface Web ? + - a) 90% + - b) 50% + - c) 4% + - d) 25% -3. Votre compte Instagram (partie privée) fait partie : - - a) Du Surface Web - - b) Du Deep Web - - c) Du Dark Web + 3. Votre compte Instagram (partie privée) fait partie : + - a) Du Surface Web + - b) Du Deep Web + - c) Du Dark Web -4. Pour accéder au Dark Web, on utilise généralement : - - a) Google Chrome - - b) Internet Explorer - - c) Le navigateur Tor - - d) Safari + 4. Pour accéder au Dark Web, on utilise généralement : + - a) Google Chrome + - b) Internet Explorer + - c) Le navigateur Tor + - d) Safari -5. Lequel de ces éléments n'utilise PAS le Web ? - - a) YouTube - - b) Un email envoyé par Outlook - - c) Wikipédia - - d) Google Maps dans un navigateur + 5. Lequel de ces éléments n'utilise PAS le Web ? + - a) YouTube + - b) Un email envoyé par Outlook + - c) Wikipédia + - d) Google Maps dans un navigateur -6. Quel navigateur utilise un moteur de rendu différent des autres ? - - a) Chrome - - b) Edge - - c) Firefox - - d) Opera + 6. Quel navigateur utilise un moteur de rendu différent des autres ? + - a) Chrome + - b) Edge + - c) Firefox + - d) Opera --- diff --git a/sequences/web/activite_decouverte_web.md b/sequences/web/activite_decouverte_web.md index 3de0e95..acd862d 100644 --- a/sequences/web/activite_decouverte_web.md +++ b/sequences/web/activite_decouverte_web.md @@ -8,83 +8,83 @@ Pour cela, vous devez mener l'enquête et répondre aux questions suivantes. --- -## Partie 1 : Le suspect principal +!!! question "Partie 1 : Le suspect principal" -**Tim Berners-Lee** est considéré comme l'inventeur du Web. + **Tim Berners-Lee** est considéré comme l'inventeur du Web. -1. En quelle année a-t-il inventé le Web ? -2. Dans quel laboratoire de recherche travaillait-il à ce moment-là ? Dans quel pays ? -3. Quel était son métier/sa fonction ? -4. Quelle était son idée de départ ? Quel problème voulait-il résoudre ? + 1. En quelle année a-t-il inventé le Web ? + 2. Dans quel laboratoire de recherche travaillait-il à ce moment-là ? Dans quel pays ? + 3. Quel était son métier/sa fonction ? + 4. Quelle était son idée de départ ? Quel problème voulait-il résoudre ? -**Indice** : Le site officiel du CERN et la page Wikipédia de Tim Berners-Lee peuvent vous aider. + **Indice** : Le site officiel du CERN et la page Wikipédia de Tim Berners-Lee peuvent vous aider. --- -## Partie 2 : La scène du crime (le premier site web) +!!! question "Partie 2 : La scène du crime (le premier site web)" -5. Quelle est l'adresse (URL) du tout premier site web de l'histoire ? -6. Ce site existe-t-il encore aujourd'hui ? Allez le visiter ! -7. De quoi parlait ce premier site web ? -8. Décrivez son apparence en 3 mots. + 5. Quelle est l'adresse (URL) du tout premier site web de l'histoire ? + 6. Ce site existe-t-il encore aujourd'hui ? Allez le visiter ! + 7. De quoi parlait ce premier site web ? + 8. Décrivez son apparence en 3 mots. -**Indice** : Cherchez "first website ever" ou visitez info.cern.ch + **Indice** : Cherchez "first website ever" ou visitez info.cern.ch --- -## Partie 3 : Les complices (les technologies du Web) +!!! question "Partie 3 : Les complices (les technologies du Web)" -Tim Berners-Lee n'a pas seulement créé un site, il a inventé **3 technologies** qui fonctionnent ensemble. + Tim Berners-Lee n'a pas seulement créé un site, il a inventé **3 technologies** qui fonctionnent ensemble. -9. Qu'est-ce que le **HTML** ? À quoi sert-il ? -10. Qu'est-ce qu'une **URL** ? Donnez un exemple. -11. Qu'est-ce que le protocole **HTTP** ? Que signifient ces lettres ? + 9. Qu'est-ce que le **HTML** ? À quoi sert-il ? + 10. Qu'est-ce qu'une **URL** ? Donnez un exemple. + 11. Qu'est-ce que le protocole **HTTP** ? Que signifient ces lettres ? -**Bonus** : Quelle est la différence entre HTTP et HTTPS ? + **Bonus** : Quelle est la différence entre HTTP et HTTPS ? --- -## Partie 4 : Web vs Internet - L'alibi +!!! question "Partie 4 : Web vs Internet - L'alibi" -Attention, beaucoup de gens confondent **Web** et **Internet**. Ce n'est pas la même chose ! + Attention, beaucoup de gens confondent **Web** et **Internet**. Ce n'est pas la même chose ! -12. Qu'est-ce qu'**Internet** ? Quand a-t-il été créé (approximativement) ? -13. Qu'est-ce que le **Web** ? -14. Donnez 2 exemples de services qui utilisent Internet mais qui ne sont **pas** le Web. + 12. Qu'est-ce qu'**Internet** ? Quand a-t-il été créé (approximativement) ? + 13. Qu'est-ce que le **Web** ? + 14. Donnez 2 exemples de services qui utilisent Internet mais qui ne sont **pas** le Web. -**Aide** : Pensez à ce que vous faites sur votre téléphone ou ordinateur qui nécessite une connexion mais n'utilise pas de navigateur web. + **Aide** : Pensez à ce que vous faites sur votre téléphone ou ordinateur qui nécessite une connexion mais n'utilise pas de navigateur web. --- -## Partie 5 : Le mobile du crime +!!! question "Partie 5 : Le mobile du crime" -15. Pourquoi Tim Berners-Lee a-t-il décidé de rendre le Web **gratuit et libre** pour tout le monde ? -16. Aurait-il pu devenir milliardaire s'il avait breveté son invention ? -17. Qu'est-ce que le **W3C** ? Quel est son rôle aujourd'hui ? + 15. Pourquoi Tim Berners-Lee a-t-il décidé de rendre le Web **gratuit et libre** pour tout le monde ? + 16. Aurait-il pu devenir milliardaire s'il avait breveté son invention ? + 17. Qu'est-ce que le **W3C** ? Quel est son rôle aujourd'hui ? --- -## Partie 6 : L'évolution (Timeline) +!!! question "Partie 6 : L'évolution (Timeline)" -Placez ces événements dans l'ordre chronologique (du plus ancien au plus récent) : + Placez ces événements dans l'ordre chronologique (du plus ancien au plus récent) : -- [ ] Création de Facebook -- [ ] Invention du Web par Tim Berners-Lee -- [ ] Premier iPhone -- [ ] Création de Google -- [ ] Création de Wikipédia -- [ ] Premier tweet sur Twitter -- [ ] Naissance d'Internet (ARPANET) + - [ ] Création de Facebook + - [ ] Invention du Web par Tim Berners-Lee + - [ ] Premier iPhone + - [ ] Création de Google + - [ ] Création de Wikipédia + - [ ] Premier tweet sur Twitter + - [ ] Naissance d'Internet (ARPANET) --- -## Mission finale : Votre article +!!! question "Mission finale : Votre article" -Rédigez un court article (10-15 lignes) pour le magazine, avec : -- Un titre accrocheur -- Une introduction qui donne envie de lire -- Les informations essentielles sur l'invention du Web -- Une conclusion sur l'impact du Web aujourd'hui + Rédigez un court article (10-15 lignes) pour le magazine, avec : + - Un titre accrocheur + - Une introduction qui donne envie de lire + - Les informations essentielles sur l'invention du Web + - Une conclusion sur l'impact du Web aujourd'hui --- diff --git a/sequences/web/activite_decouverte_web_correction.md b/sequences/web/activite_decouverte_web_correction.md new file mode 100644 index 0000000..c4130b6 --- /dev/null +++ b/sequences/web/activite_decouverte_web_correction.md @@ -0,0 +1,91 @@ +# Enquête : Aux origines du Web - CORRECTION + +## Partie 1 : Le suspect principal + +1. **1989** (proposition initiale) / **1990** (première version fonctionnelle) +2. **CERN** (Organisation européenne pour la recherche nucléaire), à **Genève, Suisse** +3. Informaticien / Ingénieur en informatique +4. Il voulait permettre aux scientifiques du CERN de **partager facilement leurs documents et recherches** entre eux, même s'ils utilisaient des ordinateurs différents. Le problème était la difficulté à accéder aux informations dispersées sur différentes machines. + +--- + +## Partie 2 : La scène du crime + +5. **http://info.cern.ch/hypertext/WWW/TheProject.html** +6. **Oui**, il est toujours en ligne (restauré par le CERN en 2013) +7. Il expliquait ce qu'était le projet World Wide Web et comment l'utiliser +8. Exemples : Simple, sobre, textuel / Minimaliste, basique, épuré / Noir, blanc, liens bleus + +--- + +## Partie 3 : Les complices + +9. **HTML** (HyperText Markup Language) : langage de balisage qui permet de structurer le contenu d'une page web (titres, paragraphes, liens, images...) +10. **URL** (Uniform Resource Locator) : adresse unique qui permet de localiser une ressource sur le Web. Exemple : https://www.wikipedia.org/wiki/Web +11. **HTTP** (HyperText Transfer Protocol) : protocole de communication qui permet au navigateur et au serveur de s'échanger des informations (requêtes et réponses) + +**Bonus** : HTTPS = HTTP + S (Secure). Les données sont chiffrées, ce qui sécurise les échanges (important pour les mots de passe, paiements...) + +--- + +## Partie 4 : Web vs Internet + +12. **Internet** : réseau mondial d'ordinateurs interconnectés. Créé dans les années **1960-1970** (ARPANET en 1969) +13. **Le Web** : service qui fonctionne sur Internet, permettant de consulter des pages reliées par des liens hypertextes via un navigateur +14. Exemples de services Internet qui ne sont pas le Web : + - Email (courrier électronique) + - Jeux en ligne (multijoueur) + - Messageries instantanées (WhatsApp, Discord...) + - Streaming (Spotify, Netflix utilisent des protocoles spécifiques) + - FTP (transfert de fichiers) + - VoIP (appels téléphoniques via Internet) + +--- + +## Partie 5 : Le mobile du crime + +15. Tim Berners-Lee pensait que le Web devait être un **bien commun**, accessible à tous, pour favoriser le partage des connaissances et la collaboration mondiale +16. **Oui**, certains estiment qu'il aurait pu devenir l'une des personnes les plus riches du monde +17. **W3C** (World Wide Web Consortium) : organisation internationale fondée par Tim Berners-Lee en 1994. Son rôle est de développer les standards du Web (HTML, CSS, etc.) pour assurer son évolution et son interopérabilité + +--- + +## Partie 6 : L'évolution (Timeline) + +Ordre chronologique : + +1. **1969** - Naissance d'Internet (ARPANET) +2. **1989** - Invention du Web par Tim Berners-Lee +3. **1998** - Création de Google +4. **2001** - Création de Wikipédia +5. **2004** - Création de Facebook +6. **2006** - Premier tweet sur Twitter +7. **2007** - Premier iPhone + +--- + +## Critères d'évaluation de l'article + +- Titre accrocheur et pertinent +- Introduction qui contextualise le sujet +- Informations exactes (dates, noms, faits) +- Distinction Web/Internet claire +- Réflexion sur l'impact actuel +- Qualité de la rédaction (orthographe, syntaxe) + +--- + +## Notes pédagogiques + +**Objectifs de l'activité :** +- Découvrir l'histoire du Web +- Distinguer Web et Internet +- Comprendre les 3 technologies fondamentales (HTML, URL, HTTP) +- Développer les compétences de recherche documentaire +- Réfléchir aux enjeux éthiques (gratuité, bien commun) + +**Prolongements possibles :** +- Créer une première page HTML simple +- Analyser l'URL d'un site pour identifier ses composants +- Débat sur la neutralité du Net +- Étude des évolutions du Web (Web 1.0, 2.0, 3.0) diff --git a/sequences/web/activite_epoques.md b/sequences/web/activite_epoques.md index 185bff4..76379ae 100644 --- a/sequences/web/activite_epoques.md +++ b/sequences/web/activite_epoques.md @@ -20,61 +20,61 @@ Ouvrez-les dans l'ordre, et gardez cette page de questions à côté. --------- -### 1. 1995 +!!! question "1. 1995" -1. Ouvrez le code source. Cherchez une balise `