• Larissa Mouton

Préparation d'une landingpage: Étapes, astuces et conseils de pro

Pour te donner les meilleurs conseils possibles pour concevoir une page d'atterrissage, nous nous sommes longuement entretenus avec l'experte en design Larissa, chef d'équipe au Studio Marketing de Mylogo.lu. Elle travaille en tant que designer professionnelle depuis 2010 et supervise la conception des posts sur les médias sociaux, des bannières et des pages de destination de Mylogo.lu.

Premières étapes de la conception d'une landingpage

Avant de commencer la conception de ta landingpage, assure-toi d'avoir rassemblé toutes les informations dont tu as besoin pour créer la page. Cela comprend :

Ton message et ton objectif

Le marché cible désigné

Un CTA unique et mesurable

Le contenu complet de la page

Logo

Couleurs et polices exactes de la marque ou de l'entreprise, le cas échéant

Une fois que tu as tous ces éléments, Larissa recommande de commencer le processus de conception en choisissant une image unique et étonnante pour le pli le plus haut de la page. Connu sous le nom d'en-tête, ce pli est la première chose que tes visiteurs verront sur la page. Comme les visiteurs passent très peu de temps sur une landingpage, tu dois capter leur attention dès le premier coup d'œil !

Conseil :

"Cherche un visuel qui exprime l'objectif clé de la page de destination de la façon la plus simple et la plus belle, et d'une manière qui donnera envie au visiteur de rester sur la page et de continuer à la faire défiler."

Organise la mise en page de ta landingpage

Ta landingpage sera divisée en plusieurs plis ou sections horizontales. Le pli supérieur est appelé "en-tête" et le dernier pli est appelé "pied de page". Il n'y a pas de règle d'or concernant le nombre de plis que ta landingpage doit avoir. En bref, cela dépend de la quantité d'informations que tu veux partager avec tes visiteurs. Une page plus longue avec de nombreux plis te permettra de raconter une histoire captivante, mais tu risques de perdre des lecteurs si tu as trop d'informations.

Chaque pli de la page doit comprendre un texte bref (environ 20-30 mots), un élément visuel fort, un CTA et un bouton cliquable. Choisis pour chaque pli une image (ou une vidéo) qui soutient et aide à expliquer le texte correspondant.


Si tu as un formulaire à inclure sur ta landingpage, place-le suffisamment haut sur la page pour que les utilisateurs ne le manquent pas, mais pas dans le premier pli. Tu dois "vendre" ton message avant de demander aux visiteurs de te donner quelque chose en retour en remplissant le formulaire. Si ton entreprise a un emplacement physique, tu peux aider les visiteurs à te trouver en plaçant tes coordonnées ou un plan dans le pied de page.


Le très important en-tête

Ton en-tête est de loin la partie la plus importante de ta landingpage. C'est la première chose que tes visiteurs verront et elle déterminera à elle seule s'ils resteront dans les parages ou non. Les utilisateurs doivent immédiatement comprendre ce que tu leur proposes et comment ils vont en bénéficier.


Le texte de ton titre doit être simple, convaincant et bref. Larissa suggère de le limiter à 11 mots ou moins. Ton image doit présenter clairement ton produit ou service. Chez Mylogo.lu, nous utilisons une image d'en-tête qui présente un site Web ou quelqu'un qui construit un site Web.


Ton titre, ton CTA et un bouton cliquable doivent être visibles au-dessus du pli pour que les visiteurs n'aient pas à faire défiler le texte pour commencer, quel que soit l'appareil qu'ils utilisent. Larissa recommande que ton premier pli ait une hauteur de 650 pixels. Veille toujours à ce que le bouton cliquable soit bien visible sur la page, au-dessus du pli et dans une couleur qui le fait ressortir du fond.


Choisir des images

Une page de destination réussie s'appuie sur des éléments visuels forts pour délivrer son message. Les images peuvent transmettre le sens, l'émotion et l'image de marque bien plus rapidement que le texte et lorsqu'il s'agit de pages de renvoi, tu n'as que quelques secondes pour attirer l'attention de ton visiteur.


Pour engager les visiteurs, essaie de trouver une image qui raconte une histoire et se connecte au texte. Comme le dit Larissa, "Ton visuel doit soutenir ton texte et ton texte doit soutenir ton visuel. Ils travaillent ensemble." Si tu utilises la photo d'une personne, choisis une photo où la personne a l'air accueillante, amicale et authentique. Choisis des photos réelles plutôt que des photos d'archives dans la mesure du possible !


