Guidelines Composants: Header

[djaumes]

9. Header

a) Définition

(1) Essence

(a) Le Header est un bloc situé en Haut de page regroupant un ensemble d’informations et d’éléments de navigation principale.

(2) Emploi

(a) Le header est obligatoire pour chaque page d’un produit.
(b) Le header doit être le premier élément visuel d’une page donnée.

(3) Mésusage

(a) Le header ne doit pas comporter d’éléments ou de navigation secondaire.
(b) Le header ne doit pas prendre plus de 20% de la hauteur de l’écran

b) Utilisation

(1) Position

(a) Le header doit être le premier élément visuel d’une page donnée.
(b) Aucun élément (sticky) ne peut recouvrir le header ou ses éléments interactifs (liens, boutons, etc).

(2) Alignement

(a) Le header doit prendre toute la largeur de la page.

(3) Contenu

(a) Au minimum, le header doit contenu le logo de la marque, le nom du produit et son accroche, l’identifiant de l’utilisateur, un bandeau de titre de page ou un menu de navigation principale.

(4) Rédaction

(a) Le header et l’ensemble des liens qui le composent doivent être le plus concis et le plus structuré que possible (représentatif des fonctionnalités).

(5) Pictogrammes

(a) Des pictogrammes peuvent être utilisés pour certaines fonctionnalités spécifiques (sauvegarder, quitter, etc.)

(6) Action

(a) L’ensemble du contenu interactif (liens notamment) doit être disponible et visible sans aides à la navigation générés par le navigateur (ascenseurs horizontaux et verticaux)

(7) Variations

(a) Header avec bandeau titre de page
(b) Header avec menu principal de fonctionnalités