Meilleure façon de référencer un site en Flash : parlons-en

[chben]

Bonjour,
L'objectif de ce post est de chercher (trouver ?) la meilleure solution ou toutes les astuces pour référencer au mieux un site en flash.

Je ne reviendrai pas sur le frein que constitue le flash pour le référencement quand la totalité du site est en flash, le but étant bien de trouver le meilleur moyen de réduire ce frein au maximum car je ne dois pas être le seul à mettre en ligne ce genre de sites.

Voici donc comme point de départ ma façon de procéder. Je pense que j'applique seulement les bases de ce qu'il faut faire pour tout site qui veut se faire référencer.

1. Optimisation de la balise Title
On sait tous à quel point c'est capital donc je passe rapidement.

2. Optimisation des balises metas
Idem, on ne répétera jamais assez qu'un bon référencement passe par une recherche sérieuse et en amont de la rédaction du contenu des bons termes sur lesquels on souhaite voir positionné son site. C'est d'autant plus important que pour un site en flash, si l'on ne fait rien, le site n'aura pas d'autre contenu que celui inséré dans la balise description.

3. Intégration du flash dans la page
On peut utiliser deux balises différentes pour appeler le flash dans la page : la balise <embed> et <object>.
Personnellement j'utilise la balise <object> qui est plus pérenne (je pense au XHTML) que la balise <embed>.

Ainsi, un appel type d'un flash se présente comme ceci :

Code: Tout sélectionner

<object
   type="application/x-shockwave-flash"
   width="747"
   height="415"
   data="anim_flash.swf"
   id="catalogue"
   title="titre de mon Flash">
   <param name="movie" value="swf/loading.swf?page=swf/menu.swf" />
   <param name="quality" value="high" />
   <param name="bgcolor" value="#FEF1BA" />
</object>


On notera les balises <param> qui permettent la reconnaissance et l'appel du flash aussi bien dans IE que dans Mozilla.

4. L'Attribut "title"
Pour les mêmes raisons qu'il faut renseigner l'attribut "alt" pour les images (lorsque cela est utile d'un point de vue sémantique), il est important de renseigner un "title" à votre objet Flash.
Pensez à ce que "voient" les navigateurs en mode texte (ce qui correspond à ce qui est lu à des personnes mal voyantes).
C'est aussi, il faut bien le dire, un petit plus pour le référencement.

4. Intégration du contenu alternatif
De là viennent tous les espoirs de référencement lorsqu'on s'occupe d'un site entièrement en flash.
Pour rappel, il est possible de placer un contenu html correspondant à notre objet Flash qui s'affichera automatiquement si le navigateur ne possède pas le player Flash.
Pour la balise <embed>, il faut insérer le texte entre balises <noembed> : <embed src="anim_flash.swf"><noembed><p>Ici mon texte alternatif</noembed></embed>.
Pour la balise <object>, le texte alternatif s'insère comme ceci : <object src="animaction.swf"><p>ici mon texte alternatif</p></object>.

5. Texte alternatif : Du contenu et un menu de navigation
Lorsque je parle du texte alternatif, je pense à deux choses :
a) Reprendre le contenu textuel du flash pour le transcrire en HTML
b) Créer un menu de navigation en utilisant les liens hypertextes afin que le moteur puisse circuler normalement dans le site malgré le flash.

6. Validation XHTML
Personnellement, j'essaye de valider systématiquement toutes mes pages en XHTML (strict si possible).
Pourquoi ?
a) Pour assurer la différenciation entre données et mise en forme. Ma page ne comporte que du contenu utile qui n'est pas dilué dans des balises servant à la mise en page de mes objets ; J'optimise alors la densité des mots clés (le gain est peut être minime mais tout est bon à prendre surtout pour en site en flash).
b) Pour assurer la pérennité de mon code, comme énoncé plus haut.
c) C'est pour moi un indice de qualité et une garantie de fonctionnement selon les recommandations du W3C.
Perso, je code avant tout d'après les recommandations et sous mozilla, puis j'applique les corrections/rustines/hacks qu'il faut pour avoir un rendu correct (j'ai pas dit "identique" !) sous tous les navigateurs.

7. Soumission du site aux moteurs de recherches et annuaires
Je ne connaît pas beaucoup d'outils permettant la soumission automatique d'un site auprès des moteurs et annuaires existants.
L'outil du site abondance pour est un point de départ pour aborder ce point.
Un gros travail de soumission manuelle est à faire auprès de tous les annuaires généralistes et spécilialisés qui traitent de sujets en rapport avec celui du site.
Je teste actuellement l'outil de référencement automatique du site referencement-automatique.net qui permet de faire la soumission d'un coup sur un peu moins de 30 annuaires généralistes. Je n'ai pour l'instant pas assez de recul pour vous dire si l'outil est efficace ou non, mais s'il s'avère efficace, ce sera un de mes favoris car la procédure de soumission n'aura pas pris plus d'une minute.

