IHM sur le Web

Au programme

Une page Web n'est pas un simple document figé : c'est une interface homme-machine capable de réagir au clic, à la frappe, au mouvement de souris, et de dialoguer avec un serveur situé à l'autre bout du réseau. Ce chapitre vous donne les clés de cette interactivité. Vous y verrez comment une page est structurée, comment elle collecte des données, comment elle réagit aux gestes de l'utilisateur, comment JavaScript modifie son contenu en direct, et comment le navigateur communique avec le serveur via le protocole HTTP.

Vous commencerez par un rappel de HTML et CSS — la structure et la mise en forme d'une page. Vous étudierez ensuite les formulaires, brique fondamentale de la transmission de données, en distinguant les méthodes GET et POST. Puis vous découvrirez le modèle événementiel de JavaScript : écouteurs, événements souris et clavier. Vous apprendrez à manipuler le DOM pour modifier dynamiquement la page. Enfin, vous formaliserez l'interaction client-serveur : ce qui se passe côté navigateur, ce qui se passe côté serveur, et comment HTTP achemine requêtes et réponses.

Plan du chapitre

1. HTML et CSS — rappel de structure — balises, attributs, sélecteurs, socle de toute page Web.
2. Formulaires HTML — <form>, <input>, méthodes GET et POST. [PE01]
3. Événements JavaScript — clic, touche, écouteurs, modèle réactif. [PE04] [PE02]
4. Manipulation du DOM — sélection, modification de contenu et de style depuis JavaScript. [PE02]
5. Client, serveur et HTTP — requêtes, méthodes, codes de statut, chiffrement. [PE03]

À la fin du chapitre, vous saurez lire le code HTML d'un formulaire, expliquer ce qui distingue GET de POST, attacher un écouteur d'événement à un bouton, modifier le DOM en JavaScript, et décrire le cycle complet d'une requête HTTP entre un navigateur et un serveur.