Je voulais vous faire découvrir un petit service internet bien utile, qui peut vous faciliter la vie si vous créer un blog ou un site internet.
Lorsque vous créez une telle plate-forme, vous êtes soumis à une double contrainte :
- 1/ Faire un site le plus beau possible, avec des images originales qui vont parler au lecteur. De nombreuses études ont mis en évidence le fait que des images grandes retenaient plus l’attention que des petites.
- 2/ Faire en sorte que votre site soit rapide à l’affichage, Google prenant en compte ce facteur dans son positionnement et le lecteur ayant tendance à ne pas s’attarder sur un site qui rame.
Pas évident, du coup, de faire un site à la fois imagé et rapide.
C’est là qu’intervient une petite astuce : au lieu de mettre côte à côte plusieurs images cliquables, pourquoi ne pas rassembler tous ces petits bouts d’images en une seule grande image tout en permettant de faire cliquer l’internaute à plusieurs endroits de cette image ?
C’est ce que l’on appelle le MAPPING. L’avantage est qu’une seule image peut être facilement réduite à l’aide de logiciels spécifiques (personnellement j’utilise RIOT que j’adore, mais il en existe d’autres).
Le MAPPING est un code qui permet cet exploit. Pour ceux qui ne savent pas coder, IMAGE-MAPS.COM devient un service en ligne très efficace.
- Tout ce que vous avez à faire, c’est de préparer votre image, comme par exemple celle ci-dessous, de l’héberger sur votre site (ou sur n’importe quel site d’hébergement) puis de coller l’adresse.
Améliorez votre anonymat en ligne
Pensez à l'utilisation d'un VPN : une application VPN va changer votre adresse IP pour simuler celle de n'importe quel pays. Vous pourrez accéder à n'importe quel contenu, même celui qui est géo-restreint. Ce logiciel chiffre aussi votre trafic internet pour éliminer les malwares et les risques de piratage. Pensez à utiliser un gestionnaire de mots de passe
- Ensuite vous cliquez sur « Start Mapping Your Image ».
- Vous avez alors accès à un rectangle. Vous dessinez les rectangles qui seront vos zones cliquables et insérez leur adresse de renvoi du lien.
- Vous découpez ainsi de multiples zones dans votre image.
- Enfin, le service vous donne votre code « Get Your Code » que vous pourrez insérer dans votre code source.
Le code délivré ressemble à ça :
Rien ne vous empêche de coder à la main, mais j’ai trouvé que ce service permettait un gain de temps bien sympathique.
Résultats après quelques essais de ma part ?
- ==> Un gain dans la vitesse d’affichage non négligeable.
- ==> Par contre, en terme de référencement, j’ai des doutes : Est-ce que Google parvient à savoir que cette image est cliquable en de multiples endroits et la prend-elle en compte de la même manière ? Vos expériences en la matière sont les bienvenues.
Ok, tu m’as convaincu.
Personnellement je pense que les balises « map » et « area » sont obsolètes, et devront passer « deprecated » dans les prochaines versions d’HTML. Il vaut mieux à présent passer par la technique des « images sprites » qui permet le même gain en quantité de ko à télécharger, un meilleur balisage HTML et une maintenance plus aisée, voir cet ancien article qui en parlait.
En terme de SEO par contre je ne pense pas que ça coince tant que l’attribut « alt » est bien renseigné.