Tous les projets du “Monde”

Le Monde

2012
refonte du site web

Le tour du “monde”
en 60 jours

En 2012, “Le Monde” décide de revoir complètement le design et les fondations techniques de son site. Une volonté : rénover la marque sur le Web et proposer une expérience nouvelle et cohérente sur une multitude de supports. Un projet réalisé en un temps record.

Contexte

Créé en 1944, “Le Monde” est le quotidien de référence de la presse française. Son site Web est l’un des plus fréquenté de France avec 10 millions de visiteurs uniques par mois.

En 2009, à la demande de son équipe Produit, je rejoins le Monde interactif afin d’assurer le lead design des projets numériques et mettre en place le studio graphique digital du quotidien.

En 2011, la nouvelle direction du groupe décide de lancer une nouvelle formule du journal et de l’accompagner d’une profonde refonte éditoriale et graphique du site LeMonde.fr.

Parmi les éléments du brief initial :

Le nouveau site devra exprimer le renouveau du titre, mettre en avant un nouvel outil “Le live”, la production – en forte hausse – de vidéos et l'enrichissement de toutes les rubriques, notamment l'économie, la culture et l'international.

Julien Laroche-Joubert, Redacteur en chef adjoint

Au delà de cette mission, l’objectif était de proposer un nouveau système graphique simple et puissant qui permettrait de faire évoluer le site au fil des années et de déployer de manière cohérente, la marque “Le Monde” sur l’ensemble des plateformes digitales présentes et à venir : site, site mobile, application smartphone et tablette, web tv, wearable device.

Ce projet est le fruit d’une collaboration très étroite avec la très talentueuse Melina Zerbib.

État des lieux

Différents écrans de l’ancien site créé entre 2005 et 2009 par Jacqueline Yue

Un site vieillissant

Très innovant à son lancement, le site du Monde avait peu évolué. Construit sur des bases graphiques et techniques anciennes et hétéroclites, la refonte nécessitait une mise à plat complète de l’architecture du site : un travail titanesque pour la technique, l’équipe produit et le studio graphique. Le projet a été réalisé en un temps record, du 4 janvier 2012 au 19 mars 2012 (60 jours).

Concours interne : 4 équipes

Pour stimuler la créativité des équipes, faire émerger de nouvelles pistes, une compétition interne est organisée. 4 équipes sont créées et invitées à travailler sur une courte période – et en huis-clos.  

Voir les écrans du projet “Chic”

Le projet

Ce projet a nécessité la création et la production de plusieurs centaines de pages et d’éléments graphiques.
Vous trouverez ici une sélection d’écrans représentatifs de la refonte :

la une

La Une – point d’entrée du site – a fait l’objet d’un travail complexe et méticuleux.
Objectifs de cette page : offrir une vision synthétique et hiérarchisée de l’actualité du moment et – aussi (presque paradoxalement) – présenter toute la richesse de l’offre du Monde.
Contrainte supplémentaire : offrir à la rédaction des outils d’édition puissants afin de faire évoluer la Une rapidement au fil de l’actualité ou de l’heure de la journée.

La Une “générique”

Cette page se divise en 2 parties : un bloc principal d’actualités hiérarchisés suivi d’une immense “colonne vertébrale” composée d’une multitude de bloc thématique.  

La “Colonne vertébrale”
et la gestion des blocs thématiques de Une  

La redaction dispose d’un outil puissant d’édition et d’organisation des blocs thématiques de Une.
Celui-ci permet de choisir un type de bloc (nombre et taille d’image), une thématique et son positionnement dans la “colonne vertébrale”. Cette mise en forme évolue au fil de l’actualité ou selon l’heure de la journée.

Un site mobile ultra rapide

Le site mobile – initialement en dehors du périmètre de la refonte – a été réalisé en 3 jours par le développeur Greg Bergé. Ultra-rapide, cette version light du site est devenue une source non-négligeable de trafic pour Le Monde.

La Une “événementielle”

De manière exceptionnelle, la rédaction a la possibilité de “casser” la Une afin de réagir à une actualité exceptionnelle (événement, catastrophe, etc). Un gabarit “large” a été mis au point à cette effet. Ci-dessous, la Une au soir des élections présidentielle de 2012.

Une grille pour tout le site

Pour une meilleure lisibilité et afin de faciliter la conception et l’intégration du site, une grille de 18 colonnes a été mise en place sur l’ensemble du site.

