L’éco-conception web, j’en parle tout le temps ou presque, c’est un sujet qui me tient à cœur. Je pense qu’il mériterait largement d’être beaucoup plus démocratisé. Parce que créer un site éco-conçu, ce n’est pas forcément plus compliqué que de créer un site normal, et ça a énormément d’avantages. Des avantages pour le monde au global, mais aussi pour les créateurices et propriétaires de sites. C’est vraiment un modèle gagnant-gagnant, en plus d’être un sujet important. C’est pour cela que j’ai décidé de vous livrer mon petit guide de l’éco-conception web.
Qu’est-ce que l’éco-conception web ?
L’éco-conception, c’est une démarche qui n’est pas du tout réservée au web. On peut éco-concevoir des objets, des vêtements, des livres, des bâtiments… Bref, tout ce qui se fabrique ou presque peut entrer dans une démarche d’éco-conception.
La définition officielle en France, c’est celle de l’ADEME :
« C’est une démarche préventive et innovante qui permet de réduire les impacts négatifs du produit, service ou bâtiment sur l’environnement sur l’ensemble de son cycle de vie (ACV), tout en conservant ses qualités d’usage. »
Donc il y a plusieurs choses importantes.
La première c’est qu’on parle de démarche « préventive », donc dans l’idéal, qui intervient au tout début du projet.
Ensuite, on parle de réduire les impacts négatifs sur l’environnement. Quand on parle d’environnement, on ne parle pas simplement de la planète et de la pollution, du climat, de l’écologie etc… On parle aussi de la personne humaine, donc on prend en compte les enjeux sociétaux. Par exemple, quand on fabrique des vêtements, l’éco-conception c’est aussi le fait de ne pas avoir recours au travail d’esclaves ou d’enfants. Et dans le cadre d’un site web, ça peut être l’accessibilité numérique (= le fait de rendre accessible le site aux personnes handicapées).
Après il y a la notion de cycle de vie, ça veut dire qu’on ne parle pas seulement de la création du produit ou du service, mais aussi de son utilisation par les personnes qui vont l’acheter, et aussi la fin de vie, donc éventuellement le reçyclage, etc…
Et enfin on parle de « conserver les qualités d’usage ». Donc l’éco-conception, ça veut pas dire tout retirer pour avoir le moins d’impact possible. Ça va plutôt être : rechercher l’équilibre entre ce dont les gens ont vraiment besoin et l’impact que cela a.
Alors vous voyez qu’eco-concevoir, c’est en fait beaucoup de réflexions et de remises en question. On change complètement la façon de penser « traditionnelle ».
À LIRE ENSUITE : POURQUOI CRÉER UN SITE ÉCO-RESPONSABLE ?
Les 3 piliers de l’éco-conception web
Ces 3 principes ont été posés par l’un des pionniers de l’éco-conception web, Frédéric Bordage, sur son site greenit.fr
Simplicité
La simplicité, c’est peut-être le principe le plus facile à comprendre, mais pour autant pas forcément le plus facile à appliquer.
Parce qu’on nous a souvent appris de « mauvaises habitudes », des trucs qu’on applique sans plus trop y penser alors que parfois, on pourrait faire plus simple.
En gros, le but, c’est d’éviter les trucs trop alambiqués, où il faut cliquer 14 fois avant d’arriver au résultat espéré, mais aussi d’en mettre trop, tellement que l’utilisateurice sera perdu·e.
Pour illustrer cela, Frédéric Bordage prend l’exemple de Google et Yahoo. La page de Google est extrêmement simple, alors que sur celle de Yahoo, toutes les fonctionnalités sont regroupées sur la même page.
Résultat, une requête Yahoo est 5 fois plus lourde qu’une requête Google*
*source : Éco-conception web, les 115 bonnes pratiques par Frédéric Bordage aux Éditions Eyrolles
Frugalité
La simplicité c’est une démarche qualitative. La frugalité, c’est plutôt quantitatif.
Il va s’agir ici de limiter les fonctionnalités et leur qualité au strict minimum.
Donc pour les fonctionnalités, c’est assez simple à comprendre, on ne met que le nécessaire sur le site. Par exemple, un truc que je vois souvent sur les sites et qui n’est pas forcément nécessaire, c’est la carte Google Maps. Alors oui, c’est souvent utile de dire aux gens où on se situe, mais on n’a pas forcément besoin de mettre la carte, on peut se contenter d’un lien vers cette carte, ou juste de notre adresse. Le simple fait de faire ce choix allégera le site et le rendre un peu plus éco-responsable.
Concernant la qualité, là ça demande un petit switch, par qu’on pense souvent qu’il faut mettre la meilleure qualité possible, par exemple pour une photo. L’éco-conception, c’est plutôt de se demander quelle est la qualité minimum nécessaire. En fait, à partir du moment où la photo n’est pas floue, où on voit clairement ce qu’il faut voir, ça suffit pour l’immense majorité des cas. Pas besoin d’être dans la sur-qualité, parce que cela à un coût en terme de consommation de ressources.
Pertinence
La pertinence, c’est une équation entre l’utilité, la rapidité et l’accessibilité.
Si quelque chose est utile, mais qu’on met trop longtemps à y accéder, on va aller le chercher ailleurs. Et donc tout le temps et les ressources déployées à essayer d’y accéder auront été inutiles.
Idem, si quelque chose est utile et rapide, mais qu’on ne peut pas y accéder par manque d’accessibilité (par exemple si on a un déficit visuel), ça devient inutile, et ça existe pour rien.
Donc en éco-conception, on interroge aussi la pertinence, parce que tout ce qui est crée a un impact, mais si cet impact est pertinent, c’est ok. Sinon, mieux vaut s’abstenir.
Les étapes de l’éco-conception d’un site web
1. Définir la stratégie
Par stratégie, j’entends : à qui je m’adresse ? Quel(s) message(s) je veux faire passer ? Par quels moyen ?
Selon moi , c’est le plus important.
Déjà, parce qu’on ne crée pas un site juste comme ça (sauf si on veut s’amuser). Il faut savoir pourquoi et pour qui on le fait avant toute chose, car c’est ce qui va définir tout le reste.
C’est également l’étape où on va pouvoir faire le tri. Parce que dans une démarche d’éco-conception, on ne met pas des outils ou fonctionnalités sur un site parce que c’est l’usage et que tout le monde le fait. Le principe, c’est de faire un site simple, utile et pertinent.
C’est donc le moment de s’interroger sur ce qui est vraiment utile pour les utilisateurices, qu’est ce qu’iels vont venir chercher sur le site ? Qu’est ce qu’iels auront envie de faire, et comment leur donner la possibilité de le faire le plus facilement et rapidement ?
On n’en met pas plus, pas moins.
Parce que plus une personne passe de temps sur le site, moins il est écologique. Et oui, ça va à l’encontre de tout ce que le marketing a pu nous apprendre jusqu’à présent.
2. Création de l’arborescence et du user flow
Une fois que tous les éléments de la stratégie sont réunis, on peut créer ce que l’on appelle l’arborescence du site. C’est tout simplement la liste des pages du site. En gros, ça ressemble à un arbre généalogique ou un organigramme.
Suite à ça, on peut aussi créer le « user flow », c’est-à-dire le « mouvement de l’utilisateurice ». En fait, il s’agit de créer le chemin idéal d’une personne sur notre site, de voir comment elle passe d’une page à une autre et de rendre cela le plus fluide possible.
On s’interroge alors sur ce que les personnes auront envie de faire sur notre site, et à partir de là, on leur fournit l’expérience la plus optimale possible.
Encore une fois, le but est de créer un site simple, efficace, pertinent et beau, mais surtout, qui sert notre objectif, sinon autant ne rien créer du tout.
3. Exploration graphique
La 3e étape selon moi, c’est l’exploration de pistes graphiques.
Là aussi, on va se servir des éléments de l’étape 1. Il s’agit de trouver un design qui puisse refléter les valeurs de l’entreprise et la personnalité de la personne qui est derrière le projet.
Généralement, ce sont des éléments que l’on a en commun avec notre cible, et c’est aussi comme ça qu’on attire les bonnes personnes.
Pour m’inspirer, mes sites préférés sont :
– Dribbble
– Behance
Lors de cette phase, il est important de faire des choix éco-responsables aussi pour le design.
Par exemple, choisir des couleurs avec un contraste suffisant, des polices lisibles (le must pour un site éco-conçu c’est d’utiliser les polices que l’on appelle « standard » ou « web safe ») ou encore de faire des choix de visuels inclusifs.
4. Création de la maquette du site éco-conçu
Une fois que l’on a choisi une piste graphique, je conseille de créer une maquette du site.
C’est en fait chaque page du site en version « image ». Pour savoir exactement à quoi il ressemblera.
C’est important pour pouvoir se projeter mais aussi pour faciliter ensuite la phase d’intégration (l’étape 5).
C’est très compliqué de créer un site « à l’aveugle », sans savoir exactement où on va. Aussi , je vous conseille vraiment de ne pas zapper cette étape.
Pour ma part, j’utilise un outil spécialisé dans la création de maquette de site web : Adobe XD (il existe un équivalent gratuit : Figma)
Mais si vous créez votre site vous-mêmes et que vous n’êtes pas webdesigner·euse professionnel·le, vous pouvez simplement utiliser Canva ou même un papier et un stylo 😃
À LIRE ENSUITE : MAQUETTE DE SITE WEB, POURQUOI ET COMMENT LA CRÉER ?
5. Intégration du site selon les principes de l’éco-conception web
L’intégration, c’est le moment de construire le site pour de vrai.
Et comme vous le voyez, c’est la toute dernière étape.
Au final, la préparation est le plus important et aussi la plus grosse partie du travail.
Lors de la phase d’intégration, beaucoup de choix et de « gestes métiers » peuvent impacter l’éco-responsabilité du site.
Déjà, le plus important, ça va être le choix de l’hébergeur (si vous ne comprenez rien à cette partie technique, j’avais fait une video sur instagram qui explique tout).
Personnellement, je vous conseille Infomaniak*. C’est fiable, vraiment engagé et l’interface est assez facile à prendre en main (ce qui n’est pas souvent le cas !)
Ensuite, il y a un ensemble de bonnes pratiques à mettre en place, et contrairement à ce qu’on pourrait penser, beaucoup sont accessibles même si on n’est pas très à l’aise avec la technique.
En voici déjà 3 :
– Mettre les images à la bonne taille avant de les envoyer sur le site
– Limiter au maximum les animations (par exemple, ne pas faire bouger le texte)
– Héberger ses vidéos sur Youtube plutôt que sur le site (et les intégrer ensuite sur le site)
➡️ Tu souhaites créer toi-même ton site éco-conçu mais tu ne connais rien à la technique ? Rendez-vous par ici !
C’est donc la fin de ce guide de l’éco-conception web. J’espère qu’il vous aura permis de mieux comprendre ce que c’était et comment l’appliquer. J’ai vraiment essayé de rendre ça le plus accessible possible, même sans grande connaissance technique, alors j’espère y être parvenue.
Si vous souhaiter déléguer la création de votre site web éco-conçu, jetez un oeil à mes prestations.
*lien affilié : je touche une commission si vous achetez un service via ce lien, mais le prix ne change pas pour vous. Mon avis sur ce service n’est en aucun cas influencé.
Cet article vous a plu ? Enregistrez-le sur Pinterest en cliquant sur une des images, pour le retrouver plus tard :
