PROCHAINE DISPO FIN MAI 2024 - ON S'APPELLE ? • PROCHAINE DISPO FIN MAI 2024 - ON S'APPELLE ? • PROCHAINE DISPO FIN MAI 2024 - ON S'APPELLE ? • PROCHAINE DISPO FIN MAI 2024 - ON S'APPELLE ? • PROCHAINE DISPO FIN MAI 2024 - ON S'APPELLE ?

Comment faire un bon header ?

10 novembre 2021

Parlons peu, parlons bien et rentrons directement dans le vif du sujet, aujourd’hui on va parler header. Le header ? Hein ? Le header c’est tout simplement le haut de page de votre site. C’est généralement à cet endroit que vous retrouvez le logo, le menu, des infos de contact, ou encore votre panier s’il s’agit d’un site e-commerce par exemple.

De manière générale, on a tendance à sous-estimer ce petit header, mais il est d’une importance capitale. Pourquoi ? Et bien parce que c’est la première chose que votre visiteur verra en arrivant sur votre site. Il est donc primordial de bien soigner son design, de faire en sorte qu’il soit fonctionnel, en soit qu’il soit impactant, clair et en même temps fonctionnel.
Mais comment faire ça ?

Et bien en tant que webmaster & webdesigner freelance, voici quelques conseils pour avoir un header au top du top !

 

1 – METTRE LES ÉLÉMENTS IMPORTANTS

De manière générale, et comme je le disais précédemment, le header contient : votre logo, votre menu de navigation, et parfois un appel à l’action (“mon compte” ou encore “panier”, ou même “contactez-nous”, voir “prendre rendez-vous”). En plus de ces éléments, on reprend aussi votre identité visuelle à travers vos couleurs, vos typographies, ou encore des éléments graphiques. Et c’est tout.

L’important est de mettre les infos dont votre visiteurs aura besoin directement, et de lui offrir une navigation des plus simples avec un design qui colle à votre charte, afin que l’on identifie bien que c’est votre site. D’où l’importance de mettre votre logo.

Évidemment en fonction de la taille de votre menu vous pouvez ajouter des petits éléments fonctionnels comme des icônes de réseaux sociaux, ou encore une barre de recherche.

Il faut mettre ce qui a de l’importance tout en restant le plus concis possible afin de ne pas perdre votre utilisateurs.

 

design menu

2 – UN BON DESIGN POUR VOTRE MENU

Lors de la création de votre header vous allez devoir y intégrer votre menu. Il est important que celui-ci soit le plus clair et organisé possible. Car c’est grâce à ça que votre utilisateur se déplacera sur votre site. Si vous souhaitez qu’il voit certaines pages en premier ou autre penser à la hiérarchisation correcte de vos pages.

Il faut également veiller à ne pas mettre des noms de page à rallonge sous peine d’avoir un menu beaucouuuup trop long, encore une fois aller à l’essentiel.

Enfin, il est possible de faire des sous-pages, mais c’est comme tout, il ne faut pas en abuser. Évitez par exemple de faire un menu avec des sous-pages, et de mettre des sous-pages dans des sous-pages afin d’éviter que la navigation de votre site ressemble à une poupée gigogne.

Je le répète souvent dans les TIPS, mettez vous à la place de votre client. Si vous vous perdez sur votre site, il y a de grande chance que votre utilisateur aussi…

 

3 – RENDRE VOTRE LOGO CLIQUABLE

Un conseil qui peut paraître très simple, mais je tombe régulièrement sur des sites où le logo n’est pas cliquable, et c’est une erreur ! De plus en plus de sites mettent un lien vers la page d’accueil sur le logo présent dans le header, il y a donc de plus en plus de gens qui prennent le réflexe de cliquer sur ce fameux logo pour revenir à la page d’accueil.

En ne mettant pas un lien vous ne simplifiez pas la navigation, et c’est un détails qui a son importance.

 

4 – TRAVAILLER VOTRE RESPONSIVE

C’est la bête noir de beaucoup de personne : le responsive. Pour ceux qui ne le savent pas, le responsive est très important car c’est l’adaptabilité de votre site sur d’autres support comme une tablette ou un téléphone. Et sachant que 70% des gens sont sur leur téléphone pour consulter un site, il faut donc que votre site soit bien adapté sur mobile !

Et au-delà de votre site, votre header, car c’est lui le centre de votre navigation. Il faudra donc bien mettre le menu burger à droite, car c’est généralement là que nous cliquons avec notre pouce. Et pensez aussi à rendre l’accès à votre panier pour faciliter les achats de vos utilisateurs sur mobile afin de ne pas perdre de vente.

Autre détails, on évitera les pop up sur téléphone, car selon la taille vous avez des chances de perdre votre utilisateurs qui n’arrivera pas facilement à fermer votre pop up, notamment si la petite croix pour la fermer n’est pas assez visible.

 

5 – COMMENT PERSONNALISER VOTRE HEADER

C’est la question à 100000 euros. En fonction du thème que vous utilisez vous pouvez modifier votre header de différentes façons.

Voilà quelque conseil pour les sites sous WordPress :

Vous utilisez un thème tout fait :
vous ne pourrez pas modifier sur-mesure votre header, mais vous pourrez modifier certains éléments en allant dans votre back office et ensuite dans APPARENCE > MENU

Vous utilisez un constructeur de thème comme Divi ou Elementor :
en générale on construit les header avec des MODÈLES, il suffira alors de vous rendre dans votre bibliothèque de MODÈLES via votre back office, et de faire les changements souhaitez

Et bien sûr si vous avez envie de modifier votre menu mais que vous n’avez aucune connaissance n’hésitez pas à contacter votre webmaster pour avoir des conseils ou demander un devis pour l’optimisation de votre header.

Vous savez désormais tout sur les header, il n’y a plus qu’à l’optimiser !
Et si vous avez une question ou un projet, n’hésitez pas à me contacter, je me ferais un plaisir d’échanger avec vous.

ta checklist

offerte

Une liste d’éléments indispensables à mettre en place sur ton site de toute urgence !

Tu as Une idée ? des doutes ? Un projet ?

Tu as besoin de renseignements pour ton projet ou tout simplement d’échanger pour y voir plus clair ?
Contacte-moi pour qu’on fasse connaissance & qu’on trouve ensemble la solution adaptée pour développer ton business !

TA CHECKLIST OFFERTE

Pour recevoir ta checklist pour un site aux petits oignons, remplis le formulaire ci-dessous. Tu recevras un e-mail pour la télécharger !