Adobe Press
Dans cet article, vous allez apprendre à utiliser des hyperliens dans Adobe Muse. Grâce aux hyperliens, vous pouvez créer des liens vers des sites web externes, des fichiers téléchargeables, des adresses électroniques, etc. Les fichiers téléchargeables peuvent être au format PDF, DOC, PPT, TXT, multimédia ou d’autres types de fichiers que vous souhaitez partager avec les visiteurs de votre site mais qui ne sont pas actuellement pris en charge pour l’insertion dans l’interface d’Adobe Muse. Vous pouvez créer un lien vers les fichiers qui sont actuellement chargés sur votre compte d’hôte Adobe Muse, ainsi que les fichiers qui sont hébergés sur des sites web tiers.
Dans cette section, vous allez apprendre à connecter des éléments de menu aux zones d’ancrage, afin d’ajouter des liens d’ancrage vers le menu manuel. Procédez comme suit :
Lorsque vous cliquez sur les liens pour afficher les différentes zones de la page, notez que l’état actif correspondant dans le menu de navigation s’affiche. Cette fonction du site aide les visiteurs à s’orienter en leur indiquant quelle section ils sont en train de consulter. Quittez le navigateur web et revenez à Adobe Muse.
Essayez également de faire défiler la page vers le haut et vers le bas et regardez comment le code de la page détecte l’emplacement de chaque balise d’ancrage et met à jour l’état actif du menu manuel pendant que la page se déplace dans chaque zone de la page. Cette technique fonctionne pour les pages qui défilent verticalement et horizontalement.
Remarque : une page doit être suffisamment grande ou large pour laisser de la place pour que les balises d’ancrage permettent d’accéder à chaque région. Si les zones de page sont trop rapprochées (c’est-à-dire si le contenu s’affiche dans une fenêtre de navigateur sans défilement), les balises d’ancrage ne semblent pas permettre de passer à la prochaine région.
Dans la section suivante, vous allez apprendre à ajouter des liens de téléchargement, qui permettent aux visiteurs de télécharger différents formats de fichier, tels que PDF, DOC, MP3, MOV, PSD ainsi que des fichiers JPEG haute résolution.
Conseil : si vous travaillez avec d’autres concepteurs sur un projet de site, vous pouvez même définir un lien vers les fichiers source .Muse, de façon à ce que les membres de l’équipe puissent les télécharger directement à partir de votre site web.
La création de zones d’ancrage sur une page web est un moyen simple d’isoler visuellement différentes sections d’une page. Chacune de ces sections peut être facilement accessible via des liens d’ancrage, qui sont conçus pour faciliter la navigation sur une page.
Dans la conception terminée, un page web doit idéalement contenir des liens d’ancrage qui permettent aux visiteurs d’accéder à la zone qui affiche le menu correspondant, grâce à un défilement vertical. Imaginez que lorsque vous ajoutez des balises d’ancrage, c’est comme si vous apposiez une marque quelque part sur une page. Lorsque les visiteurs cliquent sur un lien vers ce point d’ancrage, le lien va faire défiler les pages pour aller directement à la section spécifique qui contient le marqueur.
La place (en pixels) entre le premier point d’ancrage (en haut de la page) et la première occurrence du contenu lié (le widget de menu manuel que vous ajouterez dans la section suivante) définit la « zone active » qui modifie l’état actif de chaque zone. Par exemple, si le premier point d’ancrage est placé tout en haut de la page et que le widget de menu est placé 120 pixels en dessous, l’état actif des éléments de menu pour les zones suivantes sera également mis à jour 120 pixels avant l’apparition du menu lorsque le visiteur fait défiler la page.
Une fois que vous aurez ajouté un widget de menu manuel à l’étape suivante, vous pourrez lier les boutons aux balises d’ancrage pour créer une expérience de navigation qui permettra aux visiteurs de passer au bas de la page pour lire chaque menu.
Remarque : lorsque vous parcourez l’arborescence pour sélectionner un fichier à l’aide de la fonction Lier au fichier, ce fichier devient l’une des ressources du site ; ressource qui sera transférée lors de la publication du site ou incluse dans ses fichiers lors de son exportation. Il est fortement recommandé de copier tous les fichiers que vous souhaitez lier au site dans le dossier local de celui-ci, avec tous les autres fichiers d’image utilisés.
A présent, le lien vers le fichier PDF a été ajouté. Si vous observez le panneau Ressources, vous verrez que le fichier est maintenant répertorié comme l’une des ressources du site web.
Dans un projet réel, vous pouvez lier jusqu’à quatre fichiers de menu distincts, pour offrir aux visiteurs quatre fichiers PDF téléchargeables distincts qu’ils peuvent utiliser pour afficher et imprimer les menus. Mais dans le cadre de ce tutoriel, le bouton Télécharger contient un lien vers le même fichier PDF dans chaque zone de la page.
Selon le navigateur que vous utilisez et les préférences de ce navigateur, vous pourrez observer différents comportements. Certains navigateurs affichent le fichier PDF dans la fenêtre du navigateur alors que d’autres téléchargent simplement le fichier PDF sur votre bureau, où vous pourrez l’ouvrir à l’aide d’Acrobat Pro ou d’Acrobat Reader.
Si vous utilisez Adobe Muse depuis un certain temps, vous avez sans doute remarqué que le menu Liens a été récemment réorganisé en sections afin qu’il soit plus facile de trouver les noms et les éléments de page pour lesquels un lien peut être créé. Dans cette section, vous examinerez plus en détails la structure du menu Liens, ainsi que la possibilité de filtrer les éléments de la liste de menus. Vous allez également apprendre à ajouter des liens de courrier électronique.
Maintenant que les boutons des icônes des réseaux sociaux sont en place, vous allez ajouter les liens externes vers chacun des sites de réseaux sociaux.
Il s’agit d’une convention commune relative à la conception web : les liens vers d’autres pages du même site s’ouvrent dans la même fenêtre de navigateur (comportement par défaut dans Adobe Muse) et les liens vers des pages d’autres sites web externes s’ouvrent dans une nouvelle fenêtre ou un nouvel onglet.
Pour préparer le lien avant de l’ajouter à une page de votre site Adobe Muse, vous allez utiliser un navigateur pour visiter le fichier chargé, en direct. Procédez comme suit :
A ce stade, l’URL vers le fichier dépendant a été copiée dans le presse-papiers. Prenez soin de ne copier aucun autre élément, tant que vous n’avez pas collé l’URL du fichier dépendant dans le champ de l’hyperlien, comme décrit à la section suivante.
Une fois que vous avez réussi à télécharger un fichier dépendant, accessible via un navigateur, et que vous avez copié l’adresse URL de ce fichier, la dernière étape consiste à créer le lien dans une page de votre site Adobe Muse. Procédez comme suit :
Si vous souhaitez définir le lien pour qu’il s’ouvre dans une nouvelle fenêtre de navigateur, cliquez sur le libellé de l’hyperlien immédiatement à gauche de la fenêtre de l’hyperlien. Dans la boîte de dialogue qui s’affiche, activez la case à cocher en regard de l’option Ouvrir le lien dans un(e) nouvel(le) onglet/page, comme indiqué ci-dessous.
Enregistrez la page et publiez les modifications apportées au site.
Visitez la page dans un navigateur. Cliquez sur le texte ou bouton de lien pour vérifier que le lien fonctionne comme il se doit.
Vous pouvez essayer de visiter votre site dans plusieurs navigateurs différents, tels que Chrome, Safari et Firefox, pour voir si les différents navigateurs se comportent comme il se doit lorsque vous cliquez sur le lien dans le site en direct pour accéder au fichier dépendant.
Pour plus de conseils sur l’utilisation d’Adobe Muse, visitez la page d’aide et de tutoriels d’Adobe Muse ou la page des événements d’Adobe Muse pour accéder à des webinaires en temps réel ou enregistrés.
Accéder à votre compte