8. Promotion du site
Comme pour tout site, il faut se faire connaîtres des sites externes ayant pour sujet celui dont traite le site à référencer.
Je n'ai pas pour l'instant eu l'occasion de procéder à des échanges de liens, mais si cela est fait intelligemment je pense que cette pratique est très efficace.

Je pense avoir fait le tour de ce que je pense être le squelette de mon travail de développement et de référencement actuellement.

J'espère bien sûr que vous n'hésiterez pas à ouvrir la discussion en apportant vos critiques, vos remarques, vos suggestions et vos astuces à vous qui pourraient venir optimiser un peu plus ce schéma de construction du point de vue référencement et aussi du point de vue technique.

[chben]

Je me pose la question de savoir si un moteur de recherche (googleBot en particulier) suit bien les liens insérés dans le texte alternatif.

Je pense que oui, mais étant donné l'efficacité du référencement de mes sites Flash, qui est plutôt médiocre sur google mais très correcte sur MSN search par exemple, j'aimerais quand même avoir une confirmation des spécialistes.

[mike006]

4. Intégration du contenu alternatif
De là viennent tous les espoirs de référencement lorsqu'on s'occupe d'un site entièrement en flash.
Pour rappel, il est possible de placer un contenu html correspondant à notre objet Flash qui s'affichera automatiquement si le navigateur ne possède pas le player Flash.
Pour la balise <embed>, il faut insérer le texte entre balises <noembed> : <embed src="anim_flash.swf"><noembed><p>Ici mon texte alternatif</noembed></embed>.
Pour la balise <object>, le texte alternatif s'insère comme ceci : <object src="animaction.swf"><p>ici mon texte alternatif</p></object>.

Finalement n'est ce pas là le plus épineux ? quelle quatité de texte préconises-tu à cet endroit ? TOUT le contenu textuel du site ? les différents abus qu'il y a pu y avoir ne rendent-ils pas cette balise moins lue ?

[netsys]

Ben en fait avec flash comme tu l'as vu (sous Google) c'est pas la gloire.
La balise de contenu alternatif existe mais son contenu est semble t-il moins bien pris en compte par Google que du contenu "classique".

Pour le ref d'un site en flash je préconise "les rustines" ou solutions de secours comme le cloacking et les pages satéllites.
(du moment que ce qu'on y met correspond avec le contenu du flash car il ne s'agit pas de spamer ou de tromper les visiteurs)

[chben]

Pour le texte alternatif, la logique voudrait qu'on y mette tout le contenu textuel utile que contient le flash.
A n'en pas douter, des abus ont dû être commis concernant ce texte alternatif. Mais on peut tout autant abuser dans du texte en clair et à mon sens, ce texte, bien qu'alternatif, est bien censé être du vrai contenu !
N'oublions pas que malheureusement beaucoup de personnes ont des problèmes de vue ou d'audition et que le texte alternatif est alors le seul moyen pour eux de se représenter la structure d'un site.

Un site internet, c'est avant tout un contenu, PUIS, un design.
Je suis de ceux qui pensent que le design ne doit pas empêcher le contenu d'être accessible.

[chben]

Plutôt que d'utiliser des pages satellites, pour les sites flash, pourquoi ne pas plutôt mette leur contenu justement en texte alternatif ?
Personnellement je trouve ça plus logique et je vois là un moyen de rendre plus propre l'arborescence.

Cela évite également de faire une page d'accueil en html qui lance le site Flash en popup, comme on le voit souvent. La popup, étant de plus en plus bannie automatiquement par les navigateurs et pas toujours top d'un point de vue ergonomique.

[netsys]

Par ce que Google n'aime pas trop les noembed...

[chben]

Par ce que Google n'aime pas trop les noembed...

Et la balise object non plus alors ?

Voilà qui est fâcheux et qui me déçoit car ça ne favorise pas le référencement "naturel".

[netsys]

Quand je dis que Google n'aime pas, c'est par expérience. Et tu sembles aussi l'avoir remarqué.
Une page en flash n'aura pas la même efficacité qu'une page sans,
que les choses soient dites !

[eclipsis]

