Conception landing page, UX design pages d'atterrissages

Enjeux de la conception UX de landing page

La Conception de landing page et l'UX design des pages d'atterrissages ont un impact immédiat sur les performances de votre site web. La prise en compte de l'expérience d'utilisation est un levier pour améliorer les conversions de vos landings pages. L'UX d'une page d'atterrissage bien conçue valorise les motivations et neutralise les freins à l'achat du client final.

Comment concevoir vos landing pages ?
Quelle UX pour une page d'atterrissage ?
Quelles méthodes privilégier pour la conception des pages d'atterrissage ?
Que faut-il faire figurer dans une landing page ?
A quel moment faut-il créer une page d'atterrissage ? Combien de landing pages devaient vous mettre en place ?

Nous allons vous aider à concevoir l'UX d'une landing page en considérant tous les volets du design d'expérience utilisateur : design stratégique, e-business, ergonomie, design de l'information, design de l'interaction, architecture de l'information.

Les landing pages sont la partie visible de l'iceberg d'un dispositif digital : ce sont les pages clés sur lesquelles vont arriver les utilisateurs. Lorsque vous observez les indicateurs de fréquentation de votre dispositif digital, vous constaterez qu'une faible partie de pages monopolisent - trustent la majeure partie du trafic de votre site... C'est un point important et nous allons y revenir.

La qualité d'une page d'atterrissage se mesure à sa capacité à orienter le visiteur au sein du dispositif. Plus précisément, une landing page bien conçue s'évalue dans sa faculté à faire en sorte que l'utilisateur réalise et transforme l'action principale mise en scène...

Note :
sur le plan du vocabulaire et des définitions du concept de landing pages, c'est l'usage anglais de landing page qui prévaut et que l'on traduit à juste titre par page d'atterrissage. On pourrait aussi parler de page hub ou de page de redirection voire de page stratégique ou encore de dispositif d'orientation.

Les types de landing page

Lorsqu'on parle de page d'atterrissage, on considère le plus souvent que leur création résulte des choix du concepteur. Or, il y a un autre cas de figure, encore négligé et anecdotique, mais qui tend à prendre de l'importance : l'utilisation des top pages du site issues du référencement naturel comme landing page. Dans ce cas, on s'appuie sur les pages entrantes les plus puissantes du site, par pur opportunisme, et on réaffecte la fonction principale de la page pour la transformer en dispositif d'orientation, donc de landing page.

1. Landing pages classiques
Une landing page classique est délibérément créée par les équipes projet. La stratégie digitale définit les points d'entrées cruciaux autour des objectifs business et des enjeux importants en matière d'expérience utilisateur.
Les sites web des banques en ligne illustrent parfaitement ce principe : des pages d'atterrissages sont conçues pour les produits d'épargne à taux attractif (objectif business avec recherche de transformation) et des pages d'atterrissages sont également réalisées comme passerelles vers les espaces sécurisés comme le compte client ou le portefeuille boursier (objectif de relation client avec recherche du bénéfice utilisateur).
Ce type de site met en scène 3 à 6 landing pages. Mais il n'y a pas de règles en la matière. En effet, certains sites ecommerce de taille critique couplent les campagnes de liens sponsorisés à la création de landing pages dédiée à des groupes de produits : dans ces cas, on peut observer plus d'une centaine de pages d'atterrissages. Amazon et Cdiscount dépasse le millier de landing page... Peut-on encore parler objectivement de page d'atterrissage ?
Pour votre projet, une base de travail consiste à affecter une landing page à un groupe de plusieurs dizaines de pages : 1 landing page pour agréger 50 pages est un ratio moyen. Tout dépend des objectifs du site. Il faut créer une landing page pour les principaux produits et les services majeurs...

2. Landing pages opportunistes
Une landing page opportuniste est le fruit de variables accidentelles qui ont conduit une page à se hisser comme principal point d'entrée au sein d'un site.
Les algorithmes des outils de recherche ont cette capacité à propulser certaines pages en première page, et en première position de la page de résultat des recherches - SERP (search engine result page). C'est le graal de tout spécialiste du référencement - SEO.
Or, apparaître en première position des résultats de recherche requiert énormément d'efforts. Et la place n'est jamais définitivement assurée.
Conscients du potentiel que représentent ces pages à fort trafic, les équipes projet unissent leurs efforts pour affecter de nouveaux objectifs à la page en question, par pur opportunisme. D'une simple page de contenu, on peut aussi créer un mini-site hub et transformer une top page en matière de trafic en landing page.

Les fonctions des pages d'atterrissage

Les landing pages ont différentes vocations.
Autrement dit, il y a différents registres de landing page :

