Popup UX Design : bonnes pratiques, astuces et exemples

Chaque site Web axé sur le profit vise également à obtenir plus de conversions de ses visiteurs : les encourager à acheter… ou au moins à s'abonner.

Les popups sont le meilleur outil pour augmenter les taux de conversion. Les résultats observés par les magasins de commerce électronique qui commencent à utiliser des popups parlent d'eux-mêmes :

• Kiss My Keto a réduit son taux d'abandon de panier de 20%
• Christopher Cloos a amélioré ses taux de conversion de 37 %
• BOOM! par Cindy Joseph ont augmenté leurs revenus de commerce électronique de 148 297 $ en seulement un mois

Le secret du succès des campagnes ci-dessus était leur intégration à l'expérience utilisateur globale (UX) de chaque site Web. Ces entreprises n'ont jamais interrompu les utilisateurs lors de l'affichage de popups, mais les ont plutôt intelligemment configurées pour qu'elles apparaissent lorsqu'elles pouvaient fournir un contenu utile et pertinent au bon moment.

Si vous pouvez le faire sur votre site, non seulement vous éviterez de perturber votre UX, mais vous l' améliorerez réellement .

Dans cet article, nous examinerons 5 façons d'y parvenir, en commençant par…

Les fenêtres contextuelles d'entrée peuvent être extrêmement perturbatrices.

Ce sont des popups qui apparaissent dès qu'un site Web se charge. Au moment où un visiteur commence à s'orienter et à assimiler toutes les informations de votre site, il est interrompu par une fenêtre contextuelle qui sort de nulle part.

Les fenêtres contextuelles d'entrée également :

• Empêcher les visiteurs d'accéder au contenu souhaité
• Contient souvent du contenu non pertinent
• Confondre les visiteurs

En somme, ils sont presque toujours plus ennuyeux qu'utiles, et ils dégradent l'UX de votre site.

Au lieu de déranger vos visiteurs avec des fenêtres contextuelles d'entrée traditionnelles, laissez-les d'abord connaître votre site Web. Ensuite, vous pouvez afficher votre popup lorsque leur comportement indique qu'ils sont prêts à voir un message secondaire.

Voici quelques façons typiques de déclencher des popups en fonction de l'engagement de l'utilisateur :

• Afficher la popup après X secondes : Cette option donne à vos visiteurs le temps de parcourir la page qu'ils consultent. Vous pouvez attirer leur attention après qu'ils aient passé du temps sur la page.

• Afficher la fenêtre contextuelle après un défilement de X pour cent : vous pouvez configurer vos fenêtres contextuelles pour qu'elles apparaissent après qu'un visiteur a fait défiler un certain pourcentage de votre page Web.
  
  Par exemple, vous pouvez définir une fenêtre contextuelle qui apparaît lorsqu'un visiteur a atteint la fin d'un article de blog, ce qui signifie qu'il est prêt pour un nouveau contenu (peut-être en offrant un ebook gratuit en échange de ses coordonnées).

• Affichez votre popup sur l'intention de sortie : De cette façon, vous attirerez l'attention des visiteurs qui sont sur le point de quitter votre site.
  
  Avec une fenêtre contextuelle d'intention de sortie, vous pouvez empêcher quelqu'un de partir sans se convertir et le convaincre de continuer à magasiner ou de s'abonner à une liste de diffusion.

Il est également essentiel que vous fassiez attention à la "fréquence", ou au nombre maximum de fois où la fenêtre contextuelle doit apparaître. En règle générale, vous souhaitez limiter cela à 1 ou 2 fois par visiteur.

Afficher plusieurs fenêtres contextuelles peut être acceptable (comme nous le verrons ci-dessous), mais voir la même fenêtre contextuelle encore et encore rendra vos utilisateurs fous.

Voici un bon exemple d'utilisation des fenêtres contextuelles basées sur l'engagement des utilisateurs. La fenêtre contextuelle d' intention de sortie d'Obvi n'apparaît que pour les visiteurs qui abandonnent le site.

Il n'y a pas de popup magique qui soit pertinent pour tous vos visiteurs. En effet, tout le monde n'a pas besoin de voir les mêmes informations essentielles ou la même offre de remise en même temps.

