15 Exemples convaincants de contenu Above the Fold pour inspirer le vôtre

Huit secondes – en moyenne, c’est la durée d’attention d’un humain. Cela signifie que si vous êtes un spécialiste du marketing, votre contenu doit inspirer, ravir et être considéré comme utile par votre public cible… en moins de huit secondes.

Peut-être que sur le plan des médias sociaux, votre contenu est performant. Il trouve un écho auprès du public et suscite l’engagement. Mais il est possible que lorsque vous regardez les métriques du site Web, une histoire différente soit racontée.

Si votre temps de session est faible et que votre taux de rebond est élevé, vous mettez peut-être plus de 12 secondes à attirer l’attention d’un visiteur, ce qui, pour générer des leads, n’est pas le meilleur.

Vous perdez peut-être du trafic parce que le contenu que les visiteurs du site Web voient lorsqu’ils visitent votre page pour la première fois n’est pas assez intéressant pour les retenir. Vos pages de destination pourraient être convaincantes au moment où les navigateurs commencent à défiler, mais si elles ne sont pas éblouissantes et conviviales dès le départ, les navigateurs peuvent facilement cliquer.

Cela signifie que votre contenu au-dessus du pli pourrait probablement être refait pour engager les visiteurs.

Si votre site Web a un contenu au-dessus du pli convaincant, vous verrez probablement des taux de conversion plus élevés et des taux de rebond plus faibles. Si vous n’êtes pas sûr, essayez de faire un auto-test en regardant votre site Web d’un nouveau point de vue – si vous étiez un nouveau spectateur, resteriez-vous sur votre site au premier coup d’œil ?

Si votre réponse est  » je ne suis pas sûr « , ne vous inquiétez pas, nous allons y revenir, mais d’abord, discutons de ce que cela signifie pour le contenu d’être au-dessus du pli.

Que signifie  » au-dessus du pli  » ?

Le contenu au-dessus du pli est ce que les visiteurs de la page Web voient lorsqu’ils atterrissent sur un site Web. Transmettant clairement ce que fait une organisation et les avantages qui y sont associés, le contenu au-dessus du pli peut inciter les navigateurs web à explorer le reste du site web et ses offres.

Le contenu qui se trouve au-dessus du pli est ce qui va attirer le navigateur sur votre site web. Une page Web qui est lente à charger, qui est encombrée d’informations et qui est difficile à utiliser n’attirera probablement pas le lecteur de la même façon qu’une page avec le design opposé le ferait.

Parlons de quelques façons de vous assurer que votre contenu au-dessus du pli étourdit les navigateurs Web.

Bonnes pratiques de conception de site Web au-dessus du pli

Lorsque vous concevez votre page Web, gardez ces pratiques à l’esprit. Elles retiendront l’attention des lecteurs et les encourageront à explorer le reste de votre site Web.

Gardez un design simple.

Le contenu au-dessus du pli ne doit pas être extrêmement chargé – s’il l’est, les lecteurs pourraient ne pas savoir où regarder en premier et cliquer loin de la page. Par ailleurs, s’ils ne sont pas en mesure de trouver rapidement la réponse à leur question, ils choisiront probablement un autre site Web.

Pour que votre page ait l’air professionnelle, organisée et conviviale, essayez d’ajouter une image vedette ou un élément multimédia, tel qu’un GIF ou une vidéo, à votre pli. Ensuite, ajoutez un court titre qui présente votre page Web, et une phrase en dessous qui décrit votre page plus en détail.

Faites en sorte que le contenu soit engageant.

Des pages Web simples sont une façon de retenir l’attention d’un navigateur. Mais lorsqu’ils y arrivent, saisissez les occasions de les ravir. Par exemple, lorsque vous rédigez vos titres et votre corps de texte, ils doivent faire écho à la voix de votre marque.

Vous n’avez pas besoin de faire d’énormes changements pour ravir le navigateur. Par exemple, s’il y a un bouton CTA sur votre page, au lieu de lire  » En savoir plus « , essayez  » Prêt à commencer ? « .

