Sélectionner une page

On parle de plus en plus de numérique responsable et d’éco-conception sur le web.

⇒ Qu’est-ce-que l’éco-conception ?
⇒ En quoi cela consiste ?
⇒ Comment mettre en place des actions efficaces dès à présent sur ton site ?

C’est ce que nous allons voir dans cet article.

Qu’est que c’est un site éco-conçu et pourquoi en parler ?

En France, le concept d’éco-conception est apparu début des années 2000, via GreenIT, à cause de l’augmentation de la part du numérique dans les émissions de gaz à effet de serre.

Par exemple, en 2019, en France le numérique représentait 2 % des émissions de gaz à effet de serre ; si rien n’est fait, ce chiffre pourra atteindre 7 % en 2040, soit une part plus importante que le transport aérien français en 2020. Et ces chiffres ne concernent “que” l’échelle de la France…

Bon ok, et comment ça se passe en pratique ?

L’idée n’est donc pas de faire un concours du site le plus léger possible mais de mettre en place un site adapté à ton besoin, qui répond au parcours utilisateur de ton audience, qui soit durable ET qui consomme le moins de ressources possible.

Cette nuance est importante car la conception et la réalisation engendrent également l’utilisation de ressources. Refaire totalement ton site 2 ans plus tard car il n’est pas adapté n’est pas ce que l’on recherche avec cette démarche.

La 1re étape de la conception d’un site : la réflexion stratégique

Il s’agit de faire une étude de ton marché, de tes concurrents directs et indirects et de ton entreprise (ou de ton concept si tu es en phase de lancement/création) de façon à connaître l’environnement dans lequel tu évolues.

Grâce à ces connaissances tu vas pouvoir ensuite décrire plus précisément ta cible, son comportement, ses besoins et ses attentes. C’est le point de base pour réfléchir à la conception de ton site car cela te permet de définir les objectifs de ce dernier.

Exemple :

  • dois-tu maintenir ta notoriété, déjà acquise afin de rester leader de ton marché ?
  • te lances-tu et as-tu besoin de rassurer et d’inspirer confiance ?
  • cherches-tu à lancer un nouveau produit ou service ?
  • ton site internet devra répondre à ton objectif en tenant compte du contexte et tes attentes de ta cible.

2ème étape : définition des fonctionnalités et de l’arborescence de ton site web

Tu vas ensuite penser fonctionnalités et arborescence, c’est-à-dire le squelette de ton site… C’est là qu’intervient réellement pour la 1ère fois l’éco-conception. Il va falloir aller à l’essentiel. Un peu de concret pour illustrer à travers 2 exemples. 

Exemple 1 : tu veux une partie blog sur ton site pour prouver ton expertise à tes prospects/clients. D’accord. 

  • comment vas-tu promouvoir tes contenus ? 
  • d’où vient essentiellement ton audience ? 
  • des réseaux ou du trafic naturel de Google ?  
  • as-tu besoin que tes articles remontent dans certaines pages comme dans la home ou la page à propos ?  
  • si oui, as-besoin d’y faire figurer une photo ou comptes-tu sur l’accroche de ton titre uniquement ? C’est à prévoir car cela rend une page plus complexe et donc plus « lourde », ce qui n’est pas bon pour l’éco-conception.

Exemple 2 : tu souhaites mettre en place une Newsletter et que ton audience puisse s’abonner afin de tisser un lien avec cet dernier ? Ok, pourquoi ? 

  • as-tu un réel concept à offrir à ceux qui vont te confier leurs coordonnées. Concevoir une newsletter est plus polluant que la recevoir. cela va également nécessiter des ressources à ton site : as-tu un réel intérêt à concevoir cette newsletter ? 
  • pour l’effet escompté sur ta cible, ne peux-tu pas faire cela différemment ? 
  • si non, alors comment mettre en valeur cette fonctionnalité pour qu’elle gagne en efficacité (à savoir qu’un maximum de personne s’inscrit dessus).

Il est donc important de pouvoir prendre du recul à ce moment-là du projet. Travailler en équipe (en interne ou avec l’appui d’un professionnel du métier) est intéressant car cela va te permettre de définir tes réels besoins.

3ème étape : la conception graphique

Avoir un site éco-conçu ne veut pas dire qu’on doit faire un site moche !
Comme pour l’étape précédente on doit limiter le superflu et se concentrer sur les objectifs et le moyen le plus utile, durable et ayant le moins d’impact possible.
Si tu as déjà une charte graphique il va falloir s’interroger si celle-ci est éco-pensée. Si non, comment peux-tu l’adapter. La création d’un site est souvent une bonne occasion de revoir sa charte graphique : la moderniser ou l’adapter à l’éco-conception par exemple !

Attention ! Les règles d’éco-conception print et web vont avoir quelques différences. 

Les typographies : 

  • Une éco-font en print est une typo qui va consommer le moins d’encre possible (car les encres ça pollue, même les encres dites “végétales”)
  • Une éco-font en web c’est concrètement les polices standards que l’on trouve sur tous les ordinateurs (PC/Mac…). Pour t’en citer quelques-unes : il va s’agir d’Arial, Georgia, Courier New, Tahoma, Times New Roman, Verdana, Impact… Elles sont écologiques car ton navigateur va les trouver directement sur ton ordinateur et n’aura pas à les charger via ton site internet.

L’iconographie de ta charte :