Landing page à vocation informative :
Présenter un produit, expliquer un service, démontrer un avantage concurrentiel (avantage comparatif).
Page hub à vocation de redirection :
Rebranding (changement de marque). Par exemple, de France Télécom vers Orange, de Gdf-Suez vers Angie, de Vediorbis vers Randstad. C'est le principe du dispositif de redirection, comme pour les accès vers un espace client.
La landing page communicationnelle :
En soutient d'une campagne de communication multicanale, pour absorber le trafic d'un teasing produit...
La landing page de communication de crise :
Mouvement de contraction en réponse à une alerte produit. Il s'agit de rassurer les consommateurs dans le cas de rappel de produit en expliquant les démarches à réalisées le cas échéant. Exemple : un pétrolier qui coule, un médicament suspecté d'être cancérigène, un modèle de véhicule rappelé, un produit contaminé, une hérésie alimentaire (trace de porc dans un yaourt aux fruits, etc.).
La page d'atterrissage transactionnelle :
C'est la landing page classique qui recherche la transformation. Vendre un produit d'épargne. Souscrire une assurance.
Les landings pages de vente :
On ne cherche pas une transaction servicielle, mais une vente de produit. La landing page centrée sur la conversion met en scène un produit et incite l'utilisateur à l'acte d'achat.
Le dispositif capteur de leads :
Qualifier un email, réceptionner des informations, pousser à la création de devis, récupérer une adresse physique, un numéro de téléphone.

Cette liste n'est pas exhaustive mais elle démontre le principe de la flexibilité de la page d'atterrissage. C'est un outil que l'on peut utiliser pour poursuivre différents types d'objectifs, au-delà de la conversion.

Stratégie de création de landing page

En règle générale, la stratégie de création d'une landing page s'articule autour de la conception d'un dispositif d'accueil en réponse à une action de communication. On créé une landing page avec une adresse web spécifique pour réceptionner le trafic d'une publicité TV ou d'une campagne de webmarketing. C'est le cas de figure classique. Voici des exemples de landing page :

Landing page utilisée pour absorber le trafic issu d'une publicité.
Page d'atterrissage créée pour orienter les utilisateurs en provenance des campagnes de liens sponsorisés.
Page hub pour centraliser toutes les visites dans le cadre du lancement d'un produit (voiture, assurance, forfait télécom.
Page de redirection vers un espace client ou une partie sécurisée du site.
Page d'atterrissage pour canaliser les internautes issus des résultats naturels des moteurs de recherche.

A noter qu'une landing page peut également être un site d'atterrissage composé de plusieurs pages, comme dans le cas du lancement d'un véhicule.

Landing page et emarketing

Concevoir une landing page vous permet donc d'optimiser votre interface en prévisionnel de vos actions e-marketing, et ce afin de maximiser les performances de vos campagnes commerciales et de vos stratégies e-marketing.

Quels que soient les leviers e-marketing activés dans le cadre de votre stratégie interactive, une interface optimisée, calibrée et personnalisée apportera de meilleurs résultats qu'une page générique, et pire encore une redirection vers la page d'accueil...
Le concepteur définit une réponse personnalisée à chacune des actions webmarketing pour de tirer le meilleur parti de la campagne. C'est le rôle de la conception des landing page.

Il s’agit de mettre en place, pour chaque action, un dispositif / une page d’atterrissage permettant de répondre efficacement à la promesse et/ou au message diffusé via une action emarketing afin de maximiser les possibilités de transaction / transformations. En matière de webmarketing, les actions à la source peuvent être :

Campagne Google Adwords.
Campagne de publicité en ligne Display.
Campagne de pub vidéo en ligne (Youtube, Dailymotion...).
Stratégie publicitaire hors ligne : publicité dans la presse et les magazines, campagne de publicité télé, spots radios...
Inbound marketing et création de contenus ciblés.
Buzz marketing et création de contenus viraux.
Campagne dans les réseaux sociaux.
Newsletter et campagne emailing.

Dans tous les cas, la landing page doit considérer la source du trafic : le style et la tonalité d'une landing page diffèrera en fonction du message et du support de communication. Un trafic issu des réseaux sociaux appelle un design de landing page différent qu'un trafic issu d'un journal de presse nationale. Il est recommandé de créer des URL spécifiques simples à mémoriser et à épeler pour chaque landing page.

Landing page et expérience utilisateur

Un bon moyen de concevoir les landing pages est de s'appuyer sur la connaissance de votre audience pour calibrer les messages. La démarche du design de l'expérience utilisateur se rapproche des méthodes marketing : connaissance du public, adaptation du message à la cible.

Ainsi, la page d'atterrissage doit être adaptée aux spécificités du public. Cela vaut pour le style du message, la simplicité du vocabulaire utilisé, l'affinité des visiteurs à la marque.
De même que l'on dresse des utilisateurs types pour la conception d'un site web, on peut utiliser l'approche par persona pour esquisser la landing page.