Si la photo vedette de votre page Web est statique, voyez si vous pouvez délivrer le même message avec un GIF à la place. En outre, si tout votre texte est d’une seule couleur, essayez d’en ajouter une ou deux autres – une bonne règle de base est d’incorporer les couleurs de votre marque pour le professionnalisme et la cohérence avec le reste de votre site Web.

Concevez votre contenu pour la convivialité.

Avant toute chose, votre contenu doit être facile à interagir avec. Par exemple, si vous travaillez sur le contenu au-dessus du pli pour une page de produit, assurez-vous que votre contenu au-dessus du pli fonctionne comme il le devrait.

Disons que le contenu au-dessus du pli de votre page de produit est une vidéo. Se charge-t-elle correctement, inclut-elle des sous-titres et des options sonores ?

En outre, pensez à l’expérience de l’utilisateur. Si votre contenu au-dessus du pli comporte une vidéo qui se diffuse automatiquement, cela va-t-il interrompre l’interaction de l’utilisateur avec la page ? Pour combattre ce problème, assurez-vous que la vidéo joue en mode silencieux et inclut des sous-titres, si nécessaire.

Résolvez les défis du lecteur.

Votre contenu au-dessus du pli doit répondre au défi du navigateur. Pour illustrer, disons que vous travaillez pour un fournisseur de services de marketing par courriel, et qu’un navigateur recherche « logiciel de marketing par courriel » et atterrit sur votre page d’accueil.

Votre contenu, alors, devrait inclure quelques-uns, sinon tous, des mots-clés « logiciel de marketing par courriel automatisé » sous une forme ou une autre. Par exemple, votre titre pourrait lire « Email Automation for Marketers », et développer cela dans le texte de soutien.

Donc, ce sont quelques directives à garder à l’esprit lors de la conception de votre contenu. Ensuite, nous allons examiner des exemples de sites Web avec un excellent contenu au-dessus du pli.

15 exemples convaincants de contenu au-dessus du pli pour inspirer le vôtre

Wistia

Wistia permet à ses utilisateurs de créer des vidéos dynamiques pour des campagnes de marketing. Leur contenu above the fold présente les services de Wistia en utilisant un mélange de multimédia : GIFs, vidéos et textes courts, pour montrer les capacités du service:

Wistia above the fold

Image Source

La vidéo de la page d’accueil arrête le navigateur dans son élan. Ils passeront probablement plus de temps à regarder le clip inspiré d’un talk-show qui explique les services de Wistia. En tant que consommateur, lorsque je vois de vraies personnes sur une page Web, c’est invitant et cela m’oblige à explorer davantage.

Une page d’accueil simple comme celle de Wistia donne une impression de décontraction. L’atmosphère accueillante de la page d’accueil simpliste transmet une vibration professionnelle. Et, après la vidéo, les navigateurs auront une idée des offres du logiciel, directement de la part des experts en marketing.

Velocity Partners

Velocity Partners, une agence de marketing B2B, n’a pas de vidéo de présentation de l’entreprise pour son contenu au-dessus du pli. Au lieu de cela, la page d’accueil présente un diaporama interactif fascinant qui explique pourquoi les marketeurs innovants devraient exploiter de nouveaux formats de contenu pour raconter des histoires plus rafraîchissantes :

Velocity Partners above the fold

Image Source

« Great marketing moves », décrivent ce qu’est l’entreprise et sont courts, simples et directs, laissant le diaporama faire le gros du travail lorsqu’il s’agit d’attirer les visiteurs. Le message au-dessus du pli de Velocity Partners suscite la curiosité, et à son tour, l’incitation à continuer à faire défiler.

Il est important de noter, cependant, que si vous voulez utiliser un contenu au-dessus du pli similaire à celui de Velocity Partners, assurez-vous que les premières secondes de votre diaporama, ainsi que votre copie, sont les plus engageantes. S’ils ne le sont pas, le navigateur ne se sentira probablement pas enclin à rester sur le site au-delà de la lecture du titre.

VeryGoodCopy