Lorsque tu choisis des images pour ta landingpage, cherche l'inspiration dans ton domaine et sur le Web. Larissa recommande de jeter un coup d'œil à tes concurrents ainsi qu'aux sites d'inspiration de design comme Dribble, Behance, Pinterest, siteInspire. Tu trouveras une liste de sites d'inspiration à la fin de cet ebook.


N'oublie pas d'utiliser des images qui sont en accord avec l'image de marque globale de ton entreprise. Reste à l'affût des tendances actuelles en matière de conception de sites Web pour t'assurer que tu choisis des images fraîches et actuelles, car "même les personnes qui ne sont pas douées pour la conception ou la technologie reconnaîtront instinctivement un site qui est dépassé." Quant à trouver la bonne image pour ton en-tête, Larissa dit qu'il faut se fier un peu à son instinct. "Quand je trouve la bonne image, je le sais tout de suite".

Conseil :

"Je ne ferai jamais de compromis sur l'apparence du visuel. Si une image semble un tant soit peu dépassée, je ne l'utiliserai jamais."

Trouver des polices de caractères

Tout comme tu veux que ton image transmette instantanément un message, tes mots soigneusement choisis doivent être immédiatement accessibles aux visiteurs. N'utilise que des polices faciles à lire sur ta page de destination et évite les polices cursive fantaisistes ou les lettres à bulles artistiques. Tu veux aussi être cohérent avec tes polices. Choisis des polices qui correspondent à ton image de marque, ton site Web et tes autres supports marketing et n'utilise jamais plus de 2 ou 3 polices sur une landingpage.


Conseil :

"Quand il s'agit de choisir une police, le plus important est qu'elle soit facile à lire.“


Choisir des couleurs

Lorsqu'il s'agit de couleurs, tu dois aussi garder ton image de marque à l'esprit. Assortis ton logo et ton site Web si tu en as un. Si tu pars de zéro, utilise des couleurs qui sont vives et qui transmettent le sentiment de ton entreprise. Travaille avec des couleurs contrastées pour que les éléments importants comme ton CTA et ton bouton ressortent bien. Par exemple, si ton image principale a un fond bleu, essaie d'ajouter un bouton qui est orange.


Rédige le contenu en tenant compte du design

Les concepteurs aiment généralement réduire le contenu au minimum et la vérité est que c'est un conseil judicieux lorsqu'il s'agit de ta landingpage. Même si tu as besoin de suffisamment de contenu pour expliquer aux utilisateurs ce que tu proposes exactement et comment ils peuvent en bénéficier, tu ne veux pas entrer dans les détails sur une landingpage typique.


Essaie d'être objectif et concentre-toi sur ce que tu veux vraiment dire. Le plus important est que le message de ta landingpage soit immédiatement clair. Tu peux te déchaîner avec le design, mais même si le design est complexe, la page doit transmettre ton message rapidement et clairement.


Un en-tête typique devrait comprendre un titre de quelques mots seulement. N'utilise pas de mots difficiles à comprendre ou trop techniques. Essaie plutôt d'écrire de la même façon que tu parlerais à tes clients. Les plis suivants de ta landingpage doivent également comporter un bref titre et, si nécessaire, un court paragraphe explicatif de 30 mots maximum. Le texte doit être suivi d'un CTA et d'un bouton cliquable dans chaque pli.

Conseil :

"Moins c'est mieux quand il s'agit du texte".

Quelle doit être la longueur de ta landingpage ?

La longueur de ta page et le nombre de plis de ton design peuvent varier entre les différentes versions de ta landingpage. Réfléchis à la quantité d'informations que tu penses qu'il est important de fournir à ton utilisateur à ce stade, avant qu'il ait complété l'appel à l'action. D'autres informations peuvent toujours être données après, une fois que ton client potentiel s'est inscrit, a acheté ou t'a appelé.


La profondeur que tu choisis d'atteindre dépend aussi de ton marché cible. As-tu un public qui sera enclin à chercher des détails, à faire défiler la page et à lire plus de texte ? Ou tes utilisateurs réagiront-ils mieux si tu restes bref et simple ? Chaque mot, image et élément sur ton écran doit avoir une intention et doit d'une certaine manière servir à encourager l'utilisateur à faire ce que tu veux qu'il fasse.


La question essentielle à te poser est la suivante : Est-ce que le fait d'inclure ces informations sur ma landingpage m'aidera à atteindre mon objectif ?

Des astuces de conception pour t'aider à convertir

Lorsque tu conçois ta landingpage, il est utile de comprendre comment les yeux des visiteurs vont se déplacer sur ta page. De cette façon, tu peux organiser le texte et les images de manière à conduire naturellement le lecteur vers ton CTA et à l'inciter à cliquer !

