Ingrédients de base

Le nouveau système graphique repose sur l’utilisation d’une série d’ingrédients constitutive de l’identité visuelle du Monde : logotype, typographie, couleurs, iconographie. Une charte d’utilisation (ou recette) fixe les règles d’utilisations de ces ingrédients.

Logotype

Logotype remanié

À l’occasion de la refonte, le logo du Monde.fr a été subtilement remanié afin d’en améliorer la lisibilité sur écran (notamment en petite taille) et réduire l’importance visuelle du .fr (l’utilisation du domaine, peut-être utile aux débuts du Web, vient concurrencer la marque).

La couleur des filets de contour des lettres gothiques a été atténuée (teinte et opacité) afin de permettre une lisibilité optimale sur écran même en cas de fortes réductions d’échelle ; Les formes du .fr ont été modernisée pour mieux s’harmoniser avec les lettres gothiques ; La teinte du .fr a été atténué par rapport au logo Le Monde afin de valoriser la marque globale.

‍

Capitale M

La capitale M était déjà utilisé sur les réseaux sociaux et les applications mobiles. Elle devient un élément essentiel de la nouvelle identité.

Ses proportions ont été modifiées, ainsi que l’alignements optiques du sigle, la gestion des marges et la zone de protection.

Typographie identitaire et éditoriale

La nouvelle identité s’enrichit d’une nouvelle gamme de police : TheSerif de Lucas de Groot. Cette police est une composante fondamentale de la nouvelle charte graphique. Elle a une fonction identitaire et son usage est strictement réservé au contenu éditorial. TheSerif a été choisi comme contrepoint plus nerveux et moins classique à la police du journal : TheAntiqua

The Serif

L’ensemble des variations de la TheSerif (16 polices) sont disponibles dans le cadre de la nouvelle charte. Dans un contexte comme le Web – où le nombre de police doit être restreint, la TheSerif Bold est à privilégier.

‍

Typographie identitaire secondaire

Fette 1451

Pour accompagner la typographie identitaire et répondre à d’autres problématiques de mise en forme, nous utilisons la Fette 1451. Très largement inspiré de la DIN 1451, conçu pour la signalétique routière, son dessin rationnel, lui confère une extrême lisibilité - même en petit corps. Très étroite, elle permet d’afficher des titres longs dans un espace limité.

Typographie de substitution

Helvetica/Arial

L’Helvetica (fallback Arial) est la police standard du site (websafe). Sa très faible expressivité, sa grande lisibilité est un gage de confort de lecture. Ces qualités la mettent au service de l’information. En cas d’indisponibilité sur la plate-forme cible (OS, Web, mobile, tv, etc.), il est recommandé de choisir une linéale de substitution, l’Arial faisant parfaitement l’affaire. Sur Windows 8, nous utilisons la Segoe et sur Android, la Roboto Sans.

Les couleurs

13 couleurs identitaires et éditoriales

En 2012, la palette du site s’enrichie d’une gamme de couleur “éditoriale”. Ces couleurs ont pour fonctions d’identifier et de mettre en valeurs les rubriques principales du site. C’est un élement essentielle de la nouvelle identité

‍

Gris d’interface

La nouvelle charte instaure une gamme de 18 gris légèrement bleutés. C’est dans cette gamme restreinte que l’on viendra piocher pour créer l’interface du site.

Ingrédients complémentaires

D’autres ingrédients ont été créés pour accompagner les éléments de base de la charte : icônes, indicateurs, etc. La liste s’enrichit au fil des besoins éditoriaux. En voici quelques exemples :

Icônes – “type d’élément”

Les pictogrammes issus de la collection Helveticons ont été choisis pour leur simplicité et leur clarté.
Ils ont été redessinés pour s’adapter aux différentes échelles et cas d’utilisation. Les icônes « type d’éléments » permettent d’identifier le type de média présenté : portfolio, infographie, vidéo, blog, live.

Chaque icône existe en 4 tailles et 4 dessins différents.

Icônes – réseaux sociaux

Indicateurs financiers

‍

Le système

La nouvelle identité du Monde digital repose sur un dialogue entre 3 ingrédients graphiques principaux :
le nouveau logotype (ou son alternative « capitale M »), la typographie TheSerif et les couleurs de la nouvelle palette. Le système fonctionne avec l’association de 2 ingrédients au minimum.

Exemples d’application

Signalétique de rubrique éditoriale

La refonte a introduit un nouveau système graphique visant à singulariser les rubriques.
La capitale M est associée au titre la rubrique. Le nom est composé en TheSerif, avec la couleur adéquate.

“Capitale M”+ Nom de rubrique + couleur de rubrique

Exemples

Communication et réseaux sociaux

Réseaux sociaux, auto promotion, annonce presse, lettre d’information, Le Monde communique sur une multitude de plateformes. Il est donc essentiel de maintenir une cohérence et un lien entre toutes ces initiatives. Voici quelques exemples de déclinaisons de la charte :

Avatar réseaux sociaux

La présence du Monde sur les réseaux sociaux est en croissance constante. Les contextes sont différents mais la marque doit rayonner en cohérence. Nous avons donc créé une matrice qui permet à la rédaction d’investir tous les recoins du net.

Communication

Le design des communications du Monde.fr est assuré depuis 2012 par Frédérique Duboscq accompagnée de Pascale Boudeville (jusqu’en 2013) et Charlotte Paroïelle (depuis 2013). Ci-dessous, quelques exemples de mise en situation de la charte.

Newsletter