CATALOGUE Code & Data Formation Webmaster Les Fondamentaux du Webmaster

Fonctionnement des Sites Interactifs côté Client avec Javascript

Retour à la formation
Chapitre 5 Leçon 2
Précédent
Suivant

Dans cette leçon, apprenez à utiliser Javascript pour rendre un site web interactif côté client, notamment en réalisant un rollover sur une image.

Détails de la leçon

Description de la leçon

Dans cette leçon, nous nous intéresserons au fonctionnement des sites interactifs côté client utilisant Javascript. Nous illustrerons cette technologie à travers l'exemple simple et courant du rollover d'image: lorsqu'une souris passe sur une image, cette dernière est remplacée par une autre image de couleur différente. La première étape est identique à celle des sites statiques : l'utilisateur tape l'URL de la page web dans la barre d'adresse et valide. Une requête HTTP est alors envoyée au serveur, qui retourne la page HTML contenant un petit programme Javascript intégré. Ce code sera ensuite exécuté par le navigateur dès que l'événement attendu (passage de la souris) est détecté. Les avantages de Javascript incluent une exécution rapide côté client et la non-nécessité de modifier la structure du serveur. Toutefois, des soucis de compatibilité, de sécurité et de visibilité du code peuvent survenir, rendant cette technologie inappropriée pour des programmes de contrôle d'accès. Enfin, les développeurs doivent prévoir des alternatives pour les utilisateurs qui désactivent Javascript dans leur navigateur.

Objectifs de cette leçon

Cette vidéo vise à :

  • Expliquer le fonctionnement des sites interactifs côté client.
  • Illustrer l'utilisation de Javascript pour réaliser des rollovers d'images.
  • Présenter les avantages et les limites de Javascript en termes de compatibilité, de sécurité et de visibilité du code.

Prérequis pour cette leçon

Pour suivre cette vidéo, il est recommandé de :

  • Avoir une connaissance de base en HTML et CSS.
  • Être familiarisé avec les concepts fondamentaux de la programmation.
  • Disposer d'un navigateur web pour tester les exemples pratiques.

Métiers concernés

Les concepts abordés dans cette vidéo sont particulièrement utiles pour :

  • Les développeurs front-end qui souhaitent améliorer l'expérience utilisateur de leurs sites.
  • Les web designers qui incorporent des animations et des interactions dans leurs créations.
  • Les étudiants en informatique désirant approfondir leurs connaissances en technologies web.

Alternatives et ressources

En alternatives à Javascript, les développeurs peuvent utiliser :

  • CSS, pour des petites animations et transitions.
  • Frameworks front-end comme React ou Vue.js pour des applications web plus complexes.
  • Bibliothèques comme jQuery pour simplifier les tâches de manipulation du DOM.

Questions & Réponses

Un rollover en Javascript est une technique permettant de changer une image lorsque la souris passe dessus, offrant une expérience utilisateur interactive.
Les avantages incluent une exécution rapide, une meilleure réactivité et la non-nécessité de modifier la structure du serveur.
Les inconvénients incluent des problèmes de compatibilité, de sécurité, et la possibilité pour les utilisateurs de désactiver Javascript, rendant ce dernier inapproprié pour les programmes de contrôle d'accès.