La navbar / le header

Introduction

Dans la web, la navbar est l'élément qui permet à l'utilisateur de naviguer sur votre site entre la page d'accueil, la page de contact, la boutique, etc ...

De son côté, le header est le conteneur à l'intérieur duquel lequel la navbar est construite, généralement fixé en haut de page. Néanmoins, ces éléments sont aujourd'hui quasiment indissociable, si bien qu'au cours de cette formation, nous considérerons que le header et la navbar sont un seul et même élément.

La navbar se présente généralement sous la forme d'une barre horizontale, fixée en haut de page.

On peut également trouver des navbars verticales, notamment pour les versions mobiles :

Caractéristiques

Il est possible de réaliser toutes sortes de navbar. L'essentiel est de ne pas perdre l'utilisateur qui débarque sur le site en question. Aussi, une bonne navbar doit respecter les caractéristiques suivantes :

• Permettre à l'utilisateur d'identifier rapidement la structure du site
  • Comme il est organisé, quelles section il comporte
• Permettre de revenir rapidement à la page d'accueil
  • Généralement en mettant un logo cliquable
• Être toujours accessible facilement
  • Généralement, la navbar suit l'utilisateur lors du défilement
• Respecter les conventions
  • Icone de loupe pour une barre de recherche, par exemple
• S'il y a beaucoup d'onglets à afficher, les séparer en catégories distinctes
  • Pages relatives à la présentation de l'entreprise ensemble, par exemple

Créer une navbar sur oxygen

La navbar est réalisée dans le template Main de votre site. Pour en savoir plus sur ce template et apprendre à créer une navbar, consultez le guide dédié.