Les meilleures conceptions de page d’accueil sur Internet et comment les copier

Les gens prédisent la « mort de la page d’accueil” depuis des années.

mais la page d’accueil ne disparaîtra jamais.

Chaque site a besoin d’une porte d’entrée pour accueillir ses nouveaux utilisateurs pour la première fois, et de leur donner la configuration de la terre.

cependant, la page d’accueil évolue.

Il y a encore quelques années, les pages d’accueil contenaient des tonnes d’informations différentes sur tous les aspects de l’entreprise.

ils étaient bourrés de liens et d’endroits où aller., L’entreprise voulait mettre en évidence tous les différents aspects de ce qu’elle faisait.

le problème est qu’il s’est retourné contre lui.

il y avait tout simplement trop d’options. C’était écrasant et distrayant pour les utilisateurs.

l’un des meilleurs moyens d’améliorer rapidement les conversions de conception de site Web consiste à abandonner les fonctionnalités qui nuisent à l’expérience utilisateur.

Les curseurs de carrousel en sont un parfait exemple. Ils sont couramment utilisés pour présenter plusieurs choses différentes à la fois.

mais cette polyvalence a souvent un coût. Les Tests ont montré qu’Ils nuisent aux conversions, au référencement et aux temps de chargement des pages.,

Voyons que faible pourcentage dans l’image ci-dessus? Ce n’est pas un bon signe.

en fait, c’est toute la raison pour laquelle j’ai créé Crazy Egg. Si vous voyez que les utilisateurs ne cliquent pas sur ce qu’ils sont censés faire, vous pouvez modifier le design avant qu’il ne soit trop tard.

Les meilleures pages d’accueil prennent en compte l’expérience utilisateur.

Voici quelques-unes de mes conceptions de page d’accueil préférées. Vous pouvez commencer à les Copier pour obtenir des résultats similaires.

Bills.com

la première tendance majeure à mettre en évidence est la page d’accueil en tant que page de destination.,’

cela a beaucoup de sens quand on y pense.

Votre objectif ultime est de générer des prospects et des ventes. Le site web « brochure en ligne » est mort et disparu depuis des années.

la partie délicate est de connaître la meilleure approche pour générer des prospects sur la page d’accueil afin de ne pas effrayer tout le monde et de les forcer à rebondir.

par exemple, c’est beaucoup de demander à de nouveaux visiteurs qui n’ont jamais entendu parler de vous d’acheter un gros produit.

donc, au lieu de cela, vous avez besoin d’une approche plus simple et moins invasive pour finalement obtenir ce que vous voulez.

et c’est pourquoi j’aime quoi Bills.com fait.,

par exemple, rendez-vous sur leur site, et vous verrez le curseur suivant:

Maintenant, vous pouvez faire glisser interactivement d’avant en arrière pour choisir le montant de la dette que vous pourriez devoir. C’est si simple qu’un enfant peut le faire.

C’est aussi la seule option qu’ils vous donnent jusqu’à présent! De cette façon, vous ne vous sentez pas dépassé ou distrait.

Après avoir cliqué sur « Continuer”, ils vous demandent si vous êtes en retard sur les paiements ou non (et si oui, pour combien de temps).

Ils sont admissibles à vous ici., Si vous n’êtes pas en retard sur les paiements, ils pourraient ne pas être en mesure de vous aider beaucoup (lire: faire de l’argent de vous).

ils peuvent utiliser cette question pour personnaliser la réponse qu’ils vont éventuellement vous donner. Cela peut même aider à diviser en interne quelle personne ou service sera le mieux à gérer votre cas si vous devenez un client.

l’étape suivante consiste à sélectionner l’état dans lequel vous vivez:

encore une fois, cela vous qualifie davantage et soulève également des problèmes potentiels avec les restrictions d’état (qu’ils pourraient avoir à traiter plus tard).,

la toute dernière étape est celle qu’ils voulaient depuis le début: vos informations personnelles!

KlientBoost appelle cela la « Technique du fil d’Ariane”, car au lieu d’effrayer les gens avec le formulaire initial, vous leur faites prendre de petits micro-engagements.

chaque micro engagement les emmène un peu plus loin jusqu’à ce qu’ils soient déjà tellement investis qu’ils doivent terminer le processus.

par exemple, s’ils avaient demandé votre nom et votre numéro de téléphone à l’avance, cela vous aurait peut-être fait peur.,

Cependant, en vous incitant à vous engager dans ces autres étapes, ils se donnent une meilleure chance de vous convertir en un nouveau client.