Vous gagnez donc à vous appuyer sur le cycle UX design pour créer vos landing pages, en commençant par analyser le profil du public dans un premier temps. Concevoir et maquetter fonctionnellement la page d'atterrissage dans un second temps. Prototyper et procéder à des tests utilisateurs pour ajuster la landing page dans un dernier temps dédié à l'évaluation.

Landing page et performances

Qu'est-ce qu'un bon taux de conversion pour une page d'atterrissage ?
Un taux de transformation exceptionnel pour une landing page est supérieur à 5% de transaction. Soit 5 transactions pour 100 visiteurs dans le cas d'une vente de service ou de produit, ou de la qualification de lead. Entre 3% et 5%, les performances de la landing page sont très bonnes. Vous pouvez considérer un taux de transformation supérieur à 1% comme bon. Tout dépend du secteur, du trafic, du produit vendu.
Dans le cas de l'email marketing, le taux de transformation tourne à 1 pour 1000... Vous devez vous interroger si votre landing page génère des résultats inférieur à 0,5%, vous devez agir et optimiser quelque chose...

Quels sont les ressorts de la performance dans la conception d'une landing page ?
De près ou de loin, on se rapproche des techniques utilisées dans le design des newsletters.

Bien sûr, il n'y pas de modèle de landing page type, offrant des garanties en matière de performances. Cela reste un travail de création au cas par cas. Ces quelques lignes directrices peuvent au demeurant vous guider dans la création de landing page orientées sur la conversion...

Utiliser un langage concis et direct.
Opter pour un titre percutant et synthétique.
Associer une accroche au titre.
Présenter un descriptif de l'offre au sein d'un chapeau.
Engager l'utilisateur en utilisant les marques de l'incitation : "vous", impératif...
Mettre en scène des données chiffrées.
Proposer un seul appel à l'action.
Limiter les demandes de saisies aux informations fondamentales (lead).
Opter pour un design minimaliste qui met la forme au service du fond.
Respecter les standards ergonomiques : guidage, charge de travail, localisation, adaptabilité de l'interface, cohérence des codes, signification des images...
Valoriser les commentaires des autres clients.
Théâtralisez une vidéo alternative (autre type de contenu permettant de saisir le message).
Neutraliser les possibilités de rebond : comme dans un processus de commande, il s'agit de limiter les portes de sorties. Attention toutefois à ne pas créer une landing page comme un tunnel d'achat au risque de concevoir une page impasse avec un taux de rebond supérieur à 95%.

Les exemples de landing pages présentées ci-dessous ont donné de très bons résultats. Pourtant, comme vous pourrez le voir, il y a une certaine densité dans les pages. Mais le travail de recherche utilisateur a permis de rassembler tous les contenus clés enjeux dans la prise de décision...
Note : il s'agit de maquette fonctionnelle (wireframe).

Créer des synergies avec les actions emarketing

La landing page est un d'abord un dispositif de captation, de transformation, de conversion. Une page d'atterrissage peut également avoir une vocation de redirection. Les formes de la landing page sont variables. De la page minifiée au mini-site.

Dans le cadre de dispositif digitaux responsive design, le concepteur veillera à adapter les landing page dans la lignée du design adaptatif. Pour des landing page exigeant la qualification d'informations et la réalisation de saisie du côté de l'utilisateur, nous recommandons d'opter pour une version spécifique à destination des terminaux tactiles : une version spécifique pour la landing page sur support mobile, une version de landing page spécifique pour tablette.
La conception des landing page a un impact direct sur les performances et sur la transformation. Ainsi, vous obtiendrez de meilleures performances avec des versions spécifiques de landing pages : une version de page d'atterrissage pour les dispositifs desktop et une version spécifique pour les terminaux tactiles, en priorisant le smartphone à la tablette si vous deviez faire l'arbitrage...

Les objectifs visés par un travail d’optimisation d’interface et de conception de landing page en vue d’une campagne emarketing :

Créer un dispositif d’atterrissage personnalisé pour chaque action.
Adapter l’interface au message et à la promesse de chaque levier.
Optimiser les parcours utilisateurs.
Maximiser les transactions et la transformation.
Augmenter les performances de vos campagnes.

Stratégie marketing et UX design

Au niveau de la méthode de conception, les premiers travaux concourent à faire le point sur les campagnes marketing à l'origine du trafic. Les dispositifs de provenance doivent être parfaitement appréhendés. Il s'agira de bien étudier les campagnes de communication et tous les dispositifs référents qui vont pointer sur la page de redirection.
Vous pouvez réaliser une cartographie de la landing page pour faire apparaître les sites qui pointent vers la page d'atterrissage... Pour chaque action emarketing, projetez une petite vision schématisée des enjeux et des impacts à anticiper pour votre support interactif. Le tableau illustré dans les exemples donne un bon aperçu des actions emarketing et de leurs impacts sur la landing page.
Il peut effectivement y avoir différents cargos qui amèneront le trafic :).

