Je suis parfois confronté et j’observe nettement la tendance d’utilisation du parallaxe pour le design d’un site Web.

Ayant vu le succès de mon tweet de la source originale en anglais et pour répondre à la demande de ceux qui voudraient que je recommence à traduire des articles de fond issus de ma veille, voici une traduction autorisée sur le sujet du Parallaxe vs. SEO.

Je laisse donc la parole à Steve Morgan (Twitter @steviephil – Site Pro MorganOnlineMarketing), qui nous fait une démonstration limpide via le blog SEMrush (article source en anglais).

En tant que webmarketeurs, nous savons tous que le meilleur moment pour optimiser le SEO sur un nouveau site ou lors d’une refonte est en amont, afin d’intégrer directement les bases. Cependant, il arrive que le SEO soit la dernière considération du webmaster (habituellement lorsqu’il s’aperçoit que le site ne se positionne pas).
Récemment, plusieurs personnes utilisant l’effet de parallaxe sur leur site sont venues me voir en me demandant si je pouvais faire quelque chose pour eux en terme de référencement. C’est un vrai problème parce que même si les sites qui utilisent l’effet parallaxe sont jolis et agréable à consulter, ils ont de grosses déficiences techniques niveau SEO.
Dans ce billet, je vais vous parler des dangers de la conception de sites utilisant le parallaxe : leur effet sur le SEO, les raisons pour lesquelles il ne sont pas SEO-friendly et quelles sont les solutions pour contourner le problème et avoir votre part du gâteau.

L’effet parallaxe, c’est quoi ?

Avant tout, une explication : il est probable que vous soyez déjà familier avec le style de sites utilisant l’effet parallaxe sans le savoir, parce que vous ne connaissiez pas le nom.

