Ajout de boutons interactifs
Avec Microsoft Expression Web, il est très facile d’intégrer dans vos pages des boutons dignes d’un outil d’édition graphique avancé. Vous pouvez changer l’apparence de ces boutons sans toucher au code. Vous pouvez modifier les paramètres du bouton, par exemple pour ajouter un libellé, sélectionner les couleurs du bouton et de l’arrière-plan et définir un lien hypertexte pour un bouton. Vous pouvez également spécifier le style, la taille et la couleur de la police associés à tous les états du bouton (normal, sélectionné et enfoncé). Vous pouvez définir l’alignement vertical et horizontal, ainsi que changer la taille et les proportions du bouton.
Après avoir ajouté un bouton, vous pouvez le lier à une autre p age du site, d’un autre site Web ou à une adresse électronique.
Lorsque vous ajoutez un bouton interactif, Expression Web crée les fichiers image qui composent le bouton. Lorsque vous enregistrez vos pages, Expression Web vous demande d’enregistrer également les fichiers image du bouton.
.gif "important note") Important : |
|---|
N’oubliez pas d’enregistrer vos images de bouton dans le dossier de votre site (avec les autres fichiers de votre site) ou les images de bouton ne seront pas publiées. |
Pour ajouter un bouton interactif
En mode Création, placez le curseur à l’endroit où vous voulez ajouter le bouton.
Dans le menu Insertion, cliquez sur Bouton interactif.
Dans l’onglet Bouton, dans la liste Boutons, cliquez sur un style de bouton.
Dans la zone Texte, tapez le texte que vous voulez faire figurer sur le bouton.
En regard de la zone Lien, cliquez sur Parcourir.
Recherchez et sélectionnez le fichier, l’URL ou l’adresse électronique que vous voulez associer au bouton.
Facultatif : dans l’onglet Police, spécifiez la police, le style de police, l’alignement et les différentes couleurs du texte en fonction de l’état du bouton.
Facultatif : dans l’onglet Image, spécifiez la taille des images créées et si vous voulez créer des images pour les différents états du bouton.
Pour supprimer un bouton interactif
Cliquez sur le bouton en mode Création pour le sélectionner et appuyez sur Suppr.
.gif "Note")
Remarque :La suppression d’un bouton ne supprime pas les fichiers associés à ce bouton. Vous devez supprimer les fichiers du bouton dans la Liste des dossiers.
Pour définir les propriétés d’un bouton interactif
Cliquez avec le bouton droit sur le bouton interactif dont vous voulez définir les propriétés, puis cliquez sur Propriétés du bouton dans le menu contextuel.
Dans l’onglet Bouton, dans la zone Texte, tapez le texte que vous voulez faire figurer sur le bouton.
Dans l’onglet Police, sélectionnez les propriétés de police souhaitées.
Pour définir la destination, dans l’onglet Bouton, dans la zone Lien, recherchez et sélectionnez le fichier, l’URL ou l’adresse électronique que vous voulez associer au bouton.
Pour définir l’arrière-plan du bouton, effectuez l’une des opérations suivantes dans l’onglet Image :
Pour faire correspondre l’arrière-plan du bouton avec une page Web dotée d’un arrière-plan uni, cliquez sur Créer le bouton sous forme d’image JPEG et utiliser cette couleur d’arrière-plan, cliquez sur la flèche dans la liste, puis sur une couleur qui corresponde à votre page Web.
Pour faire correspondre l’arrière-plan du bouton avec une page Web dotée d’un arrière-plan varié, cliquez sur Créer le bouton sous forme d’image GIF et utiliser un arrière-plan transparent.
Pour définir la taille de l’image, dans l’onglet Image, effectuez l’une des opérations suivantes ou les deux :
Pour définir la hauteur et la largeur d’un bouton, tapez ou sélectionnez les valeurs de pixel que vous voulez dans les zones Hauteur et Largeur.
Pour conserver les proportions du bouton, activez la case à cocher Conserver les proportions.
Pour définir le comportement du bouton, dans l’onglet Image, effectuez une ou plusieurs des opérations suivantes :
Pour que le bouton s’affiche différemment lorsque le visiteur y laisse reposer le pointeur de sa souris, activez la case à cocher Créer une image au survol.
Pour que le bouton s’affiche différemment lorsque le visiteur clique dessus, activez la case à cocher Créer une image au clic.
Pour charger les images des états au survol et au clic du bouton à mesure du chargement du reste de la page, activez la case à cocher Précharger les images des boutons.