VeryGoodCopy est une agence créative qui conçoit des articles, des pages de destination, des pages Web et des e-mails pour les marques. Au-dessus du pli, le site Web laisse la copie décrire ce que l’entreprise peut fournir aux utilisateurs :

VeryGoodCopy affichage du contenu au-dessus du pli

Source de l’image

Le titre transmet l’opportunité pour les marketeurs d’apprendre à persuader en tirant parti d’un large espace blanc, d’un titre alléchant, d’une brève description de leurs sujets de contenu, de la preuve sociale et d’un appel à l’action vif. Ce design simple et engageant au-dessus du pli retient l’attention de leurs visiteurs et les convainc de consulter leurs micro-articles.

Shopify

C’est par des images que le contenu au-dessus du pli du site Web de Shopify invite le lecteur à explorer. Shopify permet aux entrepreneurs de lancer leur propre entreprise de commerce électronique, en s’appuyant sur elles, plutôt que sur la copie, pour expliquer les fonctionnalités du logiciel :

Le design du site Web au-dessus du pli de Shopify

Source de l’image

La page d’accueil comprend des images artistiques et une vidéo séduisante pour faire une impression durable sur le navigateur. Et, même si le texte est clairsemé, le slogan est plein d’objectifs et incite les visiteurs à cliquer sur le CTA vert pour commencer un essai.

Ann Handley

Cette auteure de best-sellers du Wall Street Journal et partenaire de MarketingProfs, Ann Handley, a utilisé la page d’accueil de son site Web pour impressionner les navigateurs en soulignant les prouesses marketing. Les hyperliens et les liens sont ici des héros – les liens vers d’autres pages d’un site Web permettent de gagner plus de clics sur diverses pages d’un site, comme les titres de Handley :

Site Web au-dessus du pli d'Ann Handley

Source de l’image

Elle exploite également l’espace blanc, une photo accueillante d’elle-même, un slogan accrocheur, un texte convaincant et un appel à l’action vibrant pour persuader ses visiteurs d’envisager de travailler avec elle. Dès cette page d’accueil, le visiteur sait à quoi ressemble Handley, ce qu’elle a fait et comment la contacter. En ce qui concerne le contenu au-dessus du pli, c’est un home run.

Mint

Le contenu au-dessus du pli peut maximiser la simplicité, comme c’est le cas pour Mint, un logiciel de planification du budget &. La page d’accueil simple, mais professionnelle, transmet efficacement l’entreprise et la façon dont elle peut aider les clients.

Voyez la copie dans le titre – elle connecte émotionnellement le lecteur en deux phrases, ouvrant la porte pour qu’il explore le site Web d’une entreprise qui le connaît :

Le design au-dessus du pli de Mint

Source de l’image

Mint a également une photo de son application en action pour attirer l’attention des visiteurs de son site Web. Cela aide le navigateur à visualiser à quoi ressemblera l’application s’il décide de s’inscrire.

InVision

Comment montrer des histoires de clients de façon dynamique au-dessus du pli ? Regardons l’exemple élégant d’InVision:InVision, au-dessus du pli

Source de l’image

InVision est une entreprise de conception de produits numériques qui aide les utilisateurs à créer facilement des sites Web élégants et impressionnants, l’équipe de conception de l’entreprise savait donc que la page d’accueil devait impressionner les visiteurs. Elle le fait, auto jouant une version silencieuse de la vidéo de présentation de l’entreprise, complète avec des témoignages de décideurs d’entreprises telles que Uber et Twitter.

Le texte qui est superposé à la vidéo fait un excellent travail d’explication concise de ce que l’entreprise fait pour les utilisateurs, et le CTA « Free Forever » m’incite même, moi, un marketeur qui ne cherche pas à concevoir un site Web, à commencer à en apprendre davantage sur les offres de logiciels. Il ne cache pas non plus les titres de ces décideurs de la vidéo – « Dantley Davis, Netflix Design Director » est un tiers inférieur assez grand qui peut attirer le regard des utilisateurs quand ils ne regardent pas (le mien a certainement été attrapé).

