Avril 2025 | UPCYCLE TON SITE | Amélioration continue

Audensiel Canada

Audensiel Canada est une société de conseil québécoise dans l'IT avec des principes engagés, inclusif et éco-responsable.

Pari réussi ! Puisque la nouvelle charte graphique est bien en place et que l'empreinte carbone du site a diminué de 72%

Un score d'éco-conception (comme celui d'Eco-Index) de C, est considéré comme un bon score, d'autant plus que le site d'Audensiel Canada est plutôt "imposant" car c'est un site multilingue, donc plus lourd qu'un simple site "vitrine" d'une langue. En effet, les scores d'éco-conception d'un site sont à mesurer, évaluer en fonction du type de site que l'on analyse : vitrine, e-commerce, webzine, one page, multi-pages, etc. En l'occurence, il est beaucoup plus "facile" d'obtenir un score de A+ sur un site one page que sur un site e-commerce et si ce dernier obtient une note de C, il sera considéré comme très bien. 

D'ailleurs, il n'y a pas que le score d'éco-conception qui compte pour évaluer l'éco-responsabilité d'un site, il y a également son empreinte carbone, son poids et bien d'autres paramètres. Par exemple, si j'analyse ne serait-ce que la page d'accueil du site d'Audensiel Canada sur Digital Beacon sur ces critères, on se rend compte qu'il obtient une excellente note de A+. Retenez que ce qui compte, c'est de maintenir les bonnes pratiques dans le temps et de continuer un peu chaque mois à le rendre plus performant, éthique et éco-responsable. 

Audensiel Canada avait besoin d'un site à l'image de l'entreprise qui l'avait racheté, plus performant, éthique et éco-responsable. Il y avait une vrai volonté d'améliorer l'existant sans tout envoyer valser, en capitalisant sur ce qui fonctionnait déjà très bien sur l'ancien site : contenu, photos, SEO, offres, etc.

C'est d'ailleurs ce qui a permis d'effectuer une simple amélioration de leur site en continue pour l'upcyclé, lui donner une seconde vie, plutôt que de tout refaire de zéro. En effet, si leur demande avait été de changer de builder WordPress, de thème, de contenus textes, avec des nouvelles offres, je les aurais davantage orienté vers un upgrade de leur site web, pour le refondre complètement. Je te laisse découvrir les axes clés sur lesquels nous avons agis pour qu'iels puissent obtenir un site plus performant, éthique et éco-responsable.

01

Audensiel Canada venait d'obtenir une nouvelle identité de marque, dont ils devaient s'imprégner : logo, couleurs, typographies. Je suis donc parti de leur nouvelle charte graphique pour l'appliquer à leur ancien site web. Néanmoins une charte graphique print est rarement adaptée aux standards du web.

Alors, j'ai légèrement ajusté certains codes graphiques afin de les aligner non-seulement à leurs valeurs éco-responsables, mais aussi à leurs valeurs humaines en la rendant plus accessible aux personnes en situation de handicap. L'enjeu dans ces cas-là est surtout d'avoir des typographies assez lisibles et web et de s'assurer du bon contraste de couleurs entre chaque texte et son arrière plan. Tout a donc été testé pour répondre à ces normes d'accessibilité web.

Livrable : Guide de style web et accessible

02

Ce n'est pas parce qu'un site est éthique et éco-responsable qu'il doit être vide et fade. Il est tout a fait possible de jouer avec la mise en page et d'y apporter de la couleur. J'ai notamment apporté du dynamisme à sa structure de page en ajoutant des zones en léger "biais" avec de légers dégradés, j'ai également joué avec les submarks (éléments graphiques de la marque, comme des tampons, voir le bas de page) pour apporter un côté destructuré et personnel, unique. Tout n'a pas besoin d'être linéaire, ce n'est qu'une question de dosage.

Livrable : Maquettes graphiques et intégration sur WordPress

03

Les images ont toutes été optimisé pour le site :

• re-cadrage des images dans leur taille (dimensions) réelle d'affichage sur le site
• ré-export et ré-import de chaque image au bon format, notamment en utilisant le format d'images le plus léger pour le web (WebP),
• et enfin compression de ces dernières.

De plus la balise alt de chaque image a été renseigné afin de faciliter la lecture des images du site aux personnes non-voyantes, utilisant des lecteurs d'écrans ou encore en cas de mauvaises connexion internet (et oui, y en a qui habite en zone rurale). Un combo gagnant, puisque cette balise alt, une fois renseignée, favorise aussi le référencement naturel du site.

Pour limiter encore plus l'impact de chaque image, il y a quelques astuces à connaître. En voici une.

Là où tu penses qu'il y a 8 images importées sur le site, il y a en réalité 2 images l'une en dessous de l'autre. En effet, il est moins lourd d'importer 2 images légères que 8 petites images légères car chaque image ajouté sur ton site génère aussi du poids au niveau de son stockage dans ta base de données par exemple.

En plus, cela simplifie l'affichage sur mobile et entraîne une meilleure expérience pour l'utilisateur·rice car au lieu d'afficher chaque image l'une en dessous de l'autre, l'utilisateur verra une grille de 8 images.