Comment créer une parfaite landing page ?

Rédigé par Alexis Anzieu, étudiant à Dauphine, 22 ans.


Nombreux sont les articles traitant du sujet, néanmoins si vous êtes ici c’est que vous espérez en apprendre encore davantage. Futur entrepreneur ? Membre d’une association ? Simple curieux ? Je vais essayer de capitaliser ici toutes les connaissances que j’ai pu assimiler sur cette pratique. L’objectif ultime étant de convaincre les internautes d’acheter votre produit et/ou d’adhérer à vos idées.




Tout d’abord, qu’est-ce qu’une landing page ?



Derrière cette expression marketing ne se cache ni plus ni moins qu’un site web. Mais alors pourquoi attribuer un nom si spécifique à une pratique si générique ? Faisons un test avec les trois images suivantes : essayez de déterminer lesquelles ou non sont des captures d’écran de landing page.



landing page

Fnac



landing page

Médecins du Monde



landing page

Apple

Si vous avez en tête la seconde et la troisième capture alors félicitations. Nous allons tout de suite les décomposer afin que vous en compreniez l’engrenage.


55% des internautes restent moins de 15 secondes


Tout part de cette problématique. Dans ce monde hyper-actif, la plupart des gens n’ont pas plus de 15 secondes à perdre sur un site qu’ils visitent. C’est donc le temps que vous avez pour convaincre d’acheter votre produit. C’est court, très court. Il faut donc immédiatement attirer l’attention en enlevant tout le superflu. Débutons donc la création de notre landing page par une page blanche.


Gutenberg rules


Depuis votre plus jeune âge (et si vous habitez dans le monde occidental) votre regard sur un texte se porte implicitement à gauche afin que vous puissiez commencer à le lire. Il en va de même sur une page web.



landing page

Heatmap d’une recherche web



Cette heatmap compile les positions du regard de l’internaute sur une page web. On se rend très bien compte que la position la plus importante se situe en haut à gauche de l’écran. Et là, jubilation, vous vous rendez-compte que c’est exactement l’emplacement du logo d’environs 99% des sites web. C’est en effet la première étape d’une landing page : créer une association implicite entre un produit et un logo. Je ne vais pas décrire les actions psychologiques sur la vision à postérieur du même logo, mais si l’internaute ne restait que 2 secondes sur le site, la simple vision du logo serait déjà une avancée de conversion majeure dans le plausible achat du produit.


Une image (de qualité)


Le proverbe “une image vaut mieux qu’un long discours” est de rigueur, d’autant plus qu’ici cela permet de gagner en rapidité (souvenez-vous des 15 secondes !). Mettez donc une image en fond qui lui permette de connaître l’objectif de votre site dès le premier coup d’œil* Faîtes en sorte de trouver l’équilibre parfait entre qualité et poids de cette dernière. Si vous avez une magnifique photo reflex en 4K cela en mettra plein les yeux mais aussi plein la connexion internet qui ne suivra peut-être pas. Enfin, n’oubliez pas d’écrire une phrase d’accroche, un slogan par dessus, en contraste avec les couleurs de la photo.



landing page

Exemple fictif d’un contraste raté de slogan



landing page

Exemple réel d’un contraste de slogan réussi ainsi que d’une image adéquate



Vos internautes ont maintenant repéré votre logo et le produit que vous essayez de lui vendre. Mais en comparaison du lèche vitrine aux galeries Lafayette, il reste cependant un problème. C’est aisé d’ouvrir la porte d’une boutique, néanmoins pour un concept complètement dématérialisé comment s’y prendre ?


Le bouton d’action (en anglais, Call To Action, ou CTA)


Sur ces derniers exemples, vous avez certainement remarqué une chose : l’existence d’un bouton, placé généralement en plein centre de la page. Il s’agit de la porte d’entrée de votre landing page. Derrière ce dernier se cache généralement une inscription à une newletter, à un panier d’achat, à un téléchargement d’une version test, etc… Votre mission est de tout faire en sorte pour que l’internaute clique sur ce bouton.

Donnez-lui une couleur jaune fluo sur fond noir ou une taille gigantesque si vous le souhaitez, mais faîtes le cliquer dessus. Cela va s’en dire que l’internaute doit l’apercevoir directement sans nécessairement scroller la page ni cliquer sur un autre onglet pour le voir apparaître. Retenez cette phrase biblique :

“A chaque fois que vous envoyez un internaute sur une nouvelle page, c’est pour lui une opportunité de quitter le site. Limitez ces opportunités en le convertissant simplement et le plus rapidement possible.”



landing page


A/x testing


On est souvent amené à parler d’A/B testing, qui consiste à diffuser deux versions très très proches (en général il s’agit de la couleur d’un bouton, de la taille d’un élément ou d’un regard sur une image) d’un même site et observer lequel ramène le plus gros taux de conversion. Celui qui l’emporte subira alors à son tour un A/B testing avec une autre version, etc… (coucou Darwin). Mais ce n’est pas le seul test à entreprendre.

Afin de vérifier la véracité de l’A/B testing, il est aussi bon de faire de l’A/A testing. Et si l’on débute on que l’on manque de temps, privilégier l’A/Z testing (comprendre par là tester deux versions peu semblables d’un même site afin de trouver ses premières marques). Pour ce faire, plusieurs outils sont à votre disposition : Hotjar, ClickHeat ou même Analytics.


STOP Wix & Wordpress


Comme suggéré auparavant, il faut que votre landing page soit la plus légère possible. Pour cela, il faut absolument éviter le code non nécessaire qui alourdit la connexion internet et met plusieurs secondes à charger (qui aurait pu être utilisées afin de convertir votre internaute).



landing page


Les technologies comme Wix, Wordpress & Co sont très pratiques à déployer ou à maintenir mais ce n’est pas ainsi que vous convaincrez le maximum d’internautes. Laissez donc cela de côté, apprenez quelques lignes de codes rudimentaires ou demandez à une connaissance ayant quelques notions informatique, et lancez-vous dans l’aventure avec ces petits squelettes gratuit de site que je vous ai déniché !



Chez Crème de la Crème, nous avons des centaines d’étudiants freelances experts qui peuvent vous créer votre site web et optimiser votre landing page.

Accédez à 5 profils dès maintenant !




Pour résumer



1. Un beau logo en haut à gauche
2. Une image de qualité en fond
3. Pas plus de 3 lignes vendant le produit
4. Un gros bouton scintillant au centre
5. Et quelques tests sur chacun de ces éléments pendant quelques mois !





Rédigé par Alexis Anzieu
alexis.anzieu@gmail.com
Follow me on Medium Crème de la Crème & Linkedin