Animalz

Similaire à VeryGoodCopy, Animalz est une agence de marketing de contenu dont le site Web ne bombarde pas les visiteurs de messages sur leurs services dans le design au-dessus du pli. Au lieu de cela, les visiteurs sont accueillis avec le titre « Le meilleur marketing de contenu du monde se produit ici », ce qui incite un spécialiste du marketing comme moi à lire plus loin pour apprendre comment : Animalz above the fold

Image Source

La copie CTA est différente des boutons CTA courants. « Parlons-en », plutôt que « Cliquez ici pour en savoir plus ! », implique que lorsque les visiteurs cliquent sur le CTA, ils seront dirigés vers une personne réelle qui pourra leur offrir plus d’informations sur le service.

Le site web exploite également l’espace blanc, et utilise des images simples, dessinées à la main, pour inciter le lecteur à défiler vers le bas. Le gribouillis violet descend le long de la page web pour présenter les principaux clients d’Animalz, et mène à un formulaire pour entrer en contact avec l’entreprise.

Ahrefs

Peut-être travaillez-vous pour une entreprise qui veut une page d’accueil sans fioritures, qui transmet les cloches et les sifflets du produit sans congestionner la page avec une surcharge d’informations. Si cette description vous correspond, jetez un coup d’œil à l’approche above the fold d’Ahrefs : Ahrefs above the fold

Source de l’image

Le titre de la page web décrit ce que fait le service : aider les utilisateurs à améliorer leur référencement. Ceci est encore soutenu par le plus petit titre, et le CTA communique aux navigateurs des informations sur les prix.

Les clients satisfaits sont listés en bas, juste avant le pli, pour donner un aperçu complet de la façon dont Ahrefs peut être un avantage pour les entreprises prospères. Si vous souhaitez que votre page d’accueil utilise davantage de textes que de visuels, essayez de la présenter de manière simple, en n’utilisant pas plus de 30 mots, comme l’a fait Ahrefs.

Twitch

Après avoir tapé Twitch.tv dans votre navigateur, vous êtes immédiatement plongé dans ce que propose le site Web : des flux en direct pour les joueurs. En effet, dès que votre navigateur accède au site Web, un flux en direct vedette commence à se diffuser automatiquement :

Twitch au-dessus du pli

Image Source

Bien que cela puisse être un peu choquant d’entendre soudainement des voix provenant de votre navigateur, le design au-dessus du pli de Twitch n’utilise aucune copie pour décrire leurs services. Au lieu de cela, les utilisateurs peuvent se lancer directement dans la démonstration du contenu, en parcourant les flux sans avoir à créer un compte ou à lire quoi que ce soit. Ils peuvent continuer à faire défiler pour voir les flux populaires, cliquer sur l’un d’eux et explorer les capacités du site à partir de là.

En raison de la façon dont le site fonctionne dans son ensemble, cette approche au-dessus du pli fonctionne. Twitch propose aux visiteurs de tester leurs services sans faire aucune lecture. Les plateformes visuelles similaires à Twitch peuvent bénéficier de cette méthode, en attirant les apprenants visuels et les apprenants non visuels.

Skillshare

Skillshare utilise la vidéo pour expliquer l’essentiel de ses services au-dessus du pli. Parce que le logiciel offre des cours en ligne dans une variété de sujets, la vidéo affiche une vue d’ensemble de ce que Skillshare peut vous aider à accomplir, à apprendre et à ressentir :

Skillshare above the fold

Image Source

La vidéo met en évidence des adultes à l’air confiant qui plongent dans leurs passions, ce que Skillshare aide les utilisateurs. Le texte en couches inspire les visiteurs à explorer leur créativité avec le logiciel – et à commencer gratuitement.

Flock

Si vous savez que le site Web de votre entreprise bénéficiera d’un mélange médiatique de contenu au-dessus du pli, envisagez d’aborder cela comme l’app de messagerie Flock. La clé de l’utilisation d’un mélange de contenu sur une page d’accueil est de la concevoir de manière à ce que les informations n’interrompent pas l’expérience d’un premier visiteur de votre site Web :

