concevoir une landing page qui convertit
TRANSCRIPT
![Page 1: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/1.jpg)
AOÛT 2015 | SCANDOLAGENCY.CH
WINNER
Concevoir une page d’atterrissage qui convertitConseils et astuces pour une Landing Page efficace
![Page 2: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/2.jpg)
• Une page d’atterrissage (aussi appelée «Landing Page») est une page
conçue pour accueillir les visiteurs provenant d’une campagne
spécifique, en les incitant à effectuer une action.
• Acquisition de leads, vente d’un produit, (…), quelque soit l’objectif,
vous trouverez ci-après les règles de base pour une page d’atterrissage
cohérente et lisible.
Page d’atterrissage ... ?
2
![Page 3: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/3.jpg)
#1 Structure
![Page 4: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/4.jpg)
Tout contenu superflu est à proscrire.
longue accroche
texte condensébeaucoup de
champs demandés
![Page 5: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/5.jpg)
Eviter les points de fuite.
menu
liens sortants
![Page 6: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/6.jpg)
Structure simple & compréhensible.
![Page 7: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/7.jpg)
Responsive.
![Page 8: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/8.jpg)
Structure
8
• Une accroche principale : visible et percutante, avec une accroche
secondaire (complémentaire à la principale). Sont l’un des premiers
contenus à être vus.
• Accessibilité : la page doit être lisible, épurée, quelque soit le support
utilisé.
• Le contenu le plus important doit être au-dessus de la ligne de
flottaison (partie visible d’un écran, sans scroller la page).
![Page 9: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/9.jpg)
#2 Soigner le contenu
![Page 10: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/10.jpg)
Être bref et percutant.
![Page 11: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/11.jpg)
Visuels soignés.
![Page 12: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/12.jpg)
Formulaire : demander uniquement les champs nécessaires.
![Page 13: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/13.jpg)
Formulaire : soigner les détails.
Ex. : afficher le clavier numérique pour les numéros de téléphone.
1 2 3
4 5 6
7 8 9
0
![Page 14: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/14.jpg)
#3 CTA
![Page 15: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/15.jpg)
Le CTA doit être facilement identifiable.
bouton minuscule
![Page 16: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/16.jpg)
Ne pas multiplier les objectifs. Une page. Un objectif.
deux objectifs différents
![Page 17: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/17.jpg)
Placer le CTA au-dessus de la ligne de flottaison*.
*partie visible d’un écran, sans scroller.
![Page 18: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/18.jpg)
CTA
18
• Un objectif, une action par page.
• L’action souhaitée doit être claire, visible et compréhensible.
• Si la page est longue, ne pas hésiter à disposer plusieurs CTA (pour la
même action).
• Le premier CTA doit néanmoins apparaître au-dessus de la ligne de
flottaison, pour que le visiteur sache quelle action doit être effectuée
(ex. : «Faire un don»).
![Page 19: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/19.jpg)
#4 Tester
![Page 20: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/20.jpg)
Tester et optimiser la landing page en continu.
A B
![Page 21: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/21.jpg)
Tester et optimiser la landing page en continu.
A B
![Page 22: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/22.jpg)
Tester et optimiser la landing page en continu.
A C
![Page 23: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/23.jpg)
Tester, tester, ...
23
• Tester continuellement le contenu. Dès qu’un test est terminé, en
relancer un autre. La somme des tests positifs aura un impact significatif
sur le taux de conversion.
• Si les contenus les plus importants sont l’accroche et le CTA (taille,
wording, couleur, ...), tout peut être testé.
• Tester simultanément les deux versions («spliter» le trafic).
• Afficher la même variation aux visiteurs réguliers.
• Fiabilité : le test doit être statistiquement significatif. Il ne faut pas tirer
de conclusions hâtives et/ou arrêter le test trop tôt.
![Page 24: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/24.jpg)
Conclusion
![Page 25: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/25.jpg)
A garder en tête
25
• Adoptez un point de vue utilisateur : le contenu de la page répond à
une attente de l’utilisateur. Facilitez-lui la vie et offrez une expérience
qui réponde à ses besoins.
• Comme indiqué précédemment, une optimisation en continu de la
page est importante. Chaque élément a un impact sur le visiteur. Les
tests A/B ou multivariés sont faciles à mettre en place et sont un bon
moyen de mesurer l’impact d’une/des modification/s sur les
performances.
• In fine, les éléments non-visibles impactent eux-aussi les conversions,
tel que le temps de chargement de la page (à tester sur différents
supports).
![Page 26: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/26.jpg)
Scandola SA Primerose 2 1007 Lausanne +4121 944 33 44
Nicolas Pittet, Directeur [email protected]
@NicolasPittet
Merci de votre attention
![Page 27: Concevoir une landing page qui convertit](https://reader033.vdocuments.site/reader033/viewer/2022050812/587b43111a28ab9c0e8b611f/html5/thumbnails/27.jpg)
• https://www.pinterest.com/pin/47217496064110322/
• https://www.pinterest.com/pin/180495897541012834/
• https://www.pinterest.com/pin/155022412144840851/
• https://www.pinterest.com/pin/386746686725012083/
Sources
27