Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

L'essentiel de Muse CC 2015

Mettre en forme la barre de liens

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Mettez en forme la barre de liens créée au préalable. Vous allez découvrir les modes de sélection ainsi que les différents états des éléments.

Transcription

Pour ce qui est de la mise en forme de la barre de lien, et bien on va devoir tenir compte du fait que nous avons à faire à un élément interactif et donc nous devons penser à définir la mise en forme des différents états de chacun de ces boutons. Alors je vais resélectionner ici ma barre de menu et vous montrer dans les options de ce widget, une petite option ici qui s'appelle Modifier ensemble, et je vais laisser cet option cochée puisque grâce à elle toutes les modifications que je ferai sur l’un de ces 4 boutons, et bien se propagera à l'ensemble des boutons et ça va évidemment me faciliter la vie et me faire gagner du temps. Donc je vais sélectionner ici l'un des boutons, alors je vais le mettre en forme, je vais supprimer la couleur de fond de fond de ce bouton, vous voyez que je supprime du coup la couleur de fond de tous ces boutons grâce à cette option modifier ensemble, je vais cliquer encore une fois pour sélectionner l'étiquette au sein de ce bouton, donc c'est le mot Étiquette qui est écrit ici dans le coin supérieur gauche de la fenêtre, et c'est ici que je vais mettre en forme mon texte, donc je vais choisir une police de caractère, je vais prendre ma police Sketch note que j'avais téléchargée de Typekit, je vais également changer la couleur de mon texte, alors je vais prendre une couleur de ma bibliothèque Creative Cloud et je vais en profiter pour vous montrer autre chose, j'ai envie de choisir ce bleu ici, mais je vais faire un clic droit, sur cette couleur bleu, et regardez je vais demander à Muse de l'ajouter au nuancier cette couleur. Ça veut dire quoi? Ça veut dire que maintenant dans mon nuancier de couleur et bien voila j’ai la couleur en question qui a été ajoutée ici à mon nuancier et donc vous voyez que je peux modifier comme ça très simplement la couleur de mon texte. Je vais également changer la taille des caractères et puis bien évidemment resélectionner un bouton, changer la largeur de mes boutons pour bien les voir comme ceci, et donc voila l'état normal de mes liens. Alors je vais sélectionner l'un des boutons, par exemple le bouton ici Programme, voila qui est fait donc j'ai un élément de menu qui est sélectionné ici en haut à gauche, et vous voyez juste après le mot Élément de menu, j'ai un lien qui s'appelle Normal. Et ça, ça représente l'état que je viens de mettre en forme. Si je clique sur ce lien Normal, je vais voir qu'il y a d'autres états possible pour cet élément. Il y a l'état de survol, ça c'est quand la souris passe sur le bouton, il y a l'état clic, ça c'est quand la souris est sur le bouton et qu'en même temps le bouton de la souris est enfoncé, et puis il y a l'état actif, et bien c'est quand je me trouve sur la page représentée par le bouton. Donc dans ce cas ci, si je me trouvais sur la page Programme. Alors je vais passer à l'état de survol donc je vais cliquer ici sur Survol, vous voyez que le bouton change d'apparence, et bien au survol, je n'ai pas envie non plus d'avoir un fond, par contre je vais changer la couleur du texte donc je vais me rendre dans mes bibliothèques Creative Cloud ici faire un clic droit sur le jaune pour l'ajouter au nuancier, voila qui est fait, et puis venir cliquer ici au niveau de mon étiquette pour la sélectionner, bien choisir l'état de survol de cette étiquette ici, et dans mon panneau de texte et bien changer la couleur de ce texte, je vais prendre le jaune ici que je viens d'ajouter à ce nuancier. Voici donc l'état de survol de mon bouton, alors pour ce qui est de l'état de clic du bouton et bien je vais prendre la même couleur de texte, au niveau de l'élément de menu, voila je vais le sélectionner, bien choisir ici l'état Clic, je n'ai pas envie non plus de voir un fond, donc l'état Clic et l'état de survol seront les mêmes, et puis je vais me rendre maintenant sur l'état actif, alors là je vais changer la couleur de fond. Je vais mettre du jaune ici, et je vais garder la couleur bleu ici pour le texte. Donc vous avez ici dans l'élément de menu la possibilité vous le voyez de définir plusieurs états pour votre élément, pour votre bouton. Alors on va tester tout cela si vous le voulez bien, donc je vais cliquer ici sur le mode de vue aperçu, c'est la première fois qu'on l'utilise dans ce cours, Muse va donc me générer un aperçu de ce gabarit. Donc vous voyez ici ma barre de lien, et quand je passe ma souris sur les éléments et bien vous découvrez l'état de survol, quand je clique sur l'un de ces éléments et bien je vais aller sur la page Programme, et là vous découvrez l'état actif de cet élément même chose sur la page réservation regardez quand je clique dessus voici l'état actif de cet élément. Alors dernière petite chose avant de nous quitter, je vais quitter ici l'aperçu maintenant que ma barre de lien est ici bien crée sur mon gabarit page, et bien je vais la sélectionner, la copier avec le raccourci clavier commande C sur Mac ou contrôle C sur Windows, je vais revenir sur ma page d'accueil, et je vais venir coller ici ma barre de lien, alors elle a besoin d'être la même, cela dit, elle ne sera pas au même endroit puisque vous voyez, que le rectangle rouge ici, et bien se trouve un petit peu plus bas que dans les autres pages. Voila donc, j'ai mis en place ma barre de lien dans l'ensemble de mon site grâce à un widget, j'ai réussi également à définir la mise en forme de chaque état de ces éléments, donc j'ai une barre ici qui est hautement interactive.

L'essentiel de Muse CC 2015

Créez des sites web riches et dynamiques sans aucune compétence en programmation avec Muse. Gérez les plans et les calques, mettez en place une navigation entre vos pages, etc.

3h50 (44 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Thématiques :
Design web
Standards du web
Spécial abonnés
Date de parution :21 juil. 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !