Comment créer un hero header ? C’est la première section que vous voyez sur une page d’accueil. Saviez-vous comment se nomme cette partie et quel est son but ? Dans cet article, je vous parle les éléments pour créer un hero efficace ? Et pourquoi vous devriez en avoir un sur votre site ?
Qu’est-ce qu’un hero header ?
Le hero ou hero header est une bannière web toujours situé en haut de page d’un site internet. Son principal objectif est de captiver l’attention de votre visiteur et l’inciter à rester sur votre site. Pour créer un hero efficace, il faut plusieurs éléments indispensables. Je vais les détailler dans plusieurs parties.
Exemple d’un hero header
Avant de commencer à détailler, je vous montre un exemple d’un hero header que j’ai créé pour un site pour coiffeur / barber.
C’est la bannière en pleine largeur avec quelques textes, une image et un bouton. Maintenant, passons aux explications.
Logo
Le logo est élément essentiel pour l’identité de votre entreprise mais aussi pour votre site web. Il doit obligatoirement apparaître sur votre site web mais pas n’importe où. En général, le logo est toujours présent dans le header, souvent dans le coin droit de votre site. Il est important qu’il soit placé à cet endroit car cela correspond au sens de lecture de gauche à droite. C’est la première information que votre visiteur doit voir sur votre page web. De plus, pour un rendu professionnel, affichez un logo de bonne qualité, surtout évitez les floues et il ne doit pas être ni trop petit, ni trop grand. Il doit être lisible.
Menu
Maintenant que vous connaissez la place d’un logo sur un site, il faut ajouter un menu de navigation. Le menu permet à vos visiteurs de circuler correctement dans le site. Vous devez voir le menu comme un guide d’utilisation de votre site c’est-à-dire qu’il doit afficher les éléments qui figurent dans votre site.
Titre accrocheur
Le titre est l’un des éléments que les visiteurs voient en premier dans le hero header. Il ne doit pas être vu comme de simples mots mais comme un titre d’accroche. L’objectif de ce titre est d’inciter votre visiteur à rester sur votre site. Pour la rédaction de ce titre, vous devez vous poser comme question pourquoi un visiteur devrait rester sur votre site. Qu’est-ce que je propose ?
Sous-titre
Le sous-titre apporte des informations supplémentaires à votre visiteur. Le titre lui a donné un aperçu de ce que vous faites et le sous-titre détaille la raison pour laquelle il est sur votre site. Il doit se dire voilà ce que je recherche, je suis sur la bonne page.
Image
Et si je vous disais que le choix de votre image est primordial pour créer un hero header efficace. Votre image doit donner un aperçu du service que vous proposez. Si vous cherchez des images de bonne qualité et libres de droits, je vous invite à lire mon article comment créer un site internet .
Bouton d’appel à l’action
Le hero n’est pas qu’une bannière décorative. Après avoir ajouté un titre, sous-titre qui détaille votre service alors il faut que votre visiteur passe à l’action. Votre visiteur doit s’intéresser à vous et devenir votre prochain client et c’est le rôle de ce bouton. Par exemple, pour l’inciter à profiter de vos services alors vous pouvez proposer de réserver un rendez-vous.
Conclusion
Indispensable sur votre page d’accueil, vous avez en main tous les éléments pour créer un hero header efficace. N’oubliez pas d’adapter votre design en mode responsive c’est-à-dire qu’il doit être efficace sur tous types d’écrans, pc comme mobile. Si vous avez des questions, n’hésitez pas à me contacter.
Bonus : Voici un tuto pour créer un hero header