Campagne de publicité offline.
Référencement naturel.
Leviers emarketing online : newsletter, email marketing, publicité display, positionnement payant.

Vous devez faire le point sur votre stratégie emarketing et les objectifs des différents leviers activés...

Landing page et public ciblé

Dans la lignée de la démarche UX, vous allez consacrer un volet à une phase d'analyse. En effet, la conception des pages d'atterrissage est à considérer comme un projet de création à part entière : c'est un site dans le site.
De fait, il apparaît pertinent de recourir à un cycle de design UX autour des 3 étapes incontournables de la conception centrée utilisateur :
Analyse UX, Conception UX, Evaluation UX...

En phase d'analyse, les études peuvent être qualitatives (rencontre des utilisateurs, analyse des besoins) et quantitatives (analyse des indicateurs statistiques, sondages). Vous pouvez également vous basez sur la connaissance de vos publics.

C'est une bonne approche de modéliser des personas types (potrait-robot) en vous appuyant sur des données réelles. Ainsi, dégagez 3 à 8 typologies de visiteurs. Pour chacun de ces visiteurs, considérez ce que la landing page devra apporter comme réponse pragmatique.
Pour chaque persona, projetez le parcours type souhaité une fois l'utilisateur arrivé sur la landing page. Ces différents scénarios d'utilisation aideront les concepteurs à modéliser des landing pages très sophistiquées.

Landing page et conception d'interface

Le concepteur de l'interface doit déterminer les objectifs prioritaires de la landing page. Il s'agit de prioriser les fonctionnalités et les contenus à l'écran. La hiérarchisation des informations est facilitée par le travail réalisé sur les personas types et les parcours d'utilisation.

Le designer veille à ce que les contenus soient cohérents avec les dispositifs de provenance : la répétition des messages et des accroches publicitaires au sein de la landing page sont autant de marque de stabilité dans le parcours général de l'utilisateur. En effet, il ne faut pas oublier que la page d'atterrissage accueille le visiteur qui jusque-là, était en plein vol... La cohérence de la séquence est importante. Ainsi, sur le plan de la stratégie des contenus et du design, le concepteur veille à :

Homogénéité graphique : charte, code couleur, signalétique.
Cohérence des discours : accroche, promesse, argumentaires développés...
Continuité dans l'expérience : un dispositif de landing page par type de device.
Continuité sémiologique : photographie, codes visuels et symboles.

L'ergonomie doit être basique, et les questions principales doivent être adressées. Il est toujours intéressant d'avoir un module de FAQ - foire aux questions associé à une landing page. De même, des interactions en temps réel au travers de système de tchat sont particulièrement favorables dans une optique de conversion.

Le maquettage fonctionnel propose une séquence basique au niveau du design de l'information : du haut vers le bas, de la gauche vers la droite. Minification des zones. Le zoning de l'interface doit être factuel : identification de l'émetteur, titre, accroche, call to action et / ou lead, développement des informations sur le modèle de la pyramide inversée.

Sur le plan technique, il faut toujours s'assurer que le dispositif de landing page sera en mesure de tenir la charge serveur d'une arrivée massive d'utilisateurs : cas des publicités tv ou des campagnes radios.
Sur le plan humain, et en matière de service, la promesse doit être délivrée ce qui implique la disponibilité et la réactivité des personnes en charge de délivrer le produit ou le service.

Démarche pour concevoir une page d'atterrissage

Résumé de la démarche UX design pour l'optimisation d'une interface utilisateur dans le cadre de la création de landing page :

Diagnostic de toutes les actions emarketing.
Recherche utilisateur.
Personas data driven.
Parcours d'utilisation.
Clarification des objectifs des landing pages.
Envergure fonctionnelle et envergure éditoriale de la landing page.
Maquettage fonctionnel.
Design et prototypage.
Test, feedback, amélioration continue.

L’optimisation de l'interface utilisateur et la conception de page d'atterrissage efficace génère des résultats très probants dans cadre d’une stratégie emarketing :

Augmentation des taux de transformation pour chaque levier,
Ajustement des parcours utilisateurs sur la performance,
Réponse utilisateur adaptée pour chaque message / levier.

Travaux complémentaires à la conception landing page

Les travaux à prévoir dans le cadre de la conception des landing page concernent la recherche utilisateur, la définition des solutions de conception, la modélisation de l'interface et la mesure des performances :