Glossaire Web — Design / UX
Header (en-tête de site)
Le header (en-tête) est la section située en haut de chaque page d’un site web. Il contient généralement le logo de l’entreprise, le menu de navigation principal, les coordonnées de contact et parfois des éléments complémentaires (barre de recherche, sélecteur de langue, CTA). Présent sur toutes les pages, c’est l’un des éléments les plus importants en termes de branding et d’expérience utilisateur.
Le rôle du header
- Identification de la marque — le logo en haut à gauche permet au visiteur de savoir immédiatement sur quel site il se trouve.
- Navigation — le menu principal donne accès aux sections importantes du site depuis n’importe quelle page.
- Accès rapide aux contacts — numéro de téléphone cliquable, bouton de contact, email. Pour un site pro, c’est essentiel.
- Cohérence visuelle — le header identique sur toutes les pages renforce la cohérence et l’identité du site.
- Ancrage du visiteur — peu importe où le visiteur arrive depuis Google, il retrouve toujours le header qui lui indique où il est.
Les éléments d’un header efficace
- Logo cliquable — cliquer sur le logo doit toujours ramener à la page d’accueil. C’est une convention universelle.
- Menu de navigation principal — 5 à 7 items maximum au premier niveau, avec éventuellement des sous-menus déroulants.
- CTA visible — un bouton “Demander un devis” ou “Contact” contrasté, qui ressort visuellement du reste du header.
- Coordonnées de contact — numéro de téléphone cliquable (click-to-call sur mobile), email, parfois adresse physique.
- Icônes utiles — panier sur un site e-commerce, compte utilisateur, loupe pour la recherche.
- Sélecteur de langue — si votre site est multilingue, il se place généralement en haut à droite du header.
Header sticky ou pas ?
Un header sticky reste visible pendant que le visiteur scrolle. Cette pratique présente des avantages et des inconvénients :
- Avantages — la navigation reste toujours accessible, le CTA est toujours visible, l’utilisateur peut revenir rapidement à l’accueil.
- Inconvénients — occupe de l’espace vertical en permanence, peut être distrayant, rogne sur la zone de lecture.
- Compromis — header sticky uniquement au scroll vers le haut (apparaît quand on remonte, disparaît quand on descend). Le meilleur des deux mondes.
Header et mobile
Sur mobile, l’espace est très limité. Le header doit être ultra-compact : logo réduit, menu hamburger, éventuellement un bouton d’action. Tout ce qui n’est pas essentiel doit être déplacé dans le menu hamburger ou dans le footer.
Le header est la carte de visite numérique de votre site. Chez Jeff-Web, nous concevons chaque header avec soin : logo bien proportionné, menu clair, numéro de téléphone visible, CTA qui se démarque. Sur mobile, nous optimisons chaque pixel pour qu’il reste utile sans encombrer.
Besoin d’un site web au design professionnel ?