Malheureusement, vous ne pouvez pas identifier la solution aux problèmes de chaque individu et leur présenter les solutions dans une fenêtre contextuelle.

Au lieu de cela, vous pouvez segmenter vos visiteurs en groupes partageant des besoins et des caractéristiques similaires.

Ces segments varient selon l'industrie et les types de produits qu'un magasin vend. Cependant, toutes les entreprises peuvent segmenter leurs visiteurs en groupes en fonction de l'étape à laquelle ils se trouvent dans le processus d'achat.

Pensez à votre « parcours client » : comment les gens découvrent votre marque pour la première fois, comment ils arrivent sur votre page de destination et comment ils trouvent les produits qu'ils souhaitent acheter.

Les segments à différentes étapes du parcours client ont des besoins différents, et les popups que vous leur montrez doivent refléter cela.

Examinons maintenant quelques autres facteurs que vous pouvez utiliser pour segmenter vos clients. Nous partagerons également quelques idées de campagne pour différents visiteurs à différentes étapes du parcours client.

2.1. Prospects froids vs chauds

Les "prospects chauds" sont des clients qui cherchent à acheter quelque chose en ce moment, tandis que les "prospects froids" explorent encore leurs options et ne sont pas tout à fait prêts à acheter quoi que ce soit.

Au lieu de traiter tous vos visiteurs comme s'ils étaient des "prospects chauds" prêts à acheter immédiatement, vous devriez créer des objectifs de conversion différents pour les prospects chauds et froids.

Pour les prospects chauds, l'objectif de conversion est simple : acheter maintenant. Votre messagerie doit pousser ces prospects vers une vente immédiate en utilisant une remise ou une offre limitée dans le temps .

Vous aurez besoin d'un objectif de conversion secondaire pour les prospects froids, qui consiste généralement à les amener à s'inscrire à votre liste de diffusion. Après avoir obtenu leurs coordonnées, vous pourrez communiquer avec eux au fil du temps et entretenir la relation jusqu'à ce qu'ils soient prêts à acheter.

Pour cette raison, vous devez montrer aux visiteurs froids du contenu qui leur donne envie de s'abonner, comme un ebook téléchargeable.

Voyons comment cela fonctionne en action. Voici un excellent exemple tiré de quelques campagnes de BOOM! .

Ils proposent un ebook comme aimant à prospects pour les prospects froids qui sont intéressés par leur gamme de produits, mais qui ne sont pas encore prêts à faire un achat :

Pour leurs prospects les plus chauds (qui ont exprimé le plus d'intérêt pour le contenu de BOOM! ou sont sur le point d'abandonner leur panier), ils utilisent l'offre d'un coupon de réduction de 10 % comme une incitation à acheter maintenant plutôt que plus tard.

2.2. Géociblage

Si vous vendez à l'international, le ciblage géographique ou le ciblage géographique peut être un excellent moyen d'augmenter les conversions. Avec le ciblage géographique, vous pouvez créer autant de messages différents pour autant de pays cibles que vous le souhaitez.

La segmentation de vos visiteurs en fonction de leur emplacement vous permet de leur proposer des offres spécifiques à chaque pays, comme des offres sur la livraison. Voici un exemple :.

2.3. Cibler les visiteurs en fonction de leur étape dans le processus d'achat

Chacun de vos clients passe par les étapes de sensibilisation suivantes :

Les 5 niveaux de notoriété décrivent les différents états d'esprit des clients lorsqu'ils interagissent avec votre site. Un client qui vient d'apprendre que votre marque existe verra la même page très différemment d'un client fidèle.

C'est pourquoi vous devez communiquer différents messages secondaires via vos popups à chacun de ces segments.

Voici quelques exemples de messages adaptés à l'un de ces groupes.

1. Les visiteurs conscients des problèmes savent qu'ils ont un problème, mais ils essaient toujours de trouver le meilleur moyen de le résoudre. Donc, à ce stade, votre objectif est de les aider à mieux comprendre leur problème (qu'il s'agisse d'un problème de soins de la peau ou du besoin d'une nouvelle paire de chaussures de course) et de proposer des solutions possibles.

Une façon de le faire consiste à utiliser des articles de blog et des livres électroniques. Par exemple, si vous avez un article sur les "conseils de course pour les débutants", vous pouvez également promouvoir un ebook qui donne des conseils "comment faire" pour courir un 10K.

