Que mettre dans la partie supérieure de votre page d’accueil – Conseils pour le contenu « au-dessus de la ligne de flottaison »

Écrit par

dans

Tips-For-“Above-the-Fold”-ContentWhat you put in the top of your front page has a huge impact on the success or failure of your website. Put the wrong thing in, and you’ll probably see your visitors quickly navigating away from your site. Put the right content there and you may see your sales go up.

This article isn’t an all-in-one guide for creating above the fold content, nor is about an all-encompassing rule on what you should put in. Rather, I will give you a few tips, recommendations and a little bit of helpful research about this topic.

Avant de plonger directement dans le vif du sujet, il est bon de savoir comment s’appelle d’abord la partie supérieure de votre page d’accueil. Il existe un meilleur nom pour cela que la partie-supérieure-de-votre-site.

file000153814713_

« Au-dessus de la ligne de flottaison »

On l’appelle la zone « au-dessus de la ligne de flottaison » (Above the Fold). Pourquoi ? Parce qu’à l’époque où l’humanité utilisait ces objets appelés journaux, ils étaient généralement pliés en deux, de sorte que seule la partie supérieure était immédiatement visible. Cette partie supérieure ou partie « au-dessus du pli » contenait les gros titres les plus importants du jour, puis lorsque vous le dépliez, vous voyez le reste des titres moins importants. De même sur les sites web, la partie supérieure de votre site est la première chose que les gens voient, puis lorsque vous faites défiler la page vers le bas, vous voyez le reste du site, un peu comme si vous dépliez un journal.

Pour rester sur l’exemple du journal, disons que vous marchez dans la rue et que vous voyez un marchand de journaux. Si le gros titre est intéressant lorsque vous voyez le journal, vous pourriez bien l’acheter pour lire la suite. C’est essentiellement la même chose avec les sites web : si des visiteurs passent par votre site et trouvent votre contenu au-dessus de la ligne de flottaison intéressant, ils pourraient bien être convaincus et faire défiler l’écran ou parcourir le reste de votre site pour en savoir plus.

L’étude de Nielsen

Earlier I said that your above the fold content may make or break your site. Nielsen Normal Group has written a few research articles about this across the years. I’ll quote the summary of their article The Fold Manifesto: Why the Page Fold Still Matters

The average difference in how users treat info above vs. below the fold is 84%.

If you just got confused about the wording of the quote, I did too at the start. Let me clarify: That study doesn’t mean that 84% of people do not scroll down, on the other hand I’ve seen other research say that most people do scroll down to the bottom of the page. It also doesn’t mean that the lower part isn’t important. Instead it means that the behavior of your visitors in your site is largely impacted by your content above the fold.

Cela semble logique puisque la partie supérieure d’un site web est la première chose que l’on voit.

Sachant à quel point le contenu au-dessus de la ligne de flottaison de votre page d’accueil est important, que devriez-vous mettre en haut de votre site ?

Allez droit au but

Indiquez immédiatement de quoi traite votre site. Votre page d’accueil et votre zone située au-dessus de la ligne de flottaison sont les éléments vitaux de l’ensemble de votre site. Si vos visiteurs se sentent perdus, ils feront rapidement demi-tour et fermeront l’onglet. Si vous êtes un nouvel auteur de livres, écrivez que vous l’êtes et mettez en avant votre dernier livre. Si vous êtes un organisateur de mariages, écrivez que vous êtes un organisateur de mariages qui offrira à votre visiteur le mariage le plus mémorable de sa vie. Ou si vous créez un site pour votre petit hôtel, alors écrivez que vous êtes le meilleur bed and breakfast de la ville. (Je réutiliserai ces exemples plus bas.)

Vos visiteurs ne devraient pas avoir à deviner de quoi traite le site. Ils doivent le comprendre immédiatement, et ce n’est qu’alors qu’ils feront défiler la page pour voir plus de détails.

Engagez délibérément vos visiteurs

Ensuite, vous devez penser à l’objectif réel de votre site web. Quelle est la raison pour laquelle vous avez créé votre site au départ ? Quelle que soit cette raison, vous devez également la placer au-dessus de la ligne de flottaison.

Prenons les quelques exemples que j’ai mentionnés plus haut. Pour un nouvel auteur de livres, vous souhaiterez probablement obtenir plus de visibilité. Si vous avez un ebook gratuit, vous pouvez alors placer un bouton pour que vos visiteurs puissent le télécharger. Pour l’organisateur de mariages, vous voudrez que les gens vous contactent au sujet de vos services : insérez votre numéro de téléphone ou un formulaire de contact. Ou pour le petit hôtel, intégrez un formulaire de réservation ainsi que votre numéro de téléphone.

Pour Page Builder Sandwich, je veux que les gens découvrent davantage l’extension et finissent par devenir clients. J’ai donc un bouton qui permet aux visiteurs d’essayer la démo immédiatement, et un autre bouton pour acheter l’extension.

Concevoir au-dessus de la ligne de flottaison

Maintenant que nous savons quoi mettre, il est temps de décider du design. Personnellement, je préfère un contenu épuré et compartimenté, d’où l’arrière-plan uni sur notre page d’accueil. Mais c’est aussi une bonne idée d’accompagner votre contenu au-dessus de la ligne de flottaison d’une image ou d’une vidéo pour le rendre plus vivant.

Screen-Shot-2016-01-29-at-12.11.19-AM_Here’re a few examples of what you can do about your front page.

Add a background image. A large background image behind your large statement is a great eye-catcher and can further encourage visitor engagement. For new book author, maybe adding a background image illustrating the setting of his free ebook would entice people more.

Add an introduction video. Admit it, people can be lazy, especially when it comes to reading. So if your site is a bit complicated, it might be a good idea to add a short video that introduces your site/product quickly. For the wedding organizer, then this can be a video of their latest wedding. Or for our site for example, we can add in a quick intro about the features of our plugin.

Add a video background. This is a bit of a trend nowadays, but I find it appealing at times. If this suits your taste, then this might be a good idea.. I know PayPal had a video background before in their site. For the small hotel, you can put in a stationary video of a scenic area of your hotel as the backdrop.

Conclusion

Créer du contenu au-dessus de la ligne de flottaison pour votre page d’accueil n’est pas difficile, mais cela demande un peu de réflexion et de tests pour bien faire les choses. Si vous avez déjà un site et que vous en êtes satisfait, mais que vous constatez un taux de rebond élevé dans votre Google Analytics, alors je vous encourage à essayer de repenser votre contenu au-dessus de la ligne de flottaison grâce aux conseils ci-dessus.

If you have tips on creating above the fold content, kindly share them in the comments!


Page Builder Sandwich can Help You Design Your Front Page & Above The Fold Content

Page Builder Sandwich is a WordPress plugin that allows you to create any design you want without writing any piece of code.

En savoir plus sur Page Builder Sandwich