Annonces Google

Vous êtes ici : Dossiers référencement > Débuter en référencement

Tuto : guide du référencement d'un site en Flash

Par , le 14 janvier 2015

Pendant des années, il était difficile de référencer un site en Flash, puis Google s'est mis à indexer le Flash. Il existe aussi des méthodes qui permettent de pallier certains problèmes liés au Flash. Aujourd'hui, c'est dépassé en raison de l'incompatibilité de Flash sur mobile...

Article mis à jour le 14/01/2015, publié initialement le 04/08/2008

A cause du mobile, Flash c'est fini !

Je laisse en ligne tout ce tuto Flash et SEO, même si mon conseil est très simple : abandonnez le Flash ! En effet, il n'est pas compatible avec les mobiles (iPhone et iPad sur iOS, tablettes et smartphones Android, et sans doute Windows Phone).

Si vous avez encore un site en Flash et que vous ne pouvez pas encore le refaire, suivez le reste de cet article...

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.

Flash

Les méthodes pour référencer du Flash

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.

Concrètement, tant que ce contenu alternatif est similaire à celui du Flash, vous ne prenez pas de risques vis-à-vis des consignes des moteurs. Attention à la tentation de suroptimiser ce contenu...

La méthode de la balise noembed

Elle consiste à ajouter du contenu textuel (ou des images...) entre les balises <noembed> et </noembed>. 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 anglais.

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 :

<script type="text/javascript" src="/swfobject.js"></script>
<div id="flashcontent">
Ici du texte ou des images pour le contenu alternatif
pris en compte par les moteurs de recherche
</div>
<script type="text/javascript">
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
so.write("flashcontent");
</script>

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 :

<object type="application/x-shockwave-flash"
 data="c.swf?path=movie.swf" width="400" height="300">
 <param name="movie" value="c.swf?path=movie.swf" />
 Ici du texte ou des images pour le contenu alternatif
 pris en compte par les moteurs de recherche
</object>

La méthode Unobstrusive Flash Object (UFO)

Les explications détaillées sont ici en anglais. Il s'agit d'une méthode similaire à la méthode SWFObject, également entièrement compatible avec les recommandations du W3C. Unobstrusive signifie que les différents contenus de la page sont totalement dissociés et indépendants : (X)HTML, CSS et JavaScript.

Vos réactions...

Si vous connaissez d'autres méthodes de référencement du Flash, ou si vous souhaitez apporter des compléments, n'hésitez pas à utiliser les commentaires ! On discute du référencement des sites en Flash également dans le forum.

A propos de l'auteur : Olivier Duffez Olivier Duffez sur Google+ Olivier Duffez sur Twitter Olivier Duffez sur Facebook Olivier Duffez sur Pinterest Olivier Duffez sur LinkedIn

Consultant en référencement, Olivier Duffez a travaillé pour les plus grands sites (Doctissimo, FNAC,...). Il édite le site WebRankInfo qu'il a créé en 2002, devenu la + grande communauté francophone sur le SEO (+300.000 membres, 1,5 million de posts). Il est aussi cofondateur de Ranking Metrics, leader des formations webmarketing en France (SEO, AdWords, Analytics, réseaux sociaux) et éditrice de la plateforme MyRankingMetrics (crawler et audit SEO en ligne).

Article (Comment référencer un site en Flash : guide pratique) publié par WebRankInfo dans la rubrique Débuter en référencement. Si vous souhaitez publier un extrait de cet article sur votre site, assurez-vous de respecter les conditions générales d'utilisation de WebRankInfo.

