"Zones cliquables" et référencement

[Helldream]

Bonjour,

Afin de ne pas multiplier pour rien le nombres d'éléments à charger pour afficher la page, j'ai choisi d'inclure quelques boutons de navigation dans l'image du header. J'ai donc besoin d'ajouter des "zones cliquables" sur ces boutons, pour les rendre cliquables.

Le problème est que j'aimerais aussi ne pas perdre en terme de référencement de ces liens.

J'ai pensé faire des liens de ce genre :

<a href="mon_lien" style="display: block; width: 200px; height: 100px; border: 0px;" title="mon_titre"> </a>

Cependant, je ne sais pas si le fait qu'il n'y ait qu'un espace insécable entre les balises <a> et </a> va poser problème pour le référencement du lien, malgré l'utilisation de l'attribut "title"...

J'aurais aussi pu faire quelque chose comme ça :

<a href="mon_lien" style="display: block; width: 200px; height: 100px; border: 0px;" title="mon_titre"><span style="display: none;">Mon titre</span></a>

Mais il ne faudrait pas que Google considère cela comme une tentative de fausser le jugement de son robot, et intégrant du texte non visible par l'utilisateur (même s'il ne s'agit que de quelques mots)...

Enfin, la dernière solution serait de découper l'image de mes boutons, puis de les intégrer en faisant :

<a href="mon_lien" style="display: block; width: 200px; height: 100px; border: 0px;" title="mon_titre"><img src="ma_photo" alt="Mon titre" /></a>

Dans ce cas, ça revient à créer une image par lien, ce qui est un peu dommage (et qui va m'obliger à placer au pixel près l'image afin qu'elle soit correctement inclue dans l'image du header)...

D'après vous, quelle est la meilleure solution?

Merci d'avance.

[Ernestine]

Salut,

Point de vue référencement, oublie les deux premières solutions : l'attribut title d'un lien n'est pas pris en compte par Google (du moins c'est ce que j'ai pu lire à droite à gauche, après, peut-être que les choses ont changé, mais en tous cas cet attribut n'a quasiment aucun poids) et il est aussi fortement probable que Google détecte le display:none

La troisième solution est de loin la meilleure, non seulement pour le référencement, mais aussi pour l'accessibilité générale du site. Et puis placer l'image en absolute au pixel près n'est pas compliqué.

[jcaron]

Et tu n'es pas réellement obligé d'avoir une image (un fichier) par lien. Tu peux avoir une seule image, dont tu ne vas afficher qu'un seul bout à chaque fois en manipulant background_position (avec des offsets négatifs). C'est la technique du "sprite".

Une autre solution, mais j'avoue que je n'ai aucune idée de ce que ça donne en termes de référencement (ce qui doit aussi varier suivant les options choisies), c'est d'utiliser des imagemaps:
/>http://www.w3.org/TR/html4/struct/objects.html#h-13.6

Jacques.