6. Des liens cachés !

Maintenant qu’on a vu tous les éléments multimédia, je vous propose de vous montrer une petite technique qui va permettre de rendre nos éléments cliquables, comme des liens. On l’utilise surtout pour les images, mais sachez qu’elle fonctionne partout.

L’idée est en fait d’imbriquer une image dans un lien (a). L’image fera donc partie du lien, qui aura une adresse. Ainsi, quand on cliquera sur l’image, le lien s’activera et nous redirigera vers son adresse.

Voici un exemple pour concrétiser tout ça :

<a href="https://www.alexandria-library.co/">
	<img src="assets/image.jpg" alt="Une image">
</a>

Ici, nous avons notre lien vers la bibliothèque d’alexandrie, mais plutôt que de contenir du texte, il contient l’image que je lui ai donnée. Cela nous donne une image cliquable qui redirige vers la Bibliothèque d’Alexandrie.

INFO: La balise “a” possède un attribut très utile : “target”. “target” peut prendre une liste de valeurs précises, mais la plus courante est “_blank”. Elle va permettre d’ouvrir le lien dans un nouvel onglet, au lieu de remplacer l’onglet actuel. La syntaxe est donc :

<a href="..." target="_blank"></a>

Vous vous souvenez du lien “en savoir plus” de notre Pokédex, qui redirige vers Poképédia? Eh bien je vous propose de le mettre dans l’image de chaque Pokémon, ça fera gagner de la place ! Au passage, faites en sorte qu’il s’ouvre dans un nouvel onglet 😉. 

Voilà, je vous ai dévoilé une petite technique bien utile. Et n’oubliez pas, vous pouvez l’utiliser sur n’importe quel élément de votre page.

En tout cas c’est la fin de ce chapitre, nous nous retrouverons dans le prochain pour réorganiser notre site en plusieurs pages.