Qu'est-ce qu'un bouton de survol (rollover) ?

Un bouton de survol (rollover button) est un bouton web dynamique qui change d'apparence selon la position du pointeur de la souris. Il comporte trois états : normal, survol et enfoncé. L'état normal s'affiche quand la souris est hors du bouton, l'état survol quand la souris passe dessus, et l'état enfoncé quand on clique.

Types et utilisations

Les boutons de survol existent en différentes formes, tailles, couleurs et styles. Comme les images peuvent être converties en boutons de survol, un bouton peut aussi contenir des images. Un bouton peut être en relief, enfoncé, plat ou animé au clic.

Usages

Les boutons de survol servent principalement de boutons de navigation sur une page web pour diriger vers d'autres pages. Ils sont aussi utilisés dans les menus déroulants et contextuels. D'autres servent à des effets animés et sonores : une image, couleur, forme, texte ou son change quand l'utilisateur survole le bouton.

Avantages

Les boutons de survol étendent la fonctionnalité normale d'un bouton. Non seulement ils sont visuellement attrayants, mais ils sont dynamiques, signalant à l'utilisateur qu'ils sont des éléments actifs. Les concepteurs web peuvent ajouter des effets sonores joués au survol. Dans les menus déroulants ou contextuels, ils font gagner de l'espace de navigation.

Taille recommandée

La taille de fichier d'un bouton de survol doit être petite. Comme ce sont des images, ils peuvent rapidement occuper de l'espace serveur et augmenter le temps de chargement.

Logiciels associés

Un bouton de survol peut être créé avec des logiciels de retouche d'image : Adobe Photoshop, ImageReady, Flash, Fireworks. Les éditeurs web comme Dreamweaver et Microsoft Visual Studio Developer permettent aussi de créer des effets de survol. On peut aussi coder en dur un bouton de survol dans un fichier web avec JavaScript ou CSS, ou utiliser des générateurs en ligne.