L’effet parallaxe se concentre sur le défilement de la page (scroll) plutôt que sur les pages dédiées. Ainsi, sur la page d’accueil d’un site utilisant l’effet parallaxe, si vous cliquez sur « A propos » dans le Top Menu par exemple, au lieu d’être redirigé vers « monsite.com/a-propos » vous serez automatiquement redirigé vers la section « à propos » sur la même page (monsite.com#a-propos).

Exemple  :

 

Exemple – scytale.pt, GIF créé avec Gyazo

…Mais les sites sont-ils vraiment « Parallaxe » ?
Et bien… Certaines personnes soutiennent que le nom de « Parallaxe » n’est pas adéquat. Ce billet de Rob Palmer explique pourquoi, mais les sites qu’il donne pour exemple ne sont pas vraiment conçus avec cet effet. Sachant que beaucoup de personnes se réfèrent déjà à ces sites-là, je vais continuer avec eux pour une question de constance et de cohérence, même si ce n’est pas exactement juste.

Pourquoi l’effet parallaxe est mauvais pour le SEO ?

Alors que les sites utilisant l’effet parallaxe sont tops visuellement, ils peuvent être un obstacle majeur au positionnement de votre site sur les moteurs de recherches, tant et si bien que je recommande souvent à mes clients de ne carrément pas utiliser cette méthode.

Les sites utilisant l’effet parallaxe sont hostiles au SEO parce que le scroll infini évince la nécessité des pages supplémentaires au profit de pages plus longues, dans l’optique de ranker sur plus de mots-clés et de requêtes.

Pour vous donner un exemple, voici une structure d’URL pour un site imaginaire. Ce serait un site de vente et de mise à jour de machin.

Avec site utilisant l’effet parallaxe :

• com
• com#acheter-machins
• com#reparation-machin
• com#contact

Mais voici ce à quoi la structure d’URL devrait ressembler si elle était divisée en pages individuelles:

• com
• com/acheter-machins
• com/reparation-machin
• com/contact

Dans le premier exemple, les moteurs de recherche vont indexer la homepage mais pas les trois autres URL, parce que les moteurs de recherche indexent des pages individuelles et pas les pages fragmentées (le dièse dans l’URL sert de raccourci pour accéder à un autre élément sur la même page).

Dans le second exemple, les moteurs de recherche seront en mesure d’indexer les quatre pages séparément. Cela ajoutera de la visibilité dans les moteurs et le contenu présent sur chaque page pourra mieux se positionner dans les moteurs de recherche.

C’est important parce que si le site voulait se positionner sur « Réparation machin » par exemple, il y a plus de chance qu’il soit bien référencé si l’URL est monsite.com/reparation-machin plutôt que monsite.com#reparation-machin (et donc une partie de la page d’accueil de monsite.com)

Une page dédiée à la Réparation de Machins sera capable de se concentrer sur un mot-clé choisi, par exemple, l’expression-clé « réparation de machin» peut apparaître sur le titre de la page, les metadonnées, la balise H2 et autres balises de titre, etc…

En version parallaxe, la page de réparation de machin aura plus de mal à se positionner sur cette expression-clé car le titre et le contenu de la page sont généraux. Il est donc possible que l’expression « réparation de machin » n’apparaissent que sur une toute petite section de la page entière.

Et si le SEO n’était pas non plus la clé de la réussite ?
Quoi qu’il en soit, la conception de site avec l’effet parallaxe ne peut qu’être faite au cas par cas. Il est facile pour nous, SEOs, de penser que les sites qui utilisent l’effet parallaxe sont l’œuvre du Diable simplement parce qu’ils ne sont pas SEO-friendly.
Mais après tout, il y a plus important dans la vie (et dans le marketing en ligne) que le SEO.
Par exemple, dans une boîte où le SEO n’est pas vital (un produit ou service pas spécialement recherché et qui trouve ses acheteurs via d’autres canaux, par exemple les réseaux sociaux) mais où le client serait susceptible d’être intéressé voire impressionné par le design d’un site utilisant l’effet parallaxe, et bien, il ne faut pas chercher plus loin et lui faire son site avec l’effet parallaxe.
Ironiquement, dans ce cas, il est possible que même si le site n’est pas positionné dans les moteurs, il retourne un taux de conversion plus élevé grâce au design attractif du site et des clients redirigés via les réseaux sociaux.
Le référencement sur les moteurs de recherche d’un site utilisant l’effet parallaxe dépend également de la compétitivité de votre secteur d’activité. Par exemple, si vous êtes dans une niche avec très peu de concurrents, il se peut très bien que votre site soit parfaitement positionné malgré que votre vous l’ayez conçu avec l’effet parallaxe.
Par contre, si votre secteur d’activité est concurrentiel, les moteurs de recherche sont automatiquement concernés et l’effet parallaxe peut empêcher votre site de bien se positionner sur le long terme. Il est donc préférable de choisir une autre façon de monter votre site.
Mais peu importe, étant du côté « sécurité » et connaissant l’importance du SEO dans n’importe quel secteur, je suis sûr que dans 99% des cas, il est préférable de ne pas utiliser l’effet parallaxe.
Vous pourriez avoir les deux, le design et le référencement, mais…

Pouvons-nous profiter des bénéfices du SEO et de l’effet parallaxe ?

Il y a bien une solution « détournée » pour construire un site « Parallaxe SEO-friendly », en utilisant efficacement les deux éléments, mais là encore, il faut en prendre et en laisser.

La page d’accueil peut être conservée comme « index » pour chaque section en gardant l’effet parallaxe pendant que chaque section possède sa page dédiée (à des fins de SEO).
Par exemple, cliquer sur « Réparation machin » depuis la page d’accueil vous enverra vers la section « Réparation machin» de la page d’accueil (monsite.com#reparation- machin). Cette section pourrait simplement être une zone d’introduction du service proposé avec une courte description et un simple bouton « en savoir plus » qui renverrai sur la page dédiée à la Réparation de machin s(monsite.com/reparation- machin).
Cette procédure peut être appliquée pour chaque section du site.

Toutefois, si vous optez pour cette solution, il y a quelques petites choses à prendre en considération :

• Le site n’aurait l’effet parallaxe que sur certaines parties, les pages dédiées n’utiliseraient donc pas ce design. Cela pourrait porter à confusion pour les utilisateurs navigants entre les différentes sections et surtout s’ils passent d’une section parallaxe à une page dédiée. Cette formule peut rebuter les visiteurs et donc affecter négativement le taux de conversion,
• Cette formule est également susceptible d’affecter la façon de fonctionner du Top Menu. En cliquant sur l’une des sections, l’utilisateur sera t-il redirigé sur une section de la page d’accueil (monsite.com#reparation- machin) ou directement sur sa page dédiée (monsite.com/reparation- machin) ?
• Je vous recommande également de prendre tout le temps nécessaire afin de vous assurer que le contenu d’introduction sur la page d’accueil n’est pas copié sur la page dédiée. Si non vous pouvez vous faire avoir par la patrouille Google pour « contenu dupliqué ». Par exemple pour « Réparation machin », je préconise que le paragraphe d’introduction sur la page d’accueil soit complètement différent de celui sur la page dédiée. Ne vous contentez pas d’un copier/coller du même texte sur les deux pages. En fait, le texte d’intro devrait être un court résumé de la page dédiée. Je suis sûr que c’est que ce que vous alliez faire mais il est toujours bon de le rappeler.

Quel est votre avis sur la conception de sites utilisant l’effet parallaxe ? Pensez-vous que d’autres domaines devraient être pris en considération en plus du SEO ou du ROI ?

J’attends vos réactions sur twitter : #ParallaxVsSeo

[NDLR]

Comme il nous manque un peu finalement, je rajoute la vidéo de Matt Cutts proposée dans un commentaire du billet original.

EDIT

Suite à certaines remarques, je tiens à préciser un point particulier.

C’est vrai que le parallaxe n’est pas obligatoirement du one page, mais nous sommes bien obligés d’admettre que tous les sites utilisant parallaxe sont en one page.