Anatomie
Desktop
- Conteneur
- Premier logo
- Deuxième logo facultatif
- Nom du site / service facultatif
- Navigation Bar facultatif
- Premier lien externe facultatif
- Séparateur (s'affiche obligatoirement avec le premier lien externe)
- Deuxième lien externe facultatif
- Séparateur (s'affiche obligatoirement avec le deuxième lien externe)
- Troisième lien externe facultatif
- Séparateur (s'affiche obligatoirement avec le troisième lien externe)
- Quatrième lien externe facultatif
- Séparateur (s'affiche obligatoirement avec le quatrième lien externe)
- Cinquième lien externe facultatif
- Séparateur (affiché uniquement lors de l'utilisation de liens externes)
- Bouton de recherche facultatif
- Premier bouton facultatif
- Deuxième bouton facultatif
- Conteneur d'éléments d'action facultatif
- Bouton de connexion facultatif
- Bouton de menu facultatif
Mobile
- Conteneur
- Premier logo
- Icône de recherche facultatif
- Bouton facultatif
- Avatar (En mode mobile, le nom prénom n’est pas visible) facultatif
- Icône de menu facultatif
- Séparateur (affiché uniquement lors de l'utilisation d'un deuxième logo et/ou du nom du site ou de sa précision)
- Deuxième logo facultatif
- Nom du site / service facultatif
Variantes
En-tête simple
L'en-tête simple est utilisé pour les sites sans recherche, ni éléments de navigation.
Il est obligatoirement composé d'un logo :
- Site grand public : logo Service public de l'autonomie
- Site professionnel : logo CNSA, Caisse nationale de solidarité pour l'autonomie
En-tête simple avec 2 logos
En-tête simple avec nom du service et précision
En-tête avec menu
L'en-tête avec menu est utilisé pour les sites possédant plusieurs pages ; le menu offre la possibilité de naviguer à travers elles.
En-tête avec accès rapides
L'en-tête avec accès rapides est utilisé sur les sites qui souhaitent mettre en avant des fonctionnalités clés, comme par exemple l'accès à la connexion / à son compte.
En-tête avec recherche
L'en-tête avec recherche est utilisé pour les sites qui proposent de rechercher des éléments sur leurs plateformes.
En-tête avec liens externes
L'en-tête avec liens externes est utilisé pour les sites qui souhaitent mettre en avant des liens vers d'autres URL.
Responsive
L'en-tête est un composant réactif et s'étend automatiquement en largeur selon la taille de l'écran utilisé.