Tutoriel référencement Flash

La problématique du Flash pour le référencement

Est-il difficile de bien référencer un site en Flash ? Tout dépend des cas ! On distingue 2 types de sites (je schématise) :

1. tout le contenu du site est intégré dans une seule animation Flash affichée en page d'accueil : dans ce cas le site ne possède qu'une seule page HTML (ou quelques autres pour les contacts ou mentions légales), si bien qu'il n'arrivera jamais à être bien positionné sur un grand nombre de mots-clés. C'est le cas qui pose vraiment problème et pour lequel il n'existe pas (à ma connaissance) de solution optimale... à part se ramener au 2nd cas !
2. le site utilise intensément des animations Flash sur ses pages, mais l'unité de base de la consultation du site reste la page. C'est pas exemple un site de ecommerce qui sur chaque fiche produit affiche les caractéristiques via une animation Flash. Dans ce cas il n'y a pas vraiment de problème, il suffit de prévoir sur chaque page un contenu alternatif au Flash, qui sera lu par ceux qui n'ont pas de lecteur Flash, et notamment les moteurs de recherche.

Les méthodes

Les méthodes qui suivent donnent une solution pour le 2nd cas, c'est-à-dire fournir un contenu alternatif équivalent à celui de l'animation Flash.

La méthode de la balise noembed

Elle consiste à ajouter du contenu textuel (ou des images...) entre les balises et . L'inconvénient de cette méthode est que la balise noembed n'est pas conforme aux recommandations du W3C (tout comme la balise embed bien entendu).

La méthode SWFObject (JavaScript)

Les explications détaillées sont ici en français et là en anglais pour l'article original.

SWFObject est un petit script JavaScript utilisé pour inclure un contenu Flash dans une page HTML. Le script détecte le plug-in Flash dans tous les principaux navigateurs (sur MAC et PC) et est conçu pour rendre l’intégration des animations SWF aussi simple que possible. L'intégration dans la page est compatible avec les normes HTML et XHTML 1.0 (compatible avec les spécifications futures).

Auparavant, SWFObject s'appelait FlashObject, mais il a dû être renommé pour des raisons de copyright.

Voici un exemple de code :

Ici du texte ou des images pour le contenu alternatif
pris en compte par les moteurs de recherche

Comme vous l'avez compris, il faut :

• récupérer le fichier swfobject.js sur votre site (dans cet exemple il est à la racine du site)
• inclure ce JavaScript dans la page qui doit afficher du Flash
• utiliser une balise div avec comme identifiant flashcontent
• inclure 2 lignes de JavaScript pour configurer l'animation Flash (source, taille, etc.)

Si le navigateur gère le Flash, l'animation s'affichera à la place de la balise div, sinon c'est le contenu de cette balise qui s'affichera (du texte, des images, ce que vous voulez). Bien entendu les moteurs de recherche tiennent compte du contenu de cette balise div.

Pour configurer votre animation, paramétrez comme il faut la création de l'objet SWFObject en appelant son constructeur SWFObject(swf, id, largeur, hauteur, version, couleur) :

• swf : le chemin vers le fichier .swf
• id : l'identifiant de l'objet Flash
• largeur : largeur de l'animation Flash (en pixels)
• hauteur : hauteur de l'animation Flash (en pixels)
• version : le numéro de version Flash
• couleur : la couleur de fond

Pour télécharger swfobject.js et un exemple d'utilisation de SWFObject, cliquez ici (fichier ZIP).

L'avantage de cette méthode est que sous IE il n'y a plus besoin de cliquer pour activer l'animation Flash (on en parlait lors de la sortie du patch pour le Flash dans IE). D'après ce que je lis souvent, cette méthode est sans doute la plus appréciée aujourd'hui. Dites-moi si je me trompe !

La méthode Flash Satay

Je vous laisse lire les explications ici en français ou bien là en anglais pour l'article original, je n'ai pas testé... Voici un exemple de code :