Un deuxième élément de ta charte graphique à prendre en compte concerne les illustrations. Sur le web, le format svg est à privilégier au jpg ou au png. Pour le print on va privilégier les images en hautes définitions. 

Afin d’avoir une démarche globale, il sera nécessaire que ta charte graphique soit éco-pensée aussi bien pour le print et le web. Là aussi l’idée globale n’est pas d’être parfait mais d’être le moins impactant possible. Tu dois toujours penser durabilité et besoins pour toi et tes clients. 

Quelles sont les démarches que l’on peut mettre en place rapidement ?

1. Investie dans un hébergeur vert.  Personnellement je suis chez Infomaniak (suisse) et j’en suis très contente mais j’ai entendu beaucoup de bien aussi sur Ikoula (français)

2. Utilise plutôt le format audio des podcasts aux vidéos Youtube. Cela tombe bien en plus il s’agit d’un format qui devient de plus en plus incontournable et qui est utile pour le référencement !

3. Si tu utilises un CMS (type WordPress) installes un plugin de lazyload pour tes photos : cela permet de les charger lorsque ton utilisateur y accèdes et pas en amont. En plus cela te fera gagner en performance.

4. Privilégie le Mobile First. Souvent lorsqu’on adapte son site au format mobile, la version desktop est plus complète.
⇒ as-tu vraiment besoin de ces différences sur desktop puisqu’elles ne sont pas nécessaire sur tablette et mobile ?
⇒ si oui pourquoi ?

5. Investie dans un bon plugin de cache. Si la notion de cache ne te parle pas, le cache te permet de sauvegarder temporairement un site pour la prochaine fois où tu reviendras dessus. Ca lui fait gagner du temps de chargement et en plus il économise des ressources pour la planète. 

6. Minifie (=compresser) tes fichiers CSS et Javascript. Minifier te permet d’enlever notamment les espaces, les sauts de lignes et certains commentaires inutiles. Ces éléments sont utiles en phase de développement mais alourdissent ton site une fois ce dernier en production. 

7. Si tu fais télécharger des PDF via ton site, optimise les pour le web.

8. Si tu utilises un système de Newsletter utilise un système de double-opt in (pas encore obligatoire en France). En plus d’être plus éthique, tu enverras des mails qu’aux personnes intéressées et ayant validés leurs adresses mails. 

9. Résiste aux tentations d’effets et d’animations sur tes photos, tes blocs de textes… Pour certains ça va même les gêner dans leur lisibilité : n’oublie pas que 20% de la population française ne peut pas utiliser pleinement les outils du numérique du fait d’un handicap.

Enfin, si tu veux aller plus loin dans ta démarche éco-responsable  :

Du coup, en quoi ton site internet est bon pour ton entreprise ?

Comme nous avons vu plus haut, un site éco-conçu est un site léger et performant. Il est pensé ergonomique, accessibledurable et Mobile Friendly (à défaut d’être totalement Mobile First). Ces caractéristiques sont très importantes actuellement pour le SEO : cela te permettra un bon référencement sur les moteurs de recherches.

Enfin une meilleure lisibilité et un parcours utilisateurs qui va à l’essentiel va te permettre un taux de rebond plus faible.

Il y gagnera donc en visibilité !

 

Enfin, comme pour toute action, mesure ton site !

Je te propose plusieurs outils pour tester l’éco-conception de ton site :

  • GT Metrix : cet outil n’est pas un outil orienté éco-conception à proprement parler, mais il va te permettre de tester la performance de ce dernier. Attention : un site performant n’est pas forcément éco-conçu mais un site éco-conçu sera forcément plus performant. Il va également te donner une idée des axes d’amélioration à faire.
  • Ecoindex : ce site mesure l’éco-conception de la page de ton site dont tu as rentré l’url. Il est nécessaire de travailler l’éco-conception sur l’ensemble des pages de ton site. Il est plus intéressant d’avoir une note de B sur plusieurs pages que la note de A sur la home et avoir un D ou un E sur les autres.
  • Google Lighthouse : il s’agit d’un outil open source, pas spécifique à l’éco-conception, que tu installes sur ton moteur de recherche Chrome. Il te permet de mesurer tes pages, notamment l’accessibilité qui est à mon sens très intéressant (mais aussi la performance et le seo).
  • GreenIT-Analysis : également à installer sur ton moteur de recherche (dispo sur chrome et Firefox) cet outil te permet d’analyser la page de ton site, via le clic droit ” inspecter”, et te conseille pour améliorer son éco-conception.
  • Websitecarbon : sur le site directement, tu entres l’url de ta page et ce dernier te calcule son impact en terme d’émission de co2 par vue. Cet indicateur n’est pas le plus complet mais il est intéressant à regarder en complément des autres.

Soit indulgent avec tes résultats : n’oublie pas qu’il vaut mieux que ça soit fait mais pas parfait, que parfait et pas fait ! 🙂

Si tu n’as pas de site ou que ton site ne te permet pas de faire cela et tu as envie de changer, contacte-moi pour qu’on en discute, je t’accompagne dans la réalisation d’un site éco-conçu clé en main.

 

Sources : Le Guide de la Communication Responsable de l’ADEME ; Sustainable Web Design de A BOOK APART, le Guide l’éco-encrage de CITEO, éco-conception web : les 115 bonnes pratiques d’EYROLLES

Cet article t’a plu ? Retrouve-moi sur Instagram et Linkedin