Site headless éco-conçu Défis Humanitaires par Internet 2000

Refonte de site web : Défis Humanitaires

Défis Humanitaires publie depuis des années des contenus de référence sur l’action humanitaire internationale. Le site accumulait un patrimoine éditorial exceptionnel, mais une architecture devenue inadaptée, des performances dégradées et une sécurité insuffisante freinaient son influence. Voici comment nous avons traité la refonte.

Le contexte

Un patrimoine éditorial devenu inaccessible

Défis Humanitaires documente et promeut l’action humanitaire internationale depuis des années. Le site a accumulé plus d’un millier d’articles de fond, signés par des chercheurs, des praticiens et des décideurs reconnus. Ses lecteurs sont des parlementaires, des journalistes, des chercheurs et des étudiants.

Le site avait été conçu comme un blog. Dix ans plus tard, l’architecture n’avait pas évolué, mais le contenu, lui, s’était considérablement développé. Un patrimoine éditorial exceptionnel, mais devenu difficile à explorer. La navigation ne permettait pas d’en prendre la mesure.

Des performances techniques dégradées

Les performances étaient dégradées : score F / 22 sur 100 à l’EcoIndex, 40 % au PageSpeed mobile. La page d’accueil pesait 6,788 Mo, générée par 209 requêtes et 848 éléments DOM. Le back-office ne permettait pas de modifier le site sans passer par un développeur.

Une sécurité insuffisante

Un WordPress exposé et peu maintenu représentait un risque réel pour une organisation traitant de sujets sensibles. Dans le contexte actuel, la multiplication des attaques était une crainte légitime.

Le référencement était faible, problème direct pour une association dont l’influence dépend de sa visibilité.

Notre intervention

Architecture headless et front statique

Nous avons opté pour une architecture headless : un front statique généré avec Silex, et un back-office WordPress restructuré en modules. Cette séparation répond aux problèmes de performance, de sécurité et d’autonomie éditoriale.

Moteur de recherche et navigation par tags

Pour rendre le contenu navigable, nous avons mis en place un système de tags et une fonctionnalité de recherche avancée. La navigation croisée s’appuie sur ce même système : un article mène naturellement vers d’autres contenus liés. La maquette repositionne clairement le site comme un média.

Refonte SEO technique et sémantique

Nous avons mené une refonte SEO complète, aussi bien technique que sémantique, pour donner au site les bases d’une meilleure visibilité organique. Les résultats en positionnement seront mesurés dans les prochains mois.

Accessibilité et éco-conception

Le site respecte les bonnes pratiques d’accessibilité web que nous appliquons en standard sur toutes nos productions. C’est un engagement que nous avons pris : faire bénéficier chaque client de l’expertise acquise avec ceux qui ont les moyens de financer des audits spécialisés, qu’un audit soit prévu ou non.

Hébergement

Le site est hébergé en Europe, sur des serveurs éco-responsables fonctionnant à 100 % avec des énergies renouvelables.

Les résultats

Performance et éco-conception

Le score PageSpeed mobile est passé de 40 % à 95 %, l’EcoIndex de 22/100 (F) à 84/100 (A). Le poids de la page d’accueil est passé de 6,788 Mo à 0,366 Mo, soit -95 %. Le nombre de requêtes est passé de 209 à 10, donc divisé par 20, et le nombre d’éléments dans le DOM est passé de 848 à 249, soit -70 %.

95%

PageSpeed Insight mobile

de F à A

EcoIndex

-95%

Poids de la page

÷20

Nombre de requêtes

-70%

Éléments dans le DOM

Les résultats en chiffres du nouveau site Défis Humanitaires

Sécurité

Surface d’attaque fortement réduite : le front statique n’expose aucune surface applicative. Le back-office WordPress est accessible uniquement depuis des IP autorisées.

Autonomie éditoriale

L’équipe peut désormais créer, modifier et réorganiser les contenus sans intervention technique.

Appel au don

L’appel au don a été retravaillé pour être visible sans être intrusif.