24 commentaires

  • Céline ROBERT a dit le

    Depuis juin 2008, Google indexe le contenu des sites en flash.
    Adobe a publié les spécifications du format flash, permettant à Google de parcourir le contenu texte d'un fichier flash comme celui d'une page HTML.
    Le problème du référencement du flash ne serait donc plus un véritable problème.
    Cette info, publiée sur va certainement révolutionner le paysage du web et rendre de nombreux webdisigners (dont je fais partie) heureux !

  • Olivier Duffez a dit le

    Non ce n'est pas la fin des problèmes ! Si le contenu se trouve dans le Flash (et que Google l'indexe bien), c'est le fichier .swf qui pourra avoir des chances d'être bien placé et non pas la page HTML. Ce sera très rare, puisque ce fichier n'a sans doute pas de backlinks...

  • Céline Robert a dit le

    Je n'ai jamais dit que c'était la fin des problèmes... mais à ça va tout de même simplifier les choses ;-) puisque jusque là, le fichier swf restait opaque à Google.
    A tester bien sûr.
    Mais cette info date déjà de plusieurs mois et nul doute que tout ceci va évoluer.
    A suivre donc...

  • Olivier Duffez a dit le

    je ne partage pas du tout cet enthousiasme mais je ne vais plus chercher à convaincre

  • olivier63 a dit le

    Bonjour
    Je voudrais réagir par rapport a la méthode flash satay, celle-ci étant simplement faite pour le w3c.Une page comportant du flash ne sera pas reconnu et donc sera d'écrite comme comportant des erreurs la methode satay permet de résoudre tout sa.

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

    Je me suis permis de vous le remettre rectifier si vous le mettez comme ci-dessus je me retrouve avec une page html valider strict.
    si vous enlever les le w3c trouvera 1 erreur.

    Je pense que ceci est un bon début surtout pour les sites comportant que très peu de flash et qui se voyait comporter des erreurs.C'est toujours un plus à prendre pour le référencement.

  • Olivier Duffez a dit le

    désolé mais je n'ai pas compris... on peut avoir du Flash tout en étant valide W3C

  • olivier63 a dit le

    Bonsoir

    Excusez moi d'avoir était aussi long pour vous répondre mais je suis a fond dans la création de mon site.
    Donc pour répondre a votre question c'est oui j'y suis arriver, après mettre arracher tout mes cheveux, avoir voulu jeter le pc au moins une bonne centaines de fois, mais c'est chose faite.

  • carredas.biz a dit le

    Qui a dit que les sites full-flash n’étaient pas référençables ?

    La preuve de la faisabilité en cliquant ci-après avec ces 3 exemples:

    Tarmabloc :
    http://www.google.fr/search?hl=fr&q=site:www.tarmabloc.fr&btnG=Rechercher&meta=

    Consommez moins :
    http://www.consommermoinsdecarburant.com/

    Agence carredas :
    http://www.carredas.com
    http://www.google.fr/#hl=fr&q=site:www.carredas.com&meta=

  • satrope a dit le

    Bonsoir carredas.bis,

    peux tu nous donner la méthode pour bien référencer un site full-flash, comme ceux de tes exemples?

    merci à l'avance.

  • numerosix a dit le

    LA bonne méthode pour référencer un site en flash (full flash ou pas) semble etre swfObject. C'est aussi la methode utilisee par carredas, cite plus haut. Et par moi, Virtual Movies : http://www.virtual-movies.net

    Quelques commentaires sur les autres méthodes :

    La balise NOEMBED : idéale pour se fair blacklister. J'ai testé avec le Théâtre des TaRaBaTeS : http://www.tarabates.com, depuis je suis repassé à swfObject, et il est réapparu chez google.

    La méthode Satay, j'ai eu testé. Je ne sais plus pourquoi je n'ai pas conservé.

    La méthode UFO est très bien, je l'ai utilisée sur plusieurs sites, mais elle est maintenant dépréciée, on lui préfère désormais swfObject. De plus, UFO ne permettait pas le fullscreen (ou alors c'est moi qui n'ai pas réussi à le mettre en place ;))

    Reste le souci de référencer correctement un site fullflash avec une page unique (et des moviecliploader pour les pages). Si quelqu'un a des pistes, je suis preneur :)

  • Toto a dit le

    Bonjour,

    Pour revenir aux exemples laissés par carredas.biz, il s'agit toujours de substituer l'animation flash par du
    contenu html standard lorsque javascript n'est pas activé sur le navigateur.

    On en revient donc à dire qu'un site full flash ne peut-être correctement référencé sans utiliser le bon vieux html.

    Voila voila.

    A+

  • nesk a dit le

    Les liens Flash sont-ils aussi bien repérés par GG lorsqu'ils sont dans une animation flash que lorsqu'ils sont dans le HTML ? Pas si sûr...

  • zigge a dit le

    Quid pour mon site qui est un fichier .swf unique et PAS possible de le reproduire en mode html car j'ai besoin du module flash pour le faire tourner. Car mon site est une visite virtuelle en tant que telle. merci

  • Brahim Fekhart a dit le

    Je suis d'accord avec Olivier Duffez, un site partiellement en flash ne pose aucun problème ni sur la validation w3c ni pour le référencement.
    Je vous laisse en juger vous même sur le site http://www.imageenmarche.fr par exemple.

  • Baresi a dit le

    Problème Flash Player

    Bonjour tout le monde,
    J'essaie d acceder a un site qui necessite Flashplayer (ce dernier est installé sur mon PC, version 10), j'utilise un pc sous XP V2002 SP3. Mais quand j'arrive à la page necessitant Flash Player , celle ci ne s'affiche pas et en bas de la page, il y a ecrit "terminé" avec un point d exclamation, quand je clique dessus, j'obtiens cela :

    Ligne : 165
    Car : 1
    Erreur : swfobject est indefini
    URL :

    Je vous remercie par avance pour votre aide.

  • e-Rom a dit le

    Bonjour.

    Merci pour cet article très pratique. J'aurais juste une petite question : après avoir ajouter les balises qu'il faut pour référencer le contenu déclaré en flash, comment vérifier que ce contenu est bien pris en compte par les moteurs ?

    Question annexe, si je dois déclarer un titre sur un lien, vaut-il mieux déclarer le titre dans le lien ou le lien dans le titre ?

    Merci par avance.

    Bien cordialement.

  • Olivier Duffez a dit le

    Pour voir quel contenu est vu par le moteur, il suffit de regarder la version en cache, "texte seul".

    L'attribut title d'un lien (qui permet d'afficher un texte dans une info-bulle) n'est pas pris en compte par Google. On peut malgré tout en mettre si ça aide l'internaute.

  • e-Rom a dit le

    Désolé je n'arrive pas a retranscrire en code ce que je veux dire sans que le code ne soit interprété.

    Vaut il mieux que la balise "a href" soit entre les balise "h1", ou que la balise "h1" soit entre les balises "a href" ?

  • Olivier Duffez a dit le

    une balise h1 est de type bloc, alors que la balise a est de type inline, donc c'est + logique de mettre la balise a à l'intérieur de la balise h1
    mais c'est assez rare qu'on ait besoin de faire un lien sur un titre de niveau 1... ça pointe vers la page elle-même ou vers une autre ?

  • e-Rom a dit le

    C'est un lien qui pointe vers la page elle même (HP).
    Le logo de l'entreprise joue à la fois le rôle de lien permanent vers la HP, mais aussi le rôle de "titre ", seulement sur la HP cette fois (impossible de déclarer un visuel sur la page autrement qu'en le cachant derrière le logo).

    Ceci dit, ce h1 reprend l'intitulé de l'image...

    Merci pour ces réponses en tout cas :)

  • samsam09 a dit le

    Hello tous le monde,

    Je viens de finaliser un site entièrement fait en flash sous wix.
    J’obtiens un très bon score dans la certification seo et je suis en première position pour tous mes mots clés. et cela depuis 3 mois déjà.
    je vous laisse le soin de visiter le site car ça donne un bon exemple pour le référencement sous flash.
    J'attend vos critiques avec impatiente.
    sam de Genève

  • Philippe SEBAGH a dit le

    En analysant quelques sites en Flash, je remarque une div nommée "flashcontent" dans laquelle il y a un descriptif assez détaillé avec mots clés, balises h1, h2... ce qui fait qu'il y a du contenu accessible pour les moteurs de recherche mais pas visible pour les interbautes.

    Est ce que cette solution est correcte et accepté pour tous les moteus ?

    Merci

  • Olivier Duffez a dit le

    Tant que ce contenu reflète celui du Flash, ça ne pose pas de pb.

  • Philippe SEBAGH a dit le

    Beaucoup de site en flash indique un descriptif qui ne reflète pas du tout celui du flash. Comment Google par exemple fait il la différence ?

Postez un commentaire !

Les champs marqués du signe * sont obligatoires. L'adresse email ne sera pas affichée.

En postant un commentaire, vous acceptez les CGU du site WebRankInfo.

Annonces Google

Catégories des dossiers

Consultez les dossiers par thématiques :

Annonces Google

Formation référencement et webmarketing

Venez chez Ranking Metrics vous former au référencement, à Google AdWords et Analytics ainsi qu'aux réseaux sociaux ! Plus de 4000 entreprises sont déjà venues (Dossier possible OPCA, DIF...).

Préparés et animés par Olivier Duffez (WebRankInfo) et Fabien Faceries (AgentWebRanking), 2 professionnels reconnus dans le domaine, nos modules sur le référencement naturel sont très complets tout en laissant une grande place à l'interactivité pour répondre à toutes les questions des participants.

Pour connaître le plan détaillé de chaque module, le prix, les dates et les lieux, consultez le site de Ranking Metrics (organisme de formation).

Hébergement web

Hébergement web mutualisé et dédié

Pour un bon référencement, il faut un bon hébergeur. Testez Sivit by Nerim, l'hébergeur choisi par Olivier Duffez pour son site WebRankInfo.

A partir de 3€ HT/mois.