Tu pratiques l'eco web ?
Calcule ton empreinte carbone liée à ton usage du numérique et découvre les alternatives associées.
Hey, on est bientôt 1 500 ici, c’est complètement dingue. 🤯
Si tu prends du plaisir à lire Le Colis, fais-le moi savoir en réponse à ce mail ou avec un like sur le petit coeur juste au dessus !
Tu peux aussi me suggérer des sujets qui t’intéressent pour que j’en fasse une prochaine édition.
D’ailleurs, j’ai choisi la thématique du jour en fonction du post qui a suscité le plus d’engagement dans mon calendrier de l’après. Tu as deviné lequel ?
Bon, on arrive bientôt à la fin de ce petit challenge que je m’étais fixé avec +100 ressources à la clé et je peux t’annoncer que la BIG compilation partira dans le prochain Colis !
Scroll Stoppers de la semaine
Avant d'attaquer, voici une analyse des publicités pépites repérées par Coline, notre fabuleuse Directrice Artistique :
Cheerz: alors non ce n’est pas une invitation à ma fête d’anniversaire. Ici, la communication est axée sur le souvenir avec une mise en contexte réussie.
Pantone : Viva Magenta est annoncée comme étant LA couleur de l’année 2023, alors quoi de mieux que la voir portée pour lancer la tendance ?!
Qonto : La métaphore de la connexion est bien pensée, elle amène l’idée que tout va s’illuminer grâce à la mise en relation de nos différents outils perso.
Au quotidien, on a l’habitude d’entendre toujours les mêmes incitations à agir de manière responsable :
→ “Il faut couper le robinet sous la douche”
→ “Éteindre les lumières après son passage”
→ “Ne pas gaspiller la nourriture”…
Merci papa et maman.
Mais qu’en est-il de notre usage du numérique ? En sachant que ce secteur, omniprésent dans nos modes de vie, comptabilise une empreinte carbone qui ne cesse de s’alourdir.
Petite pensées à toutes les boîtes mails qui débordent autant qu’une poubelle sur une aire d’autoroute. 🥲
Houraaaa il existe l’eco-conception pour pallier à cette problématique !
En plus de cela, le mettre en pratique a souvent un intérêt business comme, par exemple, être mieux référencé dans une stratégie SEO.
C’est bénéfique pour toi et l’environnement alors qu’est-ce que tu attends pour t’y mettre ?
Les facteurs de pollution en chiffres 🚨
Eco-concevoir sans prise de tête 💚
Des références pour agir maintenant 🏃🏻♀️
Les facteurs de pollution en chiffres 🚨
Pour commencer, on va faire un petit tour d’horizon sur notre consommation numérique quotidienne à grande échelle.
L’avénement d’internet
→ 10% : part de l’électricité consommée par les data centers en France.
→ 2020 : première année ou la pollution digitale a dépassée celle de l’aviation civile.
→ 4% : part des émissions de CO2 mondiales imputable à la pollution digitale. Dans cinq ans, ce sera 6%.
→ 7g : émission de CO2 produite par une recherche Google.
L’emailing
30 emails supprimés → consommation d’une ampoule allumée pendant 24h.
60 % → pourcentage de mails jamais ouverts.
33 emails → nombre moyen d’emails envoyés par jour pour un salarié (chiffre basé sur une entreprise de moins de 100 personnes en France). À savoir que 33 mails de 1 Mo envoyés à deux destinataires par jour produirait 180 kg de CO2 par an, soit l’équivalent de 1 000 km parcourus en voiture.
19 g → émission CO2 d’un mail avec une pièce-jointe 1 Mo.
34 millions → nombre de mails envoyés par heure (sans compter les spams). Un chiffre qui correspond à l’équivalent de 14 tonnes de pétrole.
431 166 240 → nombre de kilos CO2 émis par heure à cause des mails.
(Source : Cleanfox, 2020)
Et tu peux aller sur le site My Impact pour connaître ton empreinte carbone numérique à titre personnel.
C’est un calculateur mis en place par l’Institut du Numérique Responsable qui invite à la prise de conscience collective. Tu lui indiques les outils que tu utilises et quelques données d’usage pour obtenir tes datas !
Eco-concevoir sans prise de tête 💚
On rentre dans le vif du sujet, mais en douceur je te rassure, le but n’est pas de changer radicalement tes habitudes mais de t’orienter vers des décisions simples et éveillées.
Pour ça, j’ai plusieurs tips autour de l’éco-conception web.
Ils te seront utiles pour toutes les activités liées à l’économie numérique : édition de sites web, publication d’articles de blog, envoi de mails et de newsletters, etc.
Objectif : créer des médias plus légers, pour réduire le stockage sur serveur et la bande passante lors de l’affichage sur écran.
Images
En jouant sur quelques paramètres, tu peux obtenir des images jusqu’à 90% plus légères à tout point de vue (consommation d’électricité / chargement de page / stockage) !
Résolution : + l’image est grande et + son poids est important.
Il est donc important de se poser la question de la taille pour chaque image.
Par exemple, un petit pictogramme n’a pas besoin d’être importé en résolution 1920 × 1080 px, mais peut-être que 300 x 300 px pourrait être suffisant !
Format : À résolution équivalente, tous les formats n'ont pas le même poids.
Et à ce petit jeu, notre grand gagnant est le format webp. Créé récemment par Google, il permet d'obtenir des fichiers jusqu'à 30% plus légers !
Un autre format intéressant est le SVG mais je te déconseille de l’appliquer pour des photos. Il est plutôt approprié pour des illustrations (texte, schémas, dessins numériques) dont il réduit considérablement le poids.
Compression : cette technique consiste à réduire la qualité d’une image sans pour autant toucher à sa résolution. Évidemment, il faut y aller avec parcimonie car une réduction trop forte risque d'être visible à l'oeil nu (un visuel pixelisé n’est pas gage de qualité).
Bingo ! Il existe un outil tout en un qui permet de modifier ces trois leviers : Squoosh.
Vidéos
Logiquement, les paramètres à maîtriser avec les vidéos sont équivalent à ceux des photos. À quelques détails près…
Résolution : réduire la résolution d’une vidéo est le premier paramètre à manipuler pour limiter son poids.
Tu auras rarement besoin d’une vidéo en 4k sur ton site web. Les résolutions 1080p (qualifiée de HD par Youtube) ou 720p sont souvent suffisantes.
Tu peux modifier cette résolution dès l’export si tu édites toi même la vidéo, ou en utilisant l’un des nombreux outils gratuits à cet effet, comme Resize-video.
Compression : comme pour les photos, la compression vidéo consiste à réduire la qualité de l’image sans modifier sa résolution pour la rendre plus légère.
Il y a là aussi un arbitrage à faire entre le poids que tu veux économiser et la qualité de la vidéo en évitant de la détériorer.
Pour ce faire, l’outil fétiche que j’utilise est Veed.io !
Format : la dernière étape est de choisir le bon format en t’assurant qu’il soit bien lu par les différents navigateurs web.
Et notre champion, c’est le .mp4.
Penses donc à exporter tes vidéos dans ce format si c’est toi qui les édites ou à les convertir si tu les as récupérées dans un autre format.
Mon outil pref (encore une fois) est Veed.io qui a aussi une fonctionnalité convertisseur.
Couleurs
Certaines couleurs peuvent entraîner une sur-consommation d’énergie en fonction des types d’écrans.
Pour lutter contre ça, tu peux favoriser dans l’élaboration de tes designs des couleurs qui consomment moins d’énergie.
Ci-dessous, le classement de la couleur la moins énergivore à la plus énergivore :
Noir < Vert < Jaune < Rouge < Rose < Violet < Bleu < Blanc
Typos
Les polices d’écriture peuvent elles aussi jouer un rôle dans l’éco-conception !
Quand tu parcours un site web, ton navigateur se retrouve face à un dilemme :
Soit il a déjà les polices du site en stock qu’il peut afficher directement.
Soit il ne les a pas, alors il va devoir les télécharger.
Donc il est d’usage de privilégier les polices déjà installées sur les terminaux de tes visiteurs.
Des références pour agir maintenant 🏃🏻♀️
J’ai encore plein d’autres ressources inspirantes à te partager pour t’aider à progresser dans l’éco-conception.
D’abord, je te présente Eco Index. C’est comme l’éco-score que tu peux voir sur les produits alimentaires dans la grande distribution, mais en version site-web.
J’ai essayé avec le site Oscar Black, ça donne ça :
Aïe, comme tu peux le voir, on a du boulot !
Heureusement, notre nouveau site éco-conçu par mes soins va débarquer dans quelques semaines (je t’en reparle bientôt 🤫).
Dernièrement, j’ai testé l’extension chrome SVG Screenshot qui te permet de faire des captures d’écran en SVG. Elle est parfaite si tu dois faire un screen qui ne contient pas d’images mais que du texte, des formes ou des couleurs.
Ainsi tu auras une superbe qualité d’image tout en ayant un poids très faible (jusqu’à 75% de réduction) car les éléments graphiques seront vectorisés.
Créateurs
Océane Puech est une spécialiste du bilan carbone et de la RSE, elle accompagne les entreprises dans leur transition écologique. Ses publications Linkedin sont très instructives et elle a récemment organisé un webinar sur l’éco-conception. Alors abonne-toi pour ne pas louper ses prochains conseils !
Guillaume de Soussa est un expert de l’ecoprint qui travaille dans le milieu de l’imprimerie. Outre les sujets liés à ce secteur, il aborde un certain nombre de questions liées à la communication responsable. Un must have pour ton feed.
Ne pars pas si vite !
Si tu es de nature curieuse, j'aimerais te partager d'autres ressources actionnables pour t'accompagner dans ton expertise e-commerce :
📚 +15 outils (guides, vidéos, templates, tableaux…) sur la Bible de l'ads.
🎁 Reçois une analyse 360° de ta stratégie digitale via un audit gratuit.
À ne pas louper
Lors de notre dernier webinar, on a présenté les marronniers de l’ads qui vont rythmer l’année 2023 avec nos recommandations pour sortir du lot !
Je te partage le replay avec nos tips pour prévoir le budget annuel de ta prochaine stratégie publicitaire social media.