Que doit contenir une charte graphique pour un site web ?

Véritable axe de pivot dans la communication d'une marque, la charte graphique d'un site web se doit de respecter certaines règles. Car il en va de l'impact qu'elle peut générer envers clients et leads en termes d'expérience utilisateur et d'engagement. Un travail sur sa cohérence et sa pertinence avec la version print doit être entrepris et l'utilisateur du site sera nécessairement placé au centre de la réflexion. Les chartes graphiques web de certaines grandes marques sont de très bons exemples. A quels enjeux une charte graphique web doit répondre ? Qui sont les (très) bons élèves ?

Les enjeux stratégiques d'une charte graphique web 

Souvent évoqué lors de la refonte d'un site, concevoir et mettre au point une charte graphique web impactante, engageante et différenciante ne peut se faire qu'en s'attachant à relever trois défis majeurs, trois enjeux stratégiques :

• Servir les intérêts de la marque en termes de qualité d'image
• Servir les intérêts des utilisateurs en termes de confort de navigation, de prise d'informations
• S'assurer d'une cohérence totale avec tous les autres supports de communication de la marque

Les éléments de la charte graphique d'un site web

La charte graphique d'un site web est donc en ceci primordiale qu'elle permet d'un côté d'être cohérent dans sa communication et de l'autre de travailler à la bonne qualité de son image. Elle assoit la crédibilité d'une entreprise, donne des repères aux visiteurs, facilite la prise d'informations.

La charte graphique d'un site se compose de plusieurs éléments essentiels : le logo, les couleurs, la typographie, les icônes mais aussi les images/photos/illustrations et dans certains cas les boutons de navigation ou encore l'agencement des blocs de contenus.

Le logo

Le logo de l'entreprise doit être parfaitement intégré au site web, de la même manière qu'il figure sur tous les autres documents et supports de comm' : enseigne, factures, devis, cartes de visites, plaquette... Il s'agit de l'élément central de l'identité visuelle, aussi la charte web doit-elle définir avec précision ses proportions, sa place exacte sur le site ainsi que ses dimensions.

La typo

La police d'écriture du site web joue également un rôle majeur dans la communication visuelle car une typo Georgia par exemple n'aura pas la même signification qu'une typo Calibri ou Times New Roman. La charte la définit tout en s'assurant bien entendu qu'elle reste en accord avec les autres supports de communication.

Les couleurs

La taille de la typo variera en fonction des titres, sous-titres et corps de texte et il est également possible de jouer sur deux typo différentes maximum afin de dynamiser l'ensemble.

Le choix des couleurs permet de transmettre des messages différents aux visiteurs du site, en fonction du cœur de métier de l'entreprise, en fonction de son positionnement : dynamique, tonique, technologique, consumer friendly, élégant, doux, sobre, accrocheur... les possibilités sont illimitées ! Afin de maximiser l'impact des couleurs, leur nombre doit être limité à 4 voire 5 maximum. Trois ou quatre couleurs pour un site sont ainsi préférables afin de faciliter la mémorisation. Les icônes

Les icônes

Ils ne sont pas à négliger, loin de là car ces petits éléments visuels parlent aux visiteurs d'un site. L'icône "accueil" est connue du plus grand nombre comme d'autres d'ailleurs : Facebook, Twitter, LinkedIn, €, Paypal, "panier", "rechercher"... Une bonne méthode consiste à s'adresser à un seul prestataire pour s'assurer que l'ensemble des icônes soient (encore une fois) cohérents entre eux !

Les images

Les photos, images et autres illustrations insérés sur un site mettent en valeur un produit, valorisent l'entreprise et ses collaborateurs. Les choisir avec soin aura donc un impact positif pour la marque envers sa cible. Car une image peut dire beaucoup ! Header, footer, page produit, page contact, page présentation entreprise, équipe... une charte graphique de site web réussie prévoit une utilisation pertinente des images en fonction de ce que souhaite communiquer la marque.

Les bons exemples de charte graphique web

Le site web de l'Aéroport de Paris et du groupe Saint-Gobain sont d'excellents exemples de cha rtes graphiques qui répondent parfaitement à ces enjeux majeurs.

Opérant chacun sur des secteurs d'activité très distincts, les deux marques ont toutefois en commun d'avoir su déployer des chartes graphiques web qui sont à la fois épurées, claires et qui vont à l'essentiel. L'impact en termes de communication est excellent, l'image de marque est forte.

Des chartes qui font par ailleurs la part belle au confort d'utilisation, à une prise d'information particulièrement évidente et aisée, à une navigation immersive. L'expérience d'utilisateur y est de fait très bonne voire même excellente, et a donné le ton pour la conception de la charte. Une charte qui a été pensée selon les nouveaux usages du web notamment en termes de promotion des comptes réseaux sociaux de deux entités.

Enfin, l'identité de marque est dans un cas comme dans l'autre valorisée à son maximum, le logo étant mis en scène de manière idéale, en étant soit très présent pour l'un (Aéroport de Paris) soit plus discret pour Saint-Gobain mais pourtant très identifiable. 

La charte graphique de votre site web doit ainsi s'attacher à répondre aux enjeux essentiels actuels : placer l'utilisateur au centre de la réflexion, servir vos intérêts en vous positionnant clairement et en travaillant à la qualité de votre image.