Rubriques & thématiques

L’un des objectifs majeurs de la refonte est de mettre en valeurs les rubriques du Monde. Un code couleur a donc été mis au point et réservé à chaque thématique. Chaque rubrique dispose de sa mini-une et de son logo sur le mode “M+rubrique”.

Rubrique Économie

Rubrique Vidéo

La vidéo est au cœur de la nouvelle stratégie du quotidien. Pour porter cet effort éditorial, une chaîne – aux codes graphiques spécifiques – a été créée. 

Article

La page article devait absolument être simplifiée et clarifiée. Une structure à 2 colonnes a été choisie. Pour cela, il a été nécessaire de travailler étroitement avec la régie publicitaire du Monde afin de réduire le “maillage publicitaire” de cette page. Résultat : pas d’habillage, ni de publicité dans le “flow” de l’article. Par ailleurs, un effort particulier a été porté sur le traitement typographique et la lisibilité.

L’outil “diaporama”

Le Bilan

CONCEPTION ET diffusion EN MOINS DE
60 JOURS

Réalisé en un temps record (60 jours de la conception à la production), la refonte a été un succès et a participé à élargir l’audience du Monde. Le jour du lancement le site reçoit de nombreux commentaires largement favorables. Extraits :

Les lecteurs heureux…

Félicitations pour ce travail de refonte d'ampleur. Franchement, on ne s'attendait pas à ça. LeMonde.fr est devenu le site internet français d'informations le plus agréable à lire. Bravo

Guest – 2012-03-19 – 08:24:25 

Très épurée cette nouvelle formule, j'aime beaucoup

GUEST – 2012-03-17 – 08:35:56 

Très belle présentation. Navigation souple et plaisante. Affichage rapide

Guest – 2012-03-19 – 08:41:54  

… et les autres

Quelques rares lecteurs expriment un jugement moins enthousiaste…

C'est quoi cette bouillie infame imposée en une nuit sans prévenir ? un moyen de désinformation pour couper la parole aux abonnés ? Ersatz Américain après Le Post ? Une vache n'y retrouverait pas son veau !!!!,

Guest – 2012-03-19 – 08:39:34  

Completement raté…

GUEST – 2012-03-17 08:33:34 

Les équipes du Monde compileront toutes ces remarques afin d’établir la feuille de route des évolutions futures.

Des chiffres éloquents

Au delà des retours qualitatifs, les chiffres de fréquentation témoignent d’un succès excpetionnel 

+101 %
de pages vues en plus (site Web et mobile)
675 millions de PV en 2014
vs 335 millions en 2012
+67% 
de visite
130 millions de visites en 2014
vs 77,5 millions en 2012
7,8
Millions de visiteurs uniques
sur Internet
Chiffre année 2014
+24% 
de mobinautes
1,878 million de mobinautes en 2014 
vs 1,511 million en 2012

Un design taillé pour la performance

+ 3,5 MILLIARDS
de pages affichées  (site Web & mobile ) depuis 2012

Le site du Monde est l’un des plus visités de France. Ce trafic considérable (et coûteux pour l’éditeur) nécessite de mettre en place des réponses techniques appropriées. Un design inadapté aurait de lourdes conséquences sur les performances du site et notamment son temps de chargement. Sous l’impulsion des équipes techniques (notamment Ismaël Hery), nous avons adapté notre travail et participé au succès du Monde.fr

  • Refonte site “Le Monde”
  • Responsable du projet
    Edouard Andrieu
    Responsables éditoriaux
    Alexis Delcambre, Julien Laroche-Joubert
    Responsable marketing
    Christine Letouche
    Responsable SEO
    Yidir Plantade
    Chefs de projet
    Johan Lerat, Audrey Williamson, Morgiane Achache
    Lead design
    Nicolas Queffélec
    Design graphique
    Melina Zerbib, Nicolas Queffélec avec l’assistance de Pascale Boudeville
    Communication graphique
    Frédérique Duboscq
    Responsables informatique
    Ismael Hery, Olivier Grange-Labat (CTO)
    Développement
    Marc Dassonneville, Greg Bergé, Jacques Billard, Jérémy Chambrion, Bayar Luuzan, Daniel Paterson, José-Hugues Pommier, Jean-Claude Théas, Ludovic Werwinski ainsi que les équipes “Études”, “Production” et “Plateforme”
    Intégration graphique
    Corinne Henry avec l’assistance de Daniel Paterson

projets associés