2. Les visiteurs conscients des solutions savent quel type de produit résoudra leur problème et évaluent activement leurs options (ce qui en fait une perspective « plus intéressante » que les visiteurs conscients des problèmes dont nous venons de parler). Cela simplifie votre objectif : les aider à trouver le meilleur produit pour eux sur votre site.

Une approche éprouvée consiste à leur montrer les produits les plus populaires (ou produits « tendance ») dans la catégorie qu'ils parcourent.

3. Les visiteurs les plus avertis ont trouvé un produit spécifique qu'ils aiment et qui résoudra leur problème. Tout ce qu'ils ont à faire est de cliquer sur "Acheter maintenant" et de passer par le processus de paiement. Même ces clients sont vos prospects les plus "chauds", ils auront souvent besoin d'un dernier coup de pouce pour effectuer un achat.

Une offre spéciale irrésistible qui n'est disponible que pour une durée limitée est le meilleur moyen de convaincre ce segment d'acheter maintenant plutôt que plus tard.

2.4. Segmentation avancée

Vous pouvez également prendre en compte le comportement de vos visiteurs sur site, ce qui vous permet de créer des segments d'utilisateurs de plus en plus spécifiques. Plus votre segmentation est précise, plus votre message peut être pertinent.

Vous pouvez utiliser le comportement spécifique à l'utilisateur suivant pour segmenter davantage vos visiteurs :

• Avoir été sur la sous-page actuelle pendant au moins X secondes
• Proviennent d'une source de trafic spécifique
• naviguent actuellement sur une page spécifique
• Avoir déjà visité une ou plusieurs pages spécifiques
• Avoir des articles spécifiques dans leur panier
• Avoir une valeur de panier supérieure à un seuil spécifique

Cela vous permet de :

• Affichez différentes fenêtres contextuelles aux visiteurs provenant de différentes sources de trafic (par exemple, Facebook vs Google Ads).
• Montrez certaines campagnes aux prospects qui ont visité des pages spécifiques mais n'ont pas encore effectué d'achat.
• Ciblez les visiteurs en fonction des articles qu'ils ont déjà ajoutés à leur panier (pour la vente incitative et la vente croisée).

Comme nous l'avons dit, "Si vous vendez à tout le monde, vous ne vendez à personne." Vous pouvez passer au niveau supérieur avec la personnalisation.

Une fois que vous avez séparé vos visiteurs en segments en fonction de leurs intérêts, de variables démographiques ou géographiques et de leur étape dans le processus d'achat, vous pouvez leur montrer les messages les plus pertinents.

Par exemple, si vous vendez des appareils électroniques et savez qu'un visiteur spécifique s'intéresse aux smartphones, "25 % de réduction sur les smartphones" est un message beaucoup plus efficace que "25 % de réduction sur les produits sélectionnés".

Il existe quatre niveaux de base de personnalisation pour les messages de vos popups :

1. Tout le monde reçoit le même message : En d'autres termes, vous diffusez une offre générale à tous les visiteurs de votre site Web. Ceci n'est pas recommandé.
2. Vous faites deux offres différentes pour les prospects chauds et les prospects froids : c'est-à-dire que vous divisez votre public en deux segments principaux en fonction de leur engagement. Même cette simple segmentation peut faire la différence.
3. Il existe plusieurs offres pour chacun des principaux groupes de visiteurs : Dans ce cas, vous divisez vos visiteurs en plusieurs groupes différents en fonction de variables pertinentes et les réengagez avec des messages personnalisés pour chaque groupe.
4. Tout le monde reçoit un message personnalisé à l'aide du remplacement dynamique du texte : il s'agit du plus haut niveau de personnalisation pour vos popups. Chaque message est adapté à la personne spécifique qui le voit.

Avec Dynamic Text Replacement , le texte de vos popups sera mis à jour automatiquement en fonction des variables que vous choisissez.

Cela signifie que vous pouvez créer un modèle, puis modifier le contenu pour répondre aux besoins de chaque public de visiteurs. L'utilisation de cette approche réduit la quantité d'efforts de votre part et garantit que chacun de vos segments de visiteurs verra le contenu le plus pertinent.

