Bonjour à tous (je place le sujet ici, ne sachant trop où le mettre si un modo veut le déplacer dans une partie plus appropriée)

Je me pose une petite question sur le display:none et le référencement.

J'ai lu cet article dont l'auteur explique qu'il a été déprécié par google pour un display none (mais l'article date de 2007). J'ai trouvé sur le forum ceci, mais là encore pas plus de réponse pour mon problème.

Mon cas particulier. J'ai 5 images, qui vont devenir un slide grâce au plugin cycle en jquery. Le problème est qu'il y a un temps de latence entre le chargement de la page, temps durant lequel l'utilisateur voit les 5 images les unes en dessous des autres pendant une seconde, le temps que le plugin mette justement ces images en display:none ce qui nous donne ceci :

upload/29058-displaynon.png

Pas très joli hein ? Pareil si le javascript est désactivé. Du coup pour résoudre les deux souci d'un coup, je me suis dit "et si j'aidais le plugin en lui mettant directement les 4 autres images en display:none". Voici donc le code :


<div id="slideshow">
<img width="500" height="300" alt="Gl&uuml;hbirnen durch Energiesparlampen ersetzen" src="documents/fck/image/slideshow/img1.png" />
<img width="500" height="300" alt=" die Stadt im Nacht, viel Licht, viel Strom verbraucht" src="documents/fck/image/slideshow/img2.png" style="display: none;" />
<img width="500" height="300" alt=" die Energie messen  f&uuml;r besser Kontrolle" src="documents/fck/image/slideshow/img3.png" style="display: none;" />
<img width="500" height="300" alt="&Ouml;kohause mit sauber Energie (Sonne-und Windenergie)" src="documents/fck/image/slideshow/img4.png" style="display: none;" />
<img width="500" height="300" alt="Energieverbrauch wird durch Statistik auf dem Bildschirm gezeigt" src="documents/fck/image/slideshow/img5.png" style="display: none;" />
</div>


Cela fonctionne parfaitement : plus de délais de latence avec les 5 images, et une seule image (la 1er) quand le javascript est désactivé.
Mais je ne suis pas fan du display:none, pour des raisons d'accessibilité, et du coup je me pose également des questions niveau référencement. J'ai voulu remplacer le display:none par un text-indent:-5000px, mais du coup j'ai quand même le délais au chargement et les 5 images qui apparaissent.

Ma question: est ce que ce display:none risque de pénaliser le référencement de mon site ? Ça m'ennuierait surtout qu'il est sur la page d'accueil. Pour le moment le site n'est pas encore référençable, problème de registrar des noms de domaine en .de (le temps qu'il vérifient apparemment), donc sur serveur privé, mais je préfère prend les devants.
Sinon une idée pour le même résultat sans display:none ?

Merci d'avance Smiley smile
Modifié par saiko_sama (22 Jun 2010 - 13:40)
Bonjour,

Le display:none ne pénalisera pas le référencement de ton site. Mais risque d'empècher celui de tes images (et encore, rien de sûr, puisque Google peut ignorer les CSS). Le principal problème est une question d'accessibilité : sans JS, les 4 autres images disparaissent.

L'article que tu site n'est pas un bon exemple. L'auteur avait placé en display:none une grande quantité de texte, ce que google a interprété comme une tentative de "spam".
Modifié par Laurie-Anne (22 Jun 2010 - 13:45)
a écrit :
Mais risque d'empècher celui de tes images (et encore, rien de sûr, puisque Google peut ignorer les CSS)

C'est justement cela qui m'ennuie un peu, ayant choisi les images en fonction du thème et rempli les balises alt pour à la fois décrire l'image tout en y incluant des mots clé, espérons que non Smiley smile

a écrit :
Le principal problème est une question d'accessibilité : sans JS, les 4 autres images disparaissent.

J'avoue que je ne sais pas trop si les navigateurs visuels prennent en compte le JS ou pas, si quelqu'un a la réponse. Dans l'absolu c'était le but, de n'afficher qu'une image si le JS est désactivé. Les images sont là pour illustrer, voir même simplement "décorer", mais bon, elle ne sont pas non plus primordiales, ce sont de simples jolies photos pour donner un peu d'animation à la page d'accueil. Mais c'est vrai que sans JS pour un navigateur visuel, il est peut être dommage de perdre les 4 autres attributs alt. Mais bon, mon idée d'avant consistait à mettre les images dans un script et une seule image dans un noscript, même résultat, pas de js, qu'une seule image chargée.
Modifié par saiko_sama (22 Jun 2010 - 13:54)
Dans ce cas (et uniquement dans ce cas : image principalement décorative), je pense que ta solution est bonne.

Tu n'as pas trop de soucis à te faire du point de vue référencement non plus.