KlientBoost a utilisé avec succès cette technique pour augmenter les taux de conversion de 1% à près de 20%.

l’astuce avec ces pages de destination en plusieurs étapes consiste à commencer par la question la moins menaçante possible.

Il doit être lié à la façon dont vous allez finalement les aider. Cependant, il devrait être incroyablement simple pour quelqu’un de fournir.,

évidemment, il devrait y avoir zéro mention de prix ou de leurs données personnelles à ce stade.

cela pourrait même être aussi simple que de demander un code postal.

La prochaine étape devient un peu plus spécifique, faisant allusion au niveau de service dont ils vont avoir besoin.

Après les avoir incités à s’engager dans ces deux premières étapes, vous pouvez soulever quelques questions plus personnelles pour les suivre par la suite.

vous remarquerez que Bills.com utilise également du contenu interactif pour vous garder engagé sur leur site.

Qzzr est un outil que vous pouvez utiliser pour ce faire sur votre propre site., Ils ont déjà des « widgets » prédéfinis qui peuvent être configurés en quelques minutes (par opposition à payer un développeur pour le personnaliser).

Victoria’s Secret en utilise un qui demande « Quelle est votre personnalité de fitness? »The Food Network demande: » pouvons-nous deviner votre âge en fonction de vos préférences alimentaires? »

dans chaque cas, ces marques utilisent une question amusante qui vous engage. Il n’y a aucune menace à répondre à ces questions au départ.

un autre outil alternatif est SnapApp., Ils créent également des calculatrices interactives et même des infographies que les gens peuvent pointer, cliquer et ajuster pour voir de nouveaux résultats.

Voici un exemple amusant de la vanité de votre marketing qui vous permet de répondre aux questions de manière graphique.

Un dernier outil de recommandation est Brackify. Ce nom ressemble à « parenthèses », non?

Eh bien, c’est exactement le but! Vous pouvez créer des supports interactifs ou des concours pour presque n’importe quoi, et laisser les clients ou les visiteurs du site entrer dans l’action.,

Voici à quoi pourrait ressembler si quelqu’un demande ce que votre favori film de Disney est:

Kiva

Kiva est une plate-forme de microcrédit.

ils mettent en relation des entrepreneurs des pays du Tiers monde avec des donateurs et des sponsors d’autres parties du monde.

par exemple, disons qu’un entrepreneur en Inde a besoin de 1 000 $pour une nouvelle machine à coudre commerciale afin de pouvoir produire et vendre deux fois plus de produits.,

ainsi, les gens du monde entier peuvent faire des dons en petites quantités et ensuite être remboursés au cours d’un an ou deux sur le nouveau flux de trésorerie que cet entrepreneur est capable de générer.

Kiva de la page d’accueil est relativement basique, pour être honnête.

Cependant, comme nous l’avons vu, c’est OK!

Simple et direct peut garder les gens concentrés sur ce qui est important (vous donner leurs informations en échange de quelque chose de valeur).,

le problème est que même si les gens peuvent visiter votre page d’accueil et être intéressés par ce que vous faites, il n’y a pas toujours une raison impérieuse de lancer ce processus.

parfois, vous devez être un peu plus agressif ou assertif pour leur faire savoir la valeur incroyable qu’ils peuvent obtenir.

dans ce cas, Kiva a décidé d’utiliser une superposition de fenêtres contextuelles pour simplement obtenir des options de newsletter par e-mail.

ils voulaient commencer petit (et ne pas utiliser quelque chose de menaçant comme nous l’avons appris à la dernière étape).,

donc, Kiva est allé avec une option de courrier électronique simple pour au moins obtenir quelque chose de quelqu’un avant qu’ils ne rebondissent et quittent le site.

Voici à quoi ressemblait la Nouvelle superposition d’offre:

les superpositions comme celle-ci sont difficiles à retirer.

certains publics les détestent, évidemment. Mais cela peut rapporter d’énormes dividendes si vous positionnez bien votre contenu et proposez bien.

Vous pouvez également contrôler comment ou quand il montre. Par exemple, vous pouvez décider de déclencher à nouveau les visiteurs (contre le retour) et uniquement lorsque le curseur commence à sortir de la fenêtre.,

ceux-ci créeront souvent un effet « lightbox » qui met l’accent sur tout le reste en arrière-plan afin que les gens regardent directement votre nouvelle offre.

Voici un autre exemple de celui que j’utilise pour les séminaires à venir:

Il y aura toujours un pourcentage de votre auditoire que déteste ces choses.