Flock au-dessus du pli

Source de l’image

Notez comment les gifs sont utilisés pour mettre en évidence le texte changeant qui affiche les fonctionnalités de l’application. L’image de soutien dessinée à la main illustre le fonctionnement de Flock, et le texte CTA affiche un peu de personnalité. L’utilisation d’un mélange de médias pour pimenter votre page d’accueil peut être aussi simple qu’une image animée, un bouton cliquable et un dessin pour afficher une vue d’ensemble de votre entreprise aux visiteurs.

King Arthur Flour

Le contenu au-dessus du pli de ce fournisseur d’ingrédients de boulangerie basé à Boston, King Arthur Flour, est de premier ordre. Il donne aux visiteurs le choix de regarder un tutoriel vidéo sur la façon de faire du pain au levain en utilisant les offres de l’entreprise :

Le design above the fold de King Arthur Flour

Image Source

J’ai pu me faire une idée des offres de l’entreprise : une page Facebook (qui abrite le spectacle de boulangerie de l’entreprise), des recettes, une FAQ sur la boulangerie, des produits à acheter et même une  » Baker’s Hotline « , qui fonctionne comme une page Contactez-nous.

Les fonctionnalités du diaporama, équipées d’une photo brillante et de leur propre CTA, m’ont donné un aperçu complet de tout ce que l’entreprise peut faire pour les boulangers en herbe. Il va au-delà des seuls produits de l’entreprise, et au lieu de cela, offre des informations utiles pour les boulangers en général, ce qui est accueillant pour quelqu’un qui peut être intimidé par la cuisson du pain.

Clarkisha Kent

Etes-vous un pigiste qui se demande comment faire en sorte que votre contenu au-dessus du pli se démarque de votre concurrence ? Si c’est le cas, lorsque vous concevez votre page d’accueil, assurez-vous qu’elle accomplit deux choses : afficher une personnalité, et une navigation facile.

C’est parce que, si votre travail doit vous précéder, votre personnalité aussi, surtout en tant que freelance. Si vous êtes un écrivain, comme Clarkisha Kent, votre texte doit le vendre, comme le fait son site web : Clarkisha Kent's above the fold design

Image Source

L’inclusion d’un portrait et d’un titre intéressant montre rapidement davantage qui est Kent en tant qu’écrivain, et l’angle qu’elle est susceptible d’adopter en tant que contributeur à des sites Web. Sa barre de navigation comprend des liens vers des tweets viraux qu’elle a faits et des coupures de presse d’autres publications, de sorte que sa page d’accueil n’a pas à le faire.

Au contraire, sa page d’accueil sert d’introduction, qui peut la précéder avant le reste de son site Web. Lorsque les navigateurs sont attirés par une page web minimaliste avec un texte en forme de cliffhanger, ils vont probablement être intéressés à explorer le site web pour combler ce vide. Par exemple, lorsque j’ai lu « Chaos bringer », j’ai immédiatement voulu savoir comment, ce qui m’a incité à regarder ses travaux antérieurs.

Good Witch Kitchen

C’est un autre exemple de la façon de transmettre la personnalité de votre marque si vous êtes un indépendant ou un propriétaire de petite entreprise. Good Witch Kitchen est le nom de l’entreprise de Kristen Ciccolini, nutritionniste holistique. Juste en dessous du pli se trouve un rapide diaporama des publications qui ont présenté le travail de Ciccolini, avant de plonger dans une introduction :

Good Witch Kitchen au-dessus du pli

Source de l’image

Le logo de Ciccolini, une image lumineuse liée à son métier et une copie fournissent avec précision un aperçu rapide de l’atmosphère que Good Witch Kitchen véhicule : Une approche non diététique de la gestion de la nutrition par une experte.

Maintenant que vous avez de l’inspiration sur la façon de garder vos clients engagés sur vos pages de destination, quelle stratégie allez-vous utiliser pour la vôtre ? J’ai hâte de voir ce que vous allez trouver.

Nouveau call-to-action

.