Optimisez vos landing pages pour tirer le meilleur de vos campagnes d’acquisition

Web Island 2018, le 21/04/2018, à Nantes

Pendant ce talk de 45 minutes, j'ai essayé d'apporter des clés de réflexion sur les bonnes pratiques visant à établir une landing page performante.

Au fil de mes expériences dans le domaine du webmarketing (auquel il est important pour tout développeur de se frotter), j'ai fait le triste constat que souvent, les campagnes d'acquisition de trafic (display, social ads, emailings...) sont shootées sur la page d'accueil d'un site, sans véritable réflexion en amont sur la conversion des prospects. Le taux de transformation est alors un metrics subi plutôt que maîtrisé, et les campagnes performent en dessous de leur plein potentiel.

Au vu de mon profil, le véritable enjeu pour moi était d'arriver à traduire ma vision en termes simples et compréhensibles, sans s'embourber dans le code et les détails techniques.

Les slides commentées

Résumé de la conférence

Pourquoi une Landing Page ?
Il y a autant d’actions possibles sur votre site web que d’étoiles dans le ciel. Perdu dans les liens, images et boutons, le visiteur passe par un Temps d’apprentissage sur chaque nouveau site visité. Un internaute consacre 30 secondes maximum par page, souvent beaucoup moins. La Landing Page doit permettre de zapper le temps d’apprentissage en poussant l’internaute à l’action, très vite !

Qu’est-ce qu’une Landing Page ?
Si vous avez regardé la lune, on est sur le bon chemin. La landing page doit être conçue pour focaliser l’attention sur un point précis. C’est un type de page spécifique, où vous inviterez l’internaute à faire une action. L’internaute est paresseux. Vous aimez votre entreprise/site/produit (et c’est très bien), mais la triste réalité est que votre prospect, lui, n’en a rien à faire et ne vous consacrera que très peu de temps, d’attention et d’effort. Il faut prendre ce fait en compte pour réussir sa landing page.

Les ingrédients pour une Landing Page réussie
Trois ingrédients : un message clair et sans détour, une action simple et rapide à effectuer, et un call-to-action évident

Un mot d’ordre : Droit au but !
Soyez cash, n’ayez pas peur de « choquer ». L’accroche doit définir, en une phrase courte et percutante, le service que vous offrez et son bénéfice pour l’internaute. « Les meilleurs chocolats de France, livrés chez vous dès demain »

Vous parlez à des HUMAINS !!!
Adressez-vous à vos prospects en direct, prenez-les à partie. « Faites ceci » au lieu de « faire ceci », « votre compte » au lieu de « un compte ». Faites des phrases courtes. Mettez en avant les avantages pour l’internaute de votre produit : sans vous ruiner, gagnez du temps, ...

Minimisez l’effort
Ne demandez aucune donnée qui ne vous serait pas immédiatement utile. Au lieu de faire remplir un profil qualifié complet, ne demandez qu’un email : laissez l’internaute entrer rapidement dans votre process, puis relancez-le pour les informations qu’il vous manque. Réduisez la friction au strict minimum, utilisez pour cela des boutons de « social login » si adaptés à votre cible (Facebook ou Twitter pour le « grand public », LinkedIn ou GooglePlus pour le B2B, ...)

Le Call-to-Action
Le Call-to-Action doit être immédiatement visible et identifiable au premier coup d’oeil. On appelle ça l’appétence : un bouton doit avoir « une tête de bouton ». Même mon GRAND-PÈRE doit comprendre qu’il peut cliquer dessus ! Utilisez une couleur tranchée, dédie au CTA. Make it bigger !!! UN SEUL call-to-action par page : On ne doit surtout pas créer de situation de CHOIX. Décrivez l’action, oubliez les « cliquer ici ». Mettez en avant un avantage : « me tenir informé de ... », « recevoir gratuitement ... »

La Landing est la première étape du Tunnel de Conversion
On doit tenir l’internaute captif - Pas de menus de navigation - Pas de liens sortants - Pas de pubs !!! - Pas de choix à rallonge Le visiteur n'a que deux options : convertir ou partir. N’ayez pas honte d’être pressants : vous venez de PAYER pour que l’internaute vous voie, c’est le moment où jamais de rentabiliser ce clic acheté.

