• 6 heures
  • Moyenne

Ce cours est visible gratuitement en ligne.

course.header.alt.is_video

course.header.alt.is_certifying

J'ai tout compris !

Mis à jour le 22/01/2021

Prenez en compte les utilisateurs finaux

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Hiérarchisez l'information de vos contenus

Au-delà de donner une identité et une visibilité à votre marque, la charte graphique doit également offrir à vos lecteurs davantage de lisibilité.

Par exemple, nous pouvons analyser l'usage de la hiérarchisation avec la charte des cours sur OpenClassrooms. Une charte pour OpenClassrooms a été établie avec :

  • des polices ;

  • des couleurs ;

  • des niveaux de titres ;

  • et parfois des pictogrammes…

Tout cela permet de bien comprendre la structure des cours.

Nous pourrions même parler de signalétique, un peu comme dans un aéroport.

Dans un aéroport, peu importe votre pays d’arrivée, les points d'intérêts importants sont toujours très faciles à repérer (douanes, bagages, sortie, toilettes…).

Vous comprenez donc l’importance de structurer vos éléments.

Prenons le cas d’une société possédant plusieurs sites.

C’est le cas par exemple de la SNCF qui possède une "galaxie" de sites internes et externes.

Ces sites possèdent, en plus des éléments essentiels d’une charte (logo, couleur, polices…), des points communs propres au digital.

Il s’agit par exemple :

  • du header (en-tête),

  • du footer (pied de page),

  • ou du principe de navigation (le menu)

Ces éléments devront être conçus de la même manière, quel que soit le site ou l’agence en charge de sa création.

Assurez la cohérence de toutes vos créations

Il vous faudra créer une structure graphique ergonomique et reconnaissable qui permettra à vos utilisateurs (dont l’interne) de naviguer sans avoir l'impression de changer de société à chaque changement de site.

Il faut apporter à l’utilisateur une facilité d’usage ainsi qu’une ergonomie parfaite sur les supports digitaux. C'est ainsi que votre utilisateur va comprendre rapidement où il se situe et où se trouve l’information qu’il cherche.

L’expérience utilisateur est intimement liées aux règles d’ergonomie définies par votre charte graphique.

Un exemple pour vous faire comprendre l’importance de l’expérience utilisateur, c’est le cas de la bouteille de ketchup Heinz.

Après avoir fait des tests utilisateurs, Heinz a analysé un problème : quand la bouteille est presque vide, les utilisateurs doivent secouer énergiquement la bouteille pour faire couler le produit. Heinz a donc apporté une solution en modifiant le packaging des bouteilles afin de les faire tenir à l’envers.

UI vs UX

Concrètement, dans votre charte digitale, l’UX et l’UI pourront regrouper les recommandations que vous ferez sur des points comme :

  • l’architecture de l’information (la navigation) ;

  • les éléments de commandes (les boutons) ;

  • les éléments graphiques de design ;

  • les moyens de contact (les formulaires de contact).

Lors de la création de votre charte graphique, ou pour son évolution, vous pourrez utiliser des éléments comme des pictogrammes, un header, un footer et une navigation propres à votre marque, pour permettre à vos utilisateurs de mieux se repérer et d'accéder facilement à l’information recherchée.

Exemple de certificat de réussite
Exemple de certificat de réussite