Vous devez donc faire attention à la façon dont vous les utilisez. (Vous devez également faire attention aux erreurs de conception qui ruineront également votre référencement.)

cependant, les résultats peuvent souvent valoir le risque.,

Kiva a décidé de diviser le test de cette superposition pour voir comment leur propre public a répondu.

ils ont connecté Unbounce avec MailChimp (pour les éventuels opt-ins e-mail) et ont décidé d’afficher la Nouvelle superposition à seulement 50% du trafic initialement. Qui est venu à environ 5 000 visiteurs.

Cette seule superposition a capturé 3 à 4% de visiteurs supplémentaires dès le départ.

encouragé, Kiva a continué à itérer avec de meilleurs designs et différentes options pour doubler ce nombre à 6-7%.

Pas mal pour un pop-up « ennuyeux », non?

H. Bloom

qu’est-Ce exactement H. Bloom?,

ils sont un service de livraison de fleurs de luxe. Vous pouvez continuer, punch dans vos préférences, et ils vont prendre soin du reste.

ils sont donc parfaits pour que l’entrepreneur surmené n’oublie jamais ses proches.

jetons un coup d’œil à leur page d’accueil, puis je vous dirai pourquoi je l’aime tant:

tout d’abord, ils ont leur forme au-dessus du pli.

cela rend l’objectif de cette page clair dès le départ. Vos clients frappé cette page, et ils n’ont pas besoin de deviner ce qu’ils sont censés faire.,

la forme qui est devant et au centre garde les choses belles et claires.

la plupart des visiteurs du site Web ont tendance à concentrer la majeure partie de leur attention au-dessus du pli (même s’ils sont de plus en plus habitués à faire défiler vers le bas).

le moyen le plus simple d’améliorer l’optimisation de votre formulaire de génération de leads est de garder votre CTA dans le modèle d’œil normal que les gens utilisent déjà.

par exemple, une étude a été faite il y a des années qui a suivi comment et où les yeux des gens ont suivi quand ils ont frappé votre page. Ils ont constaté que les gens ont tendance à scanner votre site Web dans une forme « F”.,

ainsi, la première section de la page d’accueil de H. Bloom indique immédiatement au lecteur ce qu’ils sont censés faire sur la page.

et puis la section suivante au milieu explique exactement comment leur processus fonctionne.

la progression logique, étape par étape, aide les gens à comprendre ce qu’on attend d’eux et à quel point quelque chose comme ça va être difficile ou fastidieux.,

c’est essentiel car cela définit immédiatement les attentes et surmonte l’objection potentielle selon laquelle cela pourrait prendre trop de temps pour commencer.

Il fonctionne dans le même sens qu’une barre de progression.

par exemple, les barres de progression ont le pouvoir d’augmenter les conversions de 28%, car elles assurent rapidement au spectateur qu’il ne leur reste plus grand-chose à faire pour obtenir leur récompense.’

mon dernier morceau préféré de cette page est la flèche subtile utilisée comme repère visuel pour aider les téléspectateurs de transition d’une section à l’autre.,

c’est un petit détail, mais cela aide à donner aux utilisateurs le message de continuer à lire la page, surtout s’ils ne sont pas encore prêts à remplir le formulaire et à commencer dès que possible.

Basecamp

avant Basecamp était « Basecamp,” ils étaient 37Signals avec plusieurs produits logiciels différents.

et au fil des ans, ils ont constamment itéré pour voir ce qui fonctionne le mieux pour conduire de nouvelles inscriptions d’essai gratuit.,

Voici l’une de leurs variantes actuelles de la page d’accueil qui utilisent une technique de rédaction classique qui existe depuis des décennies:

lisez la première ligne de cette page très rapidement.

« votre entreprise se développe et vous êtes submergé. La façon dont vous travaillez ne fonctionne plus. »

ils énumèrent ensuite quelques-uns des divers problèmes et problèmes que vous (propriétaire d’entreprise surchargé de travail) attendez probablement.

Ceci est un exemple de manuel de la technique de copywriting PAS., Voici comment cela fonctionne:

• problème: vous allez rapidement au cœur de la question en confirmant clairement le problème principal auquel votre prospect est confronté (par exemple « vous êtes submergé.”).
• agiter: ensuite, vous passez à nommer tous les différents points de douleur et symptômes qu’ils éprouvent actuellement à la suite de ce problème (par exemple, « e-mails et textes désordonnés”, « trucs qui glissent à travers les mailles du filet”, etc.).
• Solution: maintenant, vous présentez votre solution comme le Sauveur qui leur enlèvera tous ces problèmes (par exemple,  » il est temps pour Basecamp.”).,

