La formidable épopée de notre site écoconçu, avec l’agence la Coopérative des Internets, commence en septembre 2021 lorsque nous enclenchons officiellement le projet spigraph devient systhen*. Ce changement de nom a été accompagné de changements stratégiques forts : un nouveau positionnement sur le marché, une nouvelle offre d’intégration de logiciels, venant compléter notre offre historique, une nouvelle façon de communiquer et… un nouveau site internet vitrine, élément incontournable pour un acteur de la transformation digitale et essentiel dans notre monde ultra-connecté.
*Si vous souhaitez clarifier ce point ou simplement redécouvrir ce lancement haut en couleurs, voici le communiqué de presse et la vidéo du lancement officiel en janvier 2022 🥳.
Mais, chez systhen nous ne voulions pas construire un énième site internet qui viendrait s’ajouter aux milliers de pages présentes sur notre moteur de recherche chouchou. Nous voulions construire un projet de site internet en accord avec nos enjeux d’entreprise et surtout : en accord avec les enjeux d’engagement durable. Là, vous allez nous dire « Engagement durable ? Mais pourquoi ? Un site internet ça ne pollue pas ! C’est immatériel » … Face à cette idée reçue qui a encore la vie dure, voici quelques résultats d’une étude ARCEP et Ademe, 2023 :
Si le numérique contribue sous bien des aspects à la mise en œuvre de la transition écologique, son développement engendre également des impacts, qu’il est important de mieux connaître. Selon une étude ARCEP et Ademe de 2023, les émissions de gaz à effet de serre dues aux usages numériques des Français pourraient être multipliées par près de trois d’ici à 2050 si aucune action n’est prise d’ici là. L’empreinte carbone du numérique en France augmenterait de 187 % en 2050. Elle était de 17 millions de tonnes équivalent CO2 en 2020, soit 2,5 % de l’empreinte nationale.
« Avant même que nous n’utilisions notre smartphone, téléviseur ou ordinateur flambant neuf, il a déjà produit près de 80 % des émissions de gaz à effet de serre qu’il émettra durant sa (trop courte) vie. » Ademe
« On peut penser que le numérique ce n’est que de l’immatériel mais bien au contraire. Le numérique c’est avant tout des infrastructures, des câbles qui parcourent les océans, des datacenters, des ordinateurs, des smartphones, etc. La principale cause de la pollution par le numérique c’est la construction de ces infrastructures. L’enjeu est donc de rallonger la durée de vie de tous ces équipements et cela passe notamment par une forme de sobriété au niveau des services numériques proposés pour éviter de sursolliciter ces équipements. » Nicolas Bles, la Coopérative des Internets
Petit rappel : comment un site fonctionne ?
Un site internet génère du carbone. Et oui, pour afficher une page d’un site il faut faire appel à des données qui sont stockées sur un serveur… Serveur qui consomme de l’énergie pour fonctionner. Plus une page possède des photos, des animations ou des vidéos et plus elle va renvoyer vers ce serveur qui va donc consommer plus d’énergie.
Notre objectif chez systhen était donc de limiter au maximum cette empreinte carbone en construisant un site écoconçu, réfléchi et optimisé en limitant les données qui transitent sur le réseau. Nous nous sommes donc faits accompagnés de l’agence lyonnaise spécialisée dans l’écoconception de sites internet : La Coopérative des Internets (la Coopi pour les intimes).
« En résumé : le principe de l’écoconception est d’afficher des pages les moins gourmandes et les moins lourdes possibles au niveau des données pour générer le moins de CO2 possible. S‘intégrer dans cette démarche était une volonté forte et exprimée par l’ensemble des parties prenantes chez systhen. » L’équipe Marketing
Petit rappel : le numérique responsable et la loi
Le numérique responsable est aussi au cœur de l’actualité. Aujourd’hui cette notion s’intègre de plus en plus dans les démarches RSE des entreprises car, nous le voyons au quotidien, chacun à notre niveau, nous prenons conscience de notre impact. Mais au delà de cette prise de conscience : la loi avance sur le sujet du numérique plus responsable pour sensibiliser le plus grand nombre.
Par exemple, la loi REEN « Réduction de l’Empreinte Environnementale du Numérique en France », adoptée en novembre 2023, vise à responsabiliser tous les acteurs du numérique, dont les acteurs publics, sur le sujet de la pollution engendrée par le numérique. Cette loi introduit d’ailleurs, pour les communes de plus de 50 000 habitants, qu’au plus tard le 1er janvier 2025, elles devront présenter une stratégie numérique responsable pour leur ville.
Le texte recense 5 grands objectifs :
L’écoconception : aussi un enjeu inclusif et de satisfaction
Pour systhen, l’écoconception de notre site internet nous a permis de répondre à deux enjeux, en plus de celui autour de notre sobriété énergétique.
Enjeux n°1 : notre groupe est présent en France, au Maghreb (Algérie, Maroc et Tunisie) et en Afrique de l’Ouest. Les infrastructures et l’accès à internet ne sont pas les mêmes qu’en France, il était donc primordial pour nous de pouvoir proposer un site intuitif accessible partout et pour tous. La notion, émise plus haut par Nicolas Bles, de rallonger la durée de vie de chaque équipement en étant plus sobres énergiquement prend tout son sens pour systhen ! Notre volonté était que le site soit accessible partout et pour tous qu’importe l’accès à internet, la génération d’ordinateur ou de smartphone. L’éco-conception s’est donc avéré pour systhen une nécessité technique.
Enjeux n°2 : au delà de son aspect plus écoresponsable, un site écoconçu accroit aussi votre expérience utilisateur ! Lorsque vous naviguez sur les différentes pages de notre site, avez-vous constater l’instantanéité de chargement ? En limitant le poids des pages on maximise la rapidité d’affichage pour une satisfaction client totale. D’ailleurs, Google a bien compris les attentes des internautes et valorisent aujourd’hui les sites internet aux meilleures performances d’affichage dans son référencement naturel. (Et si ça vous permet de nous retrouver encore plus vite, vous nous en voyez ravis 😍).
« L’idée d’écoconcevoir un site c’est aussi faire la bascule, revenir à l’essentiel de son offre à communiquer. On travaille la sobriété des fonctionnalités que l’on propose pour éviter de participer à une forme d’obsolescence programmée. » Nicolas Bles
Les étapes clés dans la construction de notre site
« Un site sobre, est-ce que c’est un site moche ? Et bien malgré ce qu’on entend, la réponse est : non ! Notre volonté est de pouvoir faire des site écoconçus beaux à l’usage et qui gardent le meilleur des pratiques contemporaines à disposition. » Nicolas Bles
Etape 1 : la sensibilisation au lancement de projet
La Coopérative des Internets a impliqué toute l’équipe porteuse du projet chez systhen. Mais au delà de l’équipe de production, l’écoconception d’un site se décide en intégrant aussi l’équipe dirigeante. En effet, faire de l’écoconception c’est aussi faire le choix de concessions car certaines pratiques liées au « business pur » ne sont pas compatibles avec un site plus léger que la moyenne. Durant cette première étape, l’équipe de la « Coopi », nous a donné toutes les clés pour nous rendre compte de l’impact de l’éco-conception sur notre activité avec un plan de formation, un atelier d’initiation au numérique responsable, la nomination d’un référent du numérique responsable chez systhen et la construction d’une fresque du climat.
« Pour l’éco-conception, il n’y pas de solution magique ni de levier miracle où à la fin on installe juste un plug-in et le site est allégé. Ce sont toutes les petites attentions et chaque étape du projet qui permettent d’avoir un site écoconçu. » Nicolas Bles
Etape 2 : état des lieux du plan d’actions et des objectifs
Auditer notre offre et nos services était essentiel pour définir nos points forts en terme d’actions responsables et nos points un peu faibles, c’est à dire les éléments sur notre site que nous voulions absolument affichés mais qui alourdissaient le site. Nous avons également mis en avant des indicateurs clés : poids des pages souhaités, nombres d’images et de vidéos, taux de rebond voulu, etc. afin d’avoir des indicateurs clés auxquels se référer et suivre comme ligne de conduite.
L’éco-conception nous a permis de répondre à la question : que souhaitons-nous vraiment présenter à notre écosysthen ? Cette démarche nous a permis de faire un point sur les services et les offres essentielles, de donner un ordre de priorisation pour ne proposer à l’utilisateur que ce dont il a vraiment besoin, sans en faire trop. L’éco-conception nous a offert une nouvelle vision sur notre offre et un recentrage clair sur notre cœur de métier.
« Il faut voir l’éco-conception comme un curseur que l’on place sur une échelle et qui va s’adapter aux enjeux, au contexte de chaque entreprise. Afficher des images peut être une contrainte, non négociable, pour un site marchant. Notre but est de jouer avec tous les autres leviers de l’écoconception à disposition pour équilibrer la sobriété et avoir un service, malgré tout, le plus léger possible. » Nicolas Bles
Etape 3 : phase de conception
Durant cette étape, nous avons, tels de véritables architectes, structuré notre site et son contenu. Toute l’équipe systhen a d’ailleurs adoré cette partie car l’approche utilisateur est beaucoup plus poussée dans l’écoconception et nous nous sommes vraiment mis dans la peau de nos visiteurs : qu’avons-nous besoin de voir, comment doit être structurée notre offre pour qu’elle soit compréhensible, etc ?
« 80% des gains de l’écoconception se font en dehors du code : c’est le template de page ou ce qu’on appelle la structure du site, qui doit être imaginé le plus léger possible et que l’on va ensuite intégrer, développer et designer. » Nicolas Bles
Etape 4 : graphisme & de développement
Rendre un site graphique en écoconception est un petit challenge car il faut réussir à jongler avec nos impératifs autour de notre offre, notre volonté de vous proposer un site agréable et intuitif et coller parfaitement à une démarche plus verte. Voici quelques exemples de notre cheminement autour du développement de notre site.
Les pages statiques :
Lorsque l’on fait de l’écoconception, on utilise au maximum des pages dites statiques : ce sont des pages en cache du côté serveur qui permettent de limiter au maximum la sollicitation des bases de données. Par exemple le fait d’avoir les derniers articles publiés sur la home page de votre site internet préféré empêche une mise en cache efficace de la page, actualise la page à chaque nouvelle connexion et donc : fait bien plus fonctionner les serveurs !
💡 Pour toutes les vidéos présentes sur le site de systhen par exemple, nous avons mis en place des images statiques, qui sont des captures écran de la vidéo, et c’est l’utilisateur, uniquement s’il est intéressé par la vidéo, qui va venir déclencher la recherche de données pour lancer la vidéo hébergée sur notre chaîne Youtube ! Nous pouvons ainsi vous proposer du contenu vidéo tout en conservant un bon niveau d’écoconception, pari réussi 🤩.
Les titres :
Le rythme de chaque page se fait par les aérations, les jeux d’alignement ou encore les typographies mais ce, toujours en statique.
« On ne peut pas parler d’écoconception sans parler de sur-mesure. Il faut vraiment éviter l’utilisation de « page builder » ou d’outils de création que l’on peut retrouver en ligne car ils embarquent beaucoup trop de codes de manière automatisée. » Nicolas Bles
💡 Les grands titres sur notre site systhen sont donc par exemple tous dans la typographie systhen pour coller à notre identité de marque et les corps de textes sont dans une typographie « système » intégrée dans tous les PC. Cela permet de limiter le téléchargement d’une typographie bien spécifique sur l’ensemble des textes, générant, vous l’avez deviné, bien moins de recherche de données vers les serveurs !
Les illustrations :
Chacune de nos illustrations sont au format SVG et non en format pixel (jpeg, png). Ce format nous permet d’utiliser sans contraintes nos illustrations, point essentiel de notre image, mais de manière très (très) légère. Pour mettre en avant nos collaborateurs par contre, nous utilisons des photos ! Pour éviter qu’elles ne soient trop lourdes, nous les gérons dans des cadres, ainsi nous avons une maîtrise totale de la taille de l’image.
💡 Attention, la Coopi nous rappelle de toujours bien réfléchir à la pertinence de ces photos et à leur intérêt pour le visiteur : il est essentiel de toujours garder en tête cette notion de priorisation des informations.
Etape 5 : choix techniques autour de l’hébergement et la maintenance
Les bonnes pratiques pour choisir son hébergeur :
Pour la Coopérative des Internets, il est essentiel de travailler avec des hébergeurs qui ont une démarche en cohérence avec la conception d’un service numérique plus durable. Tout un ensemble de critères doit être pris en considération lorsque l’on choisit son hébergeur : serveurs adiabatiques (refroidissement passif), proposant un plan de recyclage des équipements et de durée de vie des équipements, choix d’un hébergement adapté au trafic de son site, analyse de son PUE (Power Usage Effectiveness) : rapport qui permet de connaitre la quantité d’énergie qu’un datacenter peut consommer pour refroidir ses serveurs. Plus un PUE est proche de 1 et plus la performance du datacenter est bonne.
💡 Les serveurs hébergeant les services de systhen en lien avec la Coopérative des Internets, sont des serveurs de Datacampus immergés dans des bains d’huile minérale permettant une dissipation passive de la chaleur. Le refroidissement des Datacenters traditionnels nécessite de grandes quantités d’air climatisé, ce qui représente entre 30 et 40% de la consommation électrique totale. Datacampus, à Lyon, est le premier hébergeur en France à avoir déployé en production la technologie de refroidissement par immersion. Grâce à ce système innovant, il n’est plus nécessaire de surconsommer pour maintenir leurs serveurs à une température adéquate !
Les grands axes que l’on retient de l’écoconception de notre site
« Trois maître-mots guident la réflexion de l’écoconception :
la simplicité, la frugalité, la pertinence. » Nicolas Bles
1 : L’écoconception d’un site n’est pas plus longue qu’une conception classique car aujourd’hui les nouveaux enjeux durables sont clairement identifiés, nous sommes plus sensibilisés et nos objectifs ou nos concessions pour un site plus vert sont facilement identifiables.
2 : Le site systhen qui pèse, hors cookies, 370 kilooctet, est aujourd’hui 4 fois plus léger qu’un site classique (le poids moyen en 2022 d’un site classique est de 2,3MO) et offre un affichage instantané à nos visiteurs.
3 : Grâce à LightHouse, un système gratuit présent sur Google Chrome nous pouvons suivre les statistiques de performances de notre site. Ce système a été mis en place pour mesurer les indicateurs clés de performances d’un site, correspondant aux nouvelles règles de référencement des sites internet.
« Nous avons aujourd’hui des scores à la hauteur de notre volonté qui se traduit, au delà de la statistique, par une expérience fluide et agréable pour nos visiteurs ! » L’équipe marketing
La Coopérative des Internets est composée de quatre collaborateurs (développeurs et chefs de projets graphiques). Quatre experts du numérique qui ont décidé d’unir leurs forces pour réaliser des projets qui font sens !
Depuis 2020 l’agence écoconçoit et développe des dispositifs numériques sur-mesure à destination de coopératives, associations, OMG ou encore PME locale. Leur crédo est de mener des projets à impacts positifs avec un ancrage local fort et une démarche environnementale affirmée. En 2022, l’agence obtient même le label « engagé à Lyon » qui identifie les entreprises, commerces, artisans et associations qui répondent de manière pragmatique aux enjeux de la transition écologique et sociale, à travers une offre de produits et de services responsables 🥳 !
Découvrez nos engagements en détails
2023 et tous ses défis économiques et environnementaux nous rappellent la nécessité d’agir de manière responsable mais cette année nous rappelle surtout qu’il est essentiel de relier chacune de nos actions RSE à notre activité de distributeur et d’intégrateur ! Nous devons prioriser nos actions et concentrer nos efforts : nous ne pourrons jamais couvrir tous les sujets mais nous nous engageons à couvrir avec ambition et avis éclairés les sujets sur lesquels nous souhaitons progresser et là, est tout l’enjeu pour les années à venir.