Le meilleur moyen est de faire un script testant la version de Flash et affichant l'anim si la bonne version est détectée, et d'avoir un contenu alternatif texte dans le <noscript> pour ceux qui ne lisent pas le javascript. Comme les robots lisent mal le contenu de Flash (a fortiori si c'est mis dans un script javascript), ils liront le contenu alternatif et la page pourra être référencée parfaitement.
Ce n'est pas tip-top comme méthode vu que c'est deux fois plus de boulot, mais tant que les moteurs ne seront pas plus performants à référencer le flash, c'est une méthode qui fonctionne.

[chben]

Le meilleur moyen est de faire un script testant la version de Flash et affichant l'anim si la bonne version est détectée, et d'avoir un contenu alternatif texte dans le <noscript> pour ceux qui ne lisent pas le javascript.

C'est intéressant en effet.
Mais si, d'après nos vécus, google accorde effectivement moins d'importance au contenu alternatif du embed et du object, il en fera autant pour le <noscript>...
Est-ce que je me trompe ?

Je tiens également à rappeler que mon but n'est pas de faire référencer mon Flash, car je pense que c'est franchement pas faisable pour l'instant. et de toute façon, c'est bien le site que je veux faire apparaître dans les résultats et non mon Flash.
Voilou.

[e-kiwi]

en bas de ton site flash, tu met >version html< et tu fais une copie de ton site en dur

[turulillo]

Très beau topic Chben.
J'essaierais de repasser d'ici la fin de la semaine pour rajouter quelques commentaires, mais tu as fait un excellent travail de compilation de l'information disponible à ce sujet.
Sur les forums US le sujet a été maintes fois abordé et il semblerait que de nouvelles solutions voient le jour.
Je n'ai malheuresement pas le temps de rentrer dans le détail mais je vais essayer de trouver quelques adresses avant de clore mon post...
ça y est j'ai retrouvé les liens que je voulais vous montrer.
D'abord il faut commencer par la:
http://shauninman.com/mentary/past/ifr_ ... native.php
puis la remise à jour ensuite ici:
http://www.shauninman.com/mentary/past/ ... evised.php
J'aimerais bien que tu me dises ce que tu en penses Chben.

[chben]

J'ai pas eu le temps de tout lire, mais ça parait très intéressant.
En revanche, g vraiment du mal à le lire : c'est écrit en tout petit, g pas trouvé de site d'exemple d'application.
C'est ptet parce que j'ai survolé, mais bon.

Voilà ce que moi g compris :
1. J'écris ma page HTML, avec des div, des p, etc... en mentionnant leurs id
2. Je créé un flash dynamique qui est prêt à recevoir en variable le contenu de ce qui est écrit dans la page web. Par exemple, un variable pour le titre H1, une autre pour le 1er paragraphe, etc...
3. Je fais une fonction javascript qui :
a. Détecte le player Flash
b. Si pas de Player : la page HTML basique est affichée
c. Si y a un player : Flash, la fonction efface les balises HTML une à une de façon méthodique pour les passer en variable au Flash qui les affichera.

L'intérêt de cette méthode serait :
1. L'utilisateur qui a le player flash installé voit son flash normalement et la page HTML ne comporte pas des milliers de balises ou de code ou de contenu alternatif au flash qui "ne servirait à rien".
2. L'utilisateur qui n'a pas le player Flash voit toujours une belle page HTML à laquelle peut être appliquée une CSS de la façon la plus normale qui soit
3. Le googleBot qui passe sur le site qui qui interprète pas le javascript ne verra que la page HTML normale, et donc indexera mieux le contenu que si celui-ci était dans une balise <object> ou <noembed>
4. Plus de pages satellites à faire : les pages s'autosuffisent et aucun risque de se voir blacklisté pour des raisons de pages satellites.

L'inconvénient de cette méthode :
1. Il faut être blindé en javascript et aimer ça.
2. Il faut prévoir le flash bien en amont pour prévoir quelles variable vont être utilisées. Or, par exemple là où je travaille, l'infographiste qui fait du flash ne touche pas du tout à l'actionscript !! - Il serait difficile de lui imposer un structure si rigide dès le départ du projet. C'est possible, mais difficile pour les "graphistes purs".

Mais bien sûr, tout cela est à prendre avec des pincettes puisque je ne garanti pas avoir tout bien compris de l'article, donc si je l'ai mal interprêté, il ne faudra pas tenir compte de ces remarques.
Cela dit ce serait une piste à explorer !!

[chben]

Bon, j'ai pris le temps de lire l'article.
En fait, le type utilise du javascript pour remplacer certaines balises de sa page par des éléments Flash qui en reprennent le contenu.

Ainsi, une balise H1 pourra être remplacer par un bandeau Flash grapiquement élaboré, et ce, de manière dynamique, c'est-à-dire que ceux qui maintiennent le site n'auront pas besoin d'aller modifier le swf pour changer le titre de la page.

L'objectif est de faciliter la mise à jour de sites qui sont d'un point de vue "contenu" des usines à gaz et qui veulent présenter des éléments de ce contenu dans des swf (des bandeaux qui clignotent, qui ont des polices originales avec des effets dans tous les sens dessus, ...)

Pour les ptits sites....à part pour avoir un référencement plus optimiser, je suis pas sûr que ce soit nécessaire.

Mais le but de mon post étant d'avoir un bon référencement, je crois que je vais tenter d'appliquer cette technique pour tester son impact.

Je vais d'ailleurs faire un autre post pour demander comment se débrouiller pour faire des tests sur les fonctionnement de google...je mettrais le lien dès que je l'aurais créé.