| Modalités de l’interaction H/M |
Identifier les différents composants graphiques permettant d’interagir avec une application Web. |
WEB01 : Analyse des balises <button>, <a>, <input>. Exploration de l'inspecteur d'éléments (F12). |
| Événements |
Identifier les événements que les fonctions associées aux différents composants graphiques sont capables de traiter. |
WEB04 : Utilisation de l'attribut onclick pour déclencher une fonction JavaScript. |
| Comportement vs Description |
Distinguer ce qui relève de la description des composants (HTML) de leur comportement (programmé en JavaScript). |
WEB01 & WEB04 : Séparation des fichiers .html et .js. Comprendre que JS apporte le comportement dynamique. |
| Interaction utilisateur |
Analyser et modifier les méthodes exécutées lors d’un clic sur un bouton d’une page Web. |
WEB04 & WEB05 : Création et modification de fonctions (direBonjour(), gererLumiere()) modifiant le DOM. |
| Interaction client-serveur |
Distinguer ce qui est exécuté sur le client ou sur le serveur et dans quel ordre. |
WEB03 : Schéma du cycle requête/réponse. Distinction entre le navigateur (Client) et le fichier de réception (Serveur). |
| Requêtes HTTP |
Distinguer ce qui est mémorisé dans le client et retransmis au serveur. Reconnaître quand et pourquoi la transmission est chiffrée. |
WEB03 : Analyse du passage de paramètres via HTTP et discussion sur la confidentialité des données. |
| Formulaires Web |
Analyser le fonctionnement d’un formulaire simple. Distinguer les transmissions de paramètres par les requêtes POST ou GET. |
WEB03 : Création de la section "Configuration" avec <form>, action et method. Comparaison des méthodes GET/POST. |
| Interface Homme-Machine (IHM) |
Identifier le rôle des capteurs et actionneurs. |
WEB06 : Modélisation de la boucle de contrôle. Le curseur simule le capteur, le texte/couleur simule l'actionneur (ventilation). |
| Réalisation d'IHM |
Réaliser par programmation une IHM répondant à un cahier des charges donné. |
WEB01 à WEB06 : Projet fil rouge du Dashboard Domotique évolutif intégrant HTML, CSS et JavaScript. |