Voici un autre aperçu rapide de cette page d’accueil maintenant que vous pouvez identifier la formule qu’ils suivent.

de Trop nombreuses entreprises veulent lancer directement dans les caractéristiques et les avantages de leur produit sur la page d’accueil.

cependant, le problème est que les visiteurs de votre site ne sont pas encore tout à fait là.

ces personnes peuvent ne pas reconnaître les mêmes problèmes dans leur vie, de sorte que la « solution » que vous leur vendez ne résonne pas avec elles. Ils quittent votre site sans convertir en conséquence!,

vous remarquerez également que cette page d’accueil contient beaucoup de texte, ce qui est inhabituel par rapport à d’autres sites Web de logiciels.

c’est une autre astuce qu’ils ont apprise après avoir testé différentes versions au cours des dernières années.

Il y a des années, ils ont testé une page de Destination classique longue et ont initialement vu un énorme bond dans les conversions (37.5%).

Cependant, ils n’étaient pas satisfaits et qu’ils pourraient faire mieux.

ils ont donc essayé un autre test, mais cette fois en utilisant un témoignage client contre la conception originale.,

le client est arrivé en tête avec une augmentation de conversion de 102%.

Ils ont ensuite suivi d’un test pour voir si la copie longueur avait rien à voir avec les résultats. (Réponse: ce n’est pas le cas.)

Vous pouvez donc voir qu’ils s’en tiennent toujours à un format lourd en texte. Cependant, ce n’est pas nécessairement la longueur de cette copie qui fait la différence.

Au Lieu de cela, tout se résume aux mots spécifiques utilisés et à la formule intelligente pour s’assurer que leurs clients savent exactement quels problèmes Basecamp résout.,

MailChimp

la page D’accueil de la société de logiciels de marketing par courriel, MailChimp, présente l’une des meilleures leçons sur la façon de concevoir une page d’accueil qui convertit.

cependant, à première vue, cela ne ressemble pas à grand-chose:

l’une des premières choses que vous remarquerez est qu’il y a un seul bouton au-dessus du pli.

Il n’y a littéralement rien d’autre à cliquer ici!

la diminution des options et des choix a été démontrée pour aider à améliorer les taux de conversion., L’idée est que plus vous forcez les visiteurs à prendre de décisions, plus il leur faut de temps pour décider quoi faire (le cas échéant).

la page D’accueil de MailChimp propose également une leçon sur les espaces blancs (ou les espaces négatifs).

par exemple, nous avons tous essayé de lire un article de blog sur un site web, seulement pour avoir l’impression qu’il est trop « étroit » ou encombré. C’est un drapeau rouge massif que votre conception de blog pue!

Au Lieu de cela, une page bien conçue devrait être ouverte et aérée comme celle de MailChimp.

L’espace négatif autour de votre CTA principal contribue à augmenter son importance sur la page., Donc, les gens sont presque obligés d’y prêter plus d’attention.

faisons défiler un peu la page et voyons comment ils jouent avec l’espacement horizontal pour monopoliser également votre attention.

ils utilisent une astuce de photographie appelée la « règle des tiers” qui dit que vous devez placer les éléments de page les plus importants au milieu de votre réticule.

Le contenu de cette section de la page d’accueil est décentré pour une raison! Il finit par façonner ou contrôler la façon dont ils veulent que vous affichiez le contenu de la page par ordre d’importance.,

de cette façon, ils peuvent vous aider à hiérarchiser subtilement une hiérarchie de page qui dit « c’est l’option #1, c’est l’option #2, etc. »

Conclusion

Les meilleures pages d’accueil sur le web aujourd’hui pourraient avoir des objectifs différents.

cependant, il y en a toujours un gros sur lequel ils reviennent. La génération de leads.

Tous les sites web doivent aujourd’hui vendre.

cela ne signifie pas qu’ils doivent amener les gens à acheter tout de suite. Mais il doit arriver à ce point éventuellement.

Les meilleures pages d’accueil utilisent divers facteurs, des fonctionnalités interactives à la conception, pour indiquer subtilement à l’utilisateur ce qu’il doit faire ensuite.,

croyez-le ou non, cela devrait également être dans l’intérêt du visiteur.

cela leur simplifie la vie en prenant moins de décisions, tout en les amenant plus rapidement à la destination prévue (afin qu’ils puissent résoudre le problème ou le point douloureux qu’ils rencontrent).

Quel Est votre exemple de page d’accueil préféré et qu’aimez-vous à ce sujet?