Hardik Dewra

3 min read

Ce que fait une bonne section hero

Une section hero a quatre missions : nommer le produit, nommer l’acheteur, promettre un résultat, proposer une action. Le reste est décoratif.

Une bonne section hero a une seule mission

Une section hero donne envie à la bonne personne de continuer à scroller. Quelqu’un arrive, vous accorde quelques secondes, et décide si la page parle de son problème. Tout ce qui est dans le premier écran sert cette seule décision. Quatre éléments la portent : ce qu’est le produit, à qui il s’adresse, ce qui change pour cette personne, et une action claire. Les slogans, les badges de récompenses et les fonds animés prennent la place de ces quatre-là.

Dites ce que c’est

Un titre rate sa cible quand il décrit une sensation à la place d’un produit. « Repensez la façon dont votre équipe construit » peut être un CRM, un outil de recrutement ou une appli de yoga. « Gestion de projet pour les équipes de chantier, construite autour des photos de site » dit en une ligne s’il faut rester. Employez le mot de catégorie que votre acheteur utiliserait au téléphone. Si le titre a besoin du sous-titre pour avoir du sens, le titre en fait trop peu.

Nommez la personne que vous voulez

Une ligne de qualification travaille plus que la plupart des designers ne le pensent. « Pour les marques Shopify à partir de 50 000 $ par mois » renvoie les mauvais visiteurs et dit aux bons qu’ils sont au bon endroit. Les fondateurs craignent que ça réduise le marché. En pratique, une audience nommée améliore la qualité des réponses, parce que les gens qui réservent sont déjà à moitié convaincus. Mettez la qualification dans le sous-titre, ou dans la ligne d’accroche au-dessus du titre.

Une promesse, une action

Deux boutons de poids égal se partagent l’attention et font baisser les clics sur les deux. Choisissez l’action que vous voulez le plus, donnez-lui le bouton plein, et faites du second choix un simple lien texte discret. Le texte du bouton doit nommer ce qui va se passer. « Recevoir mon plan de page » bat « Envoyer », et « Voir les tarifs » bat « En savoir plus », parce que le lecteur sait ce qui l’attend de l’autre côté du clic. Utilisez la même formulation de bouton partout sur la page.

Montrez le produit en train de faire son travail

Cachez le titre avec votre main et regardez l’image du hero toute seule. Si vous ne devinez pas ce qui est vendu, l’image est décorative. Une capture de la vraie interface, une photo du produit dans un vrai contexte ou un court extrait du résultat battent tous un mannequin souriant devant un ordinateur portable. Si vous vendez un service, montrez le livrable : la page que vous avez designée, le tableau de bord, le rapport terminé.

Mettez une preuve à côté du bouton

Une ligne de preuve près du call to action enlève le premier doute avant qu’il se forme. Une ligne de cinq logos clients reconnaissables, une note avec le nombre d’avis, ou un seul résultat avec un vrai chiffre. Chacun fonctionne. Gardez une seule preuve dans le hero et laissez les études de cas pour les sections suivantes. Les badges de confiance vagues, sans source, passent pour du remplissage.

Un test de cinq minutes pour votre section hero

Montrez le hero pendant cinq secondes à quelqu’un d’extérieur à votre entreprise. Cachez-le, puis posez trois questions. Qu’est-ce que ça vend ? À qui ça s’adresse ? Que se passe-t-il quand on clique sur le bouton ? Deux mauvaises réponses sur trois et le hero doit être réécrit avant que le reste de la page compte. Faites le test sur un écran de téléphone aussi, puisque c’est là que la majorité de votre trafic le lit et que la ligne de flottaison est bien plus haute.