Dans le cadre de mes activités professionnelles pour un hébergeur de données et opérateur de réseau, j’ai conçu un mini-portail web responsive (Responsive Web Design Mobile First) dédié à l'explication des principales métriques utilisées dans les datacenters, notamment le PUE (Power Usage Effectiveness), le CUE (Carbon Usage Effectiveness) et le WUE (Water Usage Effectiveness).
Le projet en détail :
Le portail a été développé avec une attention toute particulière afin de soigner au maximum son empreinte carbone tout en garantissant une expérience utilisateur optimale sous les différents types d'écrans.
Les templates conçus en HTML5 et CSS3 ont été codés pour réduire au maximum la charge environnementale du site web. La page d'accueil, ainsi que les pages dédiées au PUE, CUE et WUE, atteignent un score Lighthouse quasi-parfait sur les critères de performance, accessibilité, meilleures pratiques et SEO. Une ultime itération, restée malheureusement en suspens, aurait permis d'atteindre le score parfait de 100 sur tous les critères en ajustant un élément mineur de l'interface.
Toujours pour limiter l'impact environnemental, le site intègre un lien de contact redirigeant directement vers le site principal de l'entreprise évitant ainsi l'hébergement d'éléments redondants.
L'unique page de métriques disponibles sur les quatre datacenters listés repose sur le logiciel Power Dashboard de Facebook sous licence BSD (Berkeley Software Distribution License).
Comme cette solution n'était pas responsive et la demande pressée, j'ai adapté le viewport HTML et les CSS pour offrir un simple design adaptatif selon la taille de l'écran.
Extrait du Dashboard des métriques d'un datacenter
Alliant expertise technique et engagement écoresponsable tout en mettant en avant les métriques essentielles des datacenters, ce projet obtient un score ecoIndex de A et un score Website Carbon Calculator de A+.
Optimisé pour le référencement, ce projet illustre à la fois le principe d'éco-conception web et celui de la visibilité optimale sur des sujets clefs tels que le PUE, le CUE et le WUE.
Réalisation : 2024
Contraintes : éco-conception pour répondre au principe numérique responsable, optimisation SEO, uniformisation graphique, adaptableaux différents devices
Conception : HTML5, CSS3, Javascript, JSON, PHP
À découvrir également :