Choisis un élément visuel principal qui à la fois soutient et attire l'attention sur ton texte. Par exemple, si ton image montre une personne dont les yeux regardent vers le texte de la page, un visiteur sera naturellement attiré par ce texte. Si tu places du texte au-dessus d'une image, assure-toi que la couleur de la police contraste bien avec l'arrière-plan ou qu'elle est posée sur une zone solide.


Une autre façon d'attirer l'attention sur ton CTA ou sur tout objet de ta page est d'organiser les objets autour de cet élément. Si tu veux attirer l'attention d'un visiteur vers le bas de la page et l'encourager à continuer à défiler, assure-toi de le taquiner en lui montrant un petit morceau du prochain pli. De cette façon, ils seront curieux de voir ce qu'il y a ensuite sur la page. Tu peux aussi placer une flèche les invitant à descendre plus bas sur la page. Avec Mylogo.lu, tu peux rendre les flèches cliquables en ajoutant une ancre. Lorsqu'un visiteur clique sur la flèche, il sera amené directement au pli suivant, sans avoir à faire défiler la page.


Conseil :

"Si je choisis une image de nature ou avec des montagnes, alors je mettrai généralement le texte dans le ciel, avec les sommets des montagnes pointant vers le texte. Je recommande de mettre le texte sur un fond solide pour qu'un visiteur n'ait aucun moyen de le manquer.“


Concevoir pour le mobile

Ta page de destination aura un aspect très différent sur les appareils mobiles que sur un ordinateur de bureau, alors assure-toi d'utiliser l'éditeur mobile Mylogo.lu pour optimiser la version mobile de ta page. Prends en compte le fait que les personnes utilisant leur téléphone ont une durée d'attention encore plus courte que les utilisateurs d'ordinateurs de bureau. Ton CTA et ton bouton doivent être à l'avant et au centre, visibles sans que ton visiteur ait besoin de faire défiler la page. Ici aussi, tu veux révéler une petite partie du pli suivant pour que l'utilisateur sache qu'il peut faire défiler la page pour en lire plus.

Quand il s'agit de design mobile, prends toujours en compte la largeur. Ton design ne peut pas faire plus de 320 pixels de large. N'oublie pas non plus que les objets et les éléments de la page sur un site mobile doivent être disposés verticalement, les uns au-dessus des autres. Si, par exemple, ta page de destination comporte une rangée horizontale d'icônes, elles doivent être disposées verticalement sur mobile. Sinon, elles seront trop petites pour être vues sur ton site mobile.


via GIPHY


Effectuer l'AQ avant de mettre en ligne

Une fois que tu as terminé ta landingpage et que tu as créé un design qui te semble à la fois époustouflant et clair, tu veux passer un peu de temps à faire du " AQ " ou Assurance Qualité. En d'autres termes, tu veux t'assurer que tu as mis tous les points sur les i et tous les points sur les t.

Vérifie l'aspect de ta landingpage sur une variété de tailles d'écran et d'appareils. Tu ne sais pas d'où viendront tes utilisateurs et tu veux t'assurer qu'ils seront impressionnés depuis n'importe quel appareil ! Ensuite, vérifie que tous les liens de ta landingpage fonctionnent. Si quelqu'un clique sur ton bouton CTA et que rien ne se passe, tu l'as perdu !

Créer plusieurs versions de ta landingpage

Pour optimiser tes chances de lancer une campagne réussie avec ta landingpage, tu voudras faire plusieurs versions de la page. Chaque version ne doit comporter qu'un seul changement qui, bien que souvent minime, peut avoir un impact très important sur les résultats.

Larissa recommande de faire les changements dans ton en-tête. Duplique ta landingpage, puis essaie de changer l'image principale ou d'utiliser un autre choix de formulation dans le titre principal. Plus tard, dans le chapitre intitulé "Mesurer les performances de ta page d'atterrissage", nous t'expliquerons comment tester ces différentes versions pour obtenir les meilleurs résultats.

Conseils supplémentaires

Prends le temps de regarder les sites Web et les pages d'atterrissage de tes concurrents. Trouve des idées sur ce qui est populaire en termes de taille de police, de taille de bouton et plus encore.

Assure-toi que ton site a l'air moderne. Si une page semble dépassée, les visiteurs s'éloigneront immédiatement. Les gens peuvent immédiatement identifier les sites Web qui ont l'air vieux et démodés.

Ne le prends pas personnellement si ta landingpage n'a pas de succès ! Parfois, tu crées une page qui est vraiment magnifique mais qui ne convertit pas bien. Tu peux toujours peaufiner ta page et réessayer !

7 vues0 commentaire

Blog