Comment créer un lien hypertexte dans Photoshop
En utilisant l'outil Tranche dans Adobe Photoshop CC, vous pouvez transformer n'importe quelle image, ou partie d'une image, en lien hypertexte cliquable. L'astuce est que pour faire fonctionner le lien hypertexte, vous devez enregistrer l'image en tant que fichier HTML plutôt que comme un simple JPG ou PNG. Heureusement, c'est une fonctionnalité que tout le monde peut utiliser, même si vous n'êtes pas expert en codage. Photoshop crée le code HTML pour vous et incorpore l'image dans un format d'image compatible Web.
Étape 1
Ouvrez n'importe quelle image dans Photoshop. Idéalement, elle devrait être assez grande pour bien s'afficher dans un navigateur Web. Sélectionnez l' « Outil Tranche » dans la boîte à outils. S'il n'est pas visible, cliquez et maintenez le coin inférieur droit de l'outil Recadrage, ou d'un autre outil de son groupe visible, puis sélectionnez « Outil Tranche ».
Étape 2
Faites glisser le curseur sur la zone que vous souhaitez rendre cliquable. Pour créer un seul lien hypertexte sur une image, vous pouvez faire glisser le curseur sur toute l'image.
Étape 3
Faites glisser le curseur de l'outil Tranche sur seulement une partie de l'image si vous voulez plus d'un lien hypertexte. Après avoir relâché le bouton de la souris, vous pouvez alors créer une deuxième tranche pour le prochain lien hypertexte. Si vous le souhaitez, vous pouvez créer une douzaine ou plus de liens hypertexte sur une seule image.
Étape 4
Double-cliquez sur une tranche avec l'outil Tranche pour ouvrir la fenêtre Options de tranche. Pour créer un lien hypertexte, vous devez taper l'adresse de la page Web dans le champ « URL ». Bien que les autres champs soient facultatifs, utiliser un nom aidera à distinguer un lien d'un autre. Ajouter « _blank » au champ Cible spécifie que le lien doit s'ouvrir dans un nouvel onglet de navigateur Web. Le champ Balise Alt est le texte qui s'affiche si votre image n'est pas visible dans les navigateurs non graphiques ou pendant le chargement de l'image. Le champ Texte du message est ce que le navigateur affiche à la place de l'URL dans sa barre d'état.
Étape 5
Sélectionnez « Enregistrer pour le Web » dans le menu Fichier une fois vos liens terminés. Sélectionnez soit « PNG-24 » soit « JPG » comme Préréglage, puis cliquez sur le bouton « Enregistrer ». Cliquez sur le menu « Format » et sélectionnez « HTML et images ». Cela change le format de fichier en HTML. Après avoir cliqué sur « Enregistrer », Photoshop crée une seule page HTML utilisant l'image et les liens que vous avez créés. Le fichier image lui-même est enregistré dans un dossier Images. Téléchargez à la fois le fichier HTML et le dossier Images dans le même répertoire sur votre site web en utilisant votre client FTP préféré.
Astuce
Avec un éditeur de texte basique comme le Bloc-notes, vous pouvez modifier le code du fichier HTML comme vous le feriez avec n'importe quelle page Web. Par exemple, si vous préférez garder les images de votre site dans un dossier différent, vous pouvez changer le dossier « /images » spécifié par n'importe quel dossier de votre choix, puis déplacer l'image dans ce dossier.
Vous n'avez pas besoin de Photoshop pour ajouter un lien hypertexte à une image à l'intérieur d'une page Web ou d'un email. La plupart des programmes de messagerie incluent une fonctionnalité de lien hypertexte, normalement disponible simplement en faisant un clic droit sur l'image après l'avoir insérée dans votre message. Si vous téléchargez l'image sur votre site web, vous pouvez l'ajouter comme image cliquable à n'importe quelle page en utilisant du code HTML5 tel que : <a href="url"><img src="image.jpg" alt="description"></a>