Revenant à notre exemple ci-dessus, le magasin d'électronique fait la promotion de "25 % de réduction sur les smartphones" lorsqu'un visiteur essaie de quitter son site à partir de la page de catégorie de smartphone ou d'une page de produit individuelle dans la catégorie de smartphone.

Cependant, lorsqu'un visiteur recherche des accessoires pour ordinateur portable et essaie de quitter le site, le mot "smartphone" se transforme automatiquement en "accessoires pour ordinateur portable", ce qui répond directement aux besoins de ce client.

Pour maximiser vos conversions, vous devez vous limiter à un objectif par popup et vous assurer que sa proposition de valeur est convaincante.

Une proposition de valeur est un avantage que les clients peuvent attendre de s'engager avec votre popup ou d'acheter vos produits. La proposition de valeur d'une fenêtre contextuelle d'inscription par e-mail peut être un accès exclusif à certaines ventes ou produits, tandis que la valeur d'une fenêtre contextuelle de remise provient de l'argent qu'un visiteur peut économiser en utilisant le code de coupon.

Si vous essayez d'atteindre plusieurs objectifs dans la même fenêtre contextuelle, vous réduirez les chances d'atteindre l'un d'entre eux. En fin de compte, cela brouillera votre message et confondra les visiteurs sur la valeur de votre offre, rendant les conversions et les ventes moins probables.

Plusieurs objectifs peuvent être atteints en utilisant des popups, mais assurez-vous de vous limiter à poursuivre un seul d'entre eux dans chaque popup.

Voici quelques objectifs de commerce électronique courants :

1. Stimuler les ventes
2. Construire votre liste de diffusion
3. Réduire l'abandon de panier
4. Vente incitative et vente croisée
5. Améliorer l'expérience client

Comme nous venons de le voir, le succès d'une popup dépend de la valeur qu'elle apporte à vos visiteurs.

Mais quelle que soit la valeur de votre offre, si en profiter est trop difficile, personne ne voudra se donner la peine.

C'est pourquoi il est important d'éviter de demander trop d'informations. Afficher trop de champs dans une fenêtre contextuelle d'inscription par e-mail, par exemple, donnera l'impression qu'il y a trop de travail pour la plupart des utilisateurs. De plus, les nouveaux visiteurs peuvent hésiter à fournir trop d'informations personnelles.

Moins vous demandez de données, plus vous obtiendrez de conversions. Dans de nombreux cas, une simple adresse e-mail suffit, comme dans l'exemple ci-dessous.

De nombreux sites demandent également un prénom pour personnaliser leurs messages à l'avenir, comme dans cet exemple de The Oodie.

Lorsque vous ressentez le besoin de demander plus d'informations, il est préférable d'utiliser une fenêtre contextuelle en plusieurs étapes. De cette façon, vous pouvez d'abord demander les informations les plus critiques, puis avoir des champs de saisie supplémentaires sur la deuxième page de votre popup.

La fenêtre contextuelle d'Oodie avait une deuxième page où ils demandaient également un numéro de téléphone :

Cette stratégie utilisée par The Oodie s'appelle la «méthode du cheval de Troie» et elle a généré 1,9 million de dollars de revenus supplémentaires pour The Oodie en seulement 30 jours.

Si vous souhaitez "voler" leur stratégie, regardez notre formation gratuite.

Créer des popups comme les designers UX, c'est considérer chacun de vos visiteurs comme un humain, et bien réfléchir à l'état d'esprit dans lequel ils se trouveront lorsqu'un popup apparaîtra.

C'est pourquoi vous ne devez jamais utiliser une fenêtre contextuelle d'entrée, mais plutôt créer des fenêtres contextuelles basées sur l'engagement des utilisateurs avec votre site. Définir les segments d'utilisateurs puis afficher les offres pertinentes est l'étape suivante. Et enfin, vous pouvez personnaliser vos popups en utilisant le remplacement dynamique du texte pour adapter vos messages à chaque utilisateur.

En suivant ces meilleures pratiques, vous pouvez améliorer l'expérience utilisateur sur votre site tout en améliorant vos efforts de création de liste et en augmentant vos ventes en même temps !

Commencez gratuitement avec OptiMonk et créez de superbes popups qui améliorent l'expérience utilisateur en quelques minutes seulement.