Web design : comment utiliser les pop-ins sur votre site web ?

Sur Graphiste.com, recevez rapidement des devis pour réaliser votre projet Webdesign. Trouver un webdesigner disponible

Les pop-up ne sont pas toujours bien vues par Google, qui n’aime pas trop tout ce qui amoindrit l’expérience utilisateur.

Certains navigateurs, comme Chrome ou Firefox, les bloquent systématiquement. Faut-il pour autant vous en passer ?

Non, vous pouvez les remplacer par un pop-in ! Petit tour d’horizon sur des manières créatives d’augmenter votre taux de conversion.

 

Le pop-in, remplaçant de la pop-up ?

Techniquement, la pop-up est une nouvelle fenêtre ouverte par le navigateur.

pop up créative

Un peu comme un diable qui surgit hors de la boîte quand vous l’ouvrez. Et sur lequel vous devez appuyer pour le faire disparaître.

pop in redacteur
Pop-up du site Redacteur.com

Le pop-in, quant à elle, est directement intégrée à la page. C’est du code qui la fait apparaître ou disparaître.

Pour l’internaute, la différence peut sembler minime, puisqu’il devra souvent cliquer sur une petite croix pour la réduire ou la faire disparaître. Mais pour le référencement, ça change tout !

Pour aller plus loin : 5 erreurs à ne plus faire sur une interface utilisateur

 

Les principaux formats de pop-in

Vous avez en votre possession un jeu de cartes complet, dans lequel vous pouvez piocher à votre guise, pour choisir de quelle manière vous allez faire apparaître votre pop-in.

  • La scroll box (ou fenêtre déroulante)
    La scroll box apparaît sur la page du site, et reste visible, toujours au même endroit, alors que vous faites défiler la page.
  • La classique
    C’est la fenêtre qui apparaît spontanément au centre de la page et qui s’y superpose (par exemple, pour demander le consentement lié au RGPD, mais pas seulement).
  • La welcome mat
    Celle-ci recouvre et opacifie toute la page web. Il est donc impossible de lire ce qui est présenté sur la page sans avoir interagi avec elle. Comme elle sert de message de bienvenue, elle apparaît souvent avant tout autre visuel (ce qui est un pari risqué : les internautes risquent juste d’y essuyer leur souris, sans rentrer chez vous).
  • La smart bar
    C’est la plus discrète d’entre toutes, puisqu’il s’agit d’une simple barre de navigation, en haut ou en bas de la page. Il reste possible de parcourir le site internet sans prendre attention à cette pop-in. Son côté peu intrusif est particulièrement pertinent pour les écrans les plus petits.
  • La clic trigger
    La moins intrusive de toutes les pop-in : elle n’apparaît que suite à l’action de l’internaute. Par exemple, après avoir cliqué sur un lien. Elle semble donc tout à fait pertinente dans l’expérience de navigation.

Pour aller plus loin : Comment créer un pop-up efficace ?

 

+250 000 freelances disponibles sur Codeur.com

Recevoir des devis gratuits

Rapide, gratuit et sans obligation

Des contenus utiles pour votre pop-in

La plupart des pop-up ont deux buts : obtenir une adresse mail ou vendre un produit.

pop in concours

Dans le premier cas, il est de bon ton d’offrir quelque chose en échange, que ce soit un cadeau, un ebook ou un bon de réduction.

Profitez-en, le cas échéant, pour segmenter vos listes d’abonnés (en gardant en tête qu’il est beaucoup plus facile d’obtenir des réponses à un formulaire court).

Vous pouvez aussi prévoir une pop-up ou pop-in qui annonce une nouveauté sur votre site, ou qui accueille un client régulier avec une offre alléchante qui lui est dédiée.

Utilisez les techniques modernes pour :

  • envoyer directement la réponse sur messenger ;
  • intégrer un compte à rebours avant l’expiration de votre offre ;
  • intégrer une carte géolocalisée de votre boutique ;
  • proposer un produit complémentaire suite à une commande ;
  • rappeler à la personne qui quitte votre site qu’elle n’a pas validé son panier.

Un pop-in coloré, et qui correspond à la charte éditoriale de votre site web, à plus de chance d’être apprécié. Ne négligez pas plus leur apparence que celle du reste de vos pages internet !

Pour aller plus loin : E-commerce : 10 idées créatives pour booster vos ventes