Inspirer confiance
Comme sur un e-commerce, mettez en avant vos élements de réassurance - en cas de paiement sécurisé : logo cb/banque - awards - avis/témoignages clients - numéro de téléphone – ça convertit ultra bien avec les senior - partenaires reconnus (livraison…) - ils attestent de votre sérieux

Principe de Réciprocité
Cherchez « Principe de réciprocité », Robert Cialdini. Les Krishna offraient des fleurs en papier aux passants avant de leur demander un don, grosse augmentation de la fréquence ET du montant des dons. Rédigez un ebook et « offrez-le » en échange d’une adresse email ! « Offrez » un accès VIP à votre service (payant). Ca peut être une démo gratuite, une version d’essai. Pensez à VentePrivée : vous vous sentez laissés pour compte jusqu’à ce que vous ayez – ENFIN ! - créé votre compte.

Temps de chargement
L’internaute est pressé. Diminuez l’attente due à vos temps de chargement. C’est d’autant plus obligatoire qu’une bonne partie de votre trafic arrivera en mobilité (tablette, téléphone...), en 4G ou pire. Vous ne convertirez personne sur une page qui met 10 secondes à charger. Chez Amazon = -1 % pour chaque 100 ms de temps de chargement supplémentaire Compressez les images, qui sont souvent l’élément le plus lourd Minifiez votre code source, vos feuilles de styles, vos scripts. Ne chargez pas de scripts inutiles. Utilisez des caches (base de données, navigateur, etc)
Google PageSpeed, outil gratuit, vous aide à comprendre ce qui ralentit votre page. Plus complet, GT Metrics aggège les rapports de plusieurs outils. On remarque que leurs pages sont conçues comme des landings, avec un gros CTA bien visible. Votre homepage peut être une sorte de landing page aussi !
Des algorithmes permettent de compresser vos images sans perte de qualité (« lossless ») En ligne de commande : - optipng - jpgoptim En SaaS : - compressor.io - imagify.io (cocorico)

Suivez vos KPI
Définissez vos objectifs. Suivez, au grand minimum, le taux de conversion : nombre de conversions pour 100 visites (donc, suivre nombre de visite et conversions). Ça peut se mettre en place en dix minutes chrono dans Google Analytics.
Pour aller plus loin, Hotjar vous permet de visualiser (en vidéo) la session de navigation de chacun des internautes qui passe sur votre page. Ca permet de VOIR ce qui bloque ! CrazyEgg permet aussi de créer une heatmap visuelle de votre site, qui montre quels sont les zones chaudes qui attirent l’attention.

A/B testing
Faites de l’A/B testing : proposez plusieurs versions de votre page et déterminez laquelle performe le mieux.
Le plus simple est de ne changer qu’un élément à la fois (par exemple la couleur du CTA) : il est plus facile de comparer que de classer ! Réitérez les tests souvent : après avoir changé la couleur, changez le message, puis la position. Faites autant de permutations que possible. Attention à proposer chaque version à un échantillon suffisamment grand. Après 10 visites et 3 conversions, on ne peut pas dire qu’une version est deux fois plus efficace que l’autre.

Multipliez les landing pages
Comme les huîtres, les landing pages ne peuvent pas plaire à tout le monde. Définissez des persona, au moins une par scénario d’utilisation (ex chez Soumettre.fr : «webmaster indépendant », « propriétaire d’un e-commerce » et « agence de référencement » seront trois persona distinctes, et on ne peut pas s’adresser aux trois typologies de la même manière)
Soyez créatifs et cet exercice deviendra très agréable, surtout en équipe
Mettez en place au moins une landing pour chaque persona. N’oubliez pas de mettre en avant SES avantages particuliers !
ex Soumettre.fr : « en maîtrisant votre budget » pour les indépendants, « en toute autonomie » pour les e-commerce, « sans perdre de temps » pour les agences SEO
Accessibilité
Attention à ne perdre personne en route. L’accessibilité est TOUJOURS importante, mais encore plus lorsque vous payez du trafic et que vous cherchez à le convertir. Les daltoniens, par exemple, représentent 4 % de la population totale et 8 % des hommes. Demandez autour de vous, vous serez surpris de voir à quel point c’est répandu ! Attention aux contrastes, choisissez des couleurs adaptées. Dans Photoshop : « Épreuvage des couleurs » pour « Dyschromatopsie » permet d’avoir un aperçu.
Besoin de mes services ?
Didier Sampaolo, Consultant technique senior
Didier Sampaolo
didier@lvlup.fr