Combattre le gras numérique

Lire les 0 commentaires
Source : unsplash.com
Actualisé : 22 mai 24 Publié : 4 avril 24

Les pages sites et les applications par leur engraissement génèrent une pollution de moins en moins invisible (article : pollution numérique). En tant qu’entrepreneur ou dirigeant d’entreprise on peut être tenté d’ajouter à son site un nombre incalculable d’images, d’effets, de vidéos, de fonctionnalités… Ces artifices sont-ils vraiment capables de booster l’intérêt de ton audience ? ou est-ce que de la poudre aux yeux ?

Le gras (numérique) c’est la vie !

Toujours plus complet, toujours plus gras !

Tu t’es sans doute déjà dit “Et si j’ajoutais un gif de chat ici et cette typographie, je suis certain·e que ça va être vraiment canon !”. Plus il y a mieux c’est pour capter l’attention de l’internaute ? Parce qui compte c’est de faire rester les gens longtemps sur le site n’est-ce pas ? Le principal ennemi d’une page web (et de mon chat) c’est son poids.

Des avancées techniques

Avec l’ADSL, fibre et les progrès technologiques les pages web se sont enrichies d’images, de contenus embarqués (vidéo, carte, etc.), d’animations… Tout ceci a contribué à la prise de poids excessive des pages web et à l’augmentation du temps de chargement. Ces deux facteurs, entre autres, nuisent à l’expérience utilisateur et au bon référencement.

  • Plus une page est lourde, plus son chargement sera long. Une page internet est considérée lourde par les moteurs de recherche dès 4 Mo.
  • Plus le chargement est long, plus les visiteurs sont tentés de fuir avant d’avoir vu son contenu. Personne n’a envie d’attendre. Au-delà de 5 secondes, 38% des usagers ont quitté le site (= taux de rebond), soit 1 usager sur 3 (source : Google).
  • Cette fuite envoie un signal négatif sur la qualité de la page web à Google et nuit directement à son bon référencement.
  • Moins il y a de visite, moins il y a de vente. Logique !

Il est temps d’agir

Pour stocker toutes ces données de nouvelles infrastructures doivent être crées. Le besoin en énergie augmente, les processeurs sont des appareils numériques sont plus sollicités, ce qui les fatiguent plus rapidement voire les rendre prématurément obsolètes. 

Certes le stockage en ligne coûte de moins en moins cher et les appareils sont de plus en plus performants mais les systèmes d’exploitations, les logiciels, les sites et les applications sont eux aussi de plus en plus lourds et complexe. Balle au centre.

Interrogeons le besoin réel des utilisateurs avant d’ajouter des médias et des fonctionnalités. Plusieurs études démontrent que 45 % des fonctionnalités ne sont jamais utilisées (source : Cast Software et Standish Group). Optimisons le plus possible tout ce qui est possible de l’être pour enrayer cette surenchère et limiter le coût environnemental des sites et des applications.

Le gras numérique, c’est quoi ? Pourquoi chercher à l’éliminer ?

Le gras numérique c’est tout ce qui n’est pas essentiel, apporte peu de valeur au produit numérique (site internet, application…) et à la personne qui va l’utiliser. En essayant de le réduire, l’impact environnemental négatif du projet numérique est grandement diminué.

Tailler dans l’gras permet de conserver la valeur et de la rendre plus visible en utilisant des alternatives plus sobres. Cerise sur le gâteau, les interfaces sont plus légères et sont plus faciles à maintenir dans le temps en bon état. Le message est plus digeste et l’accessibilité est améliorée. Alors pourquoi s’en priver ?

Comment éviter le gras numérique ?

Le gras numérique n’est pas seulement une histoire de code. Dès la conception graphique, il est possible de réduire le budget écologique d’un projet web. Le gras numérique peut se loger à différents endroits et peut, selon sa nature, être plus ou moins difficile à déloger.

Savoir à qui on s’adresse

Difficulté : moyenne

S’adresser à tout le monde, c’est le meilleur moyen de toucher personne. Pour éviter cela, cherche à connaître ta clientèle idéale : qui elle est, ses problématiques, ce qui a de la valeur à ses yeux et les informations qu’elle vient chercher.

Solution :

  • Appuie-toi sur des données réelles : sondages, entretien face à face… Comprendre les besoins et les problèmes que ta clientèle idéale rencontre te donnera toutes les clefs pour l’aider.
  • Répertorie le vocabulaire de ta cible à propos de ton activité

Écrire de manière claire et structurée

Difficulté (●●●○○○) : Moyen

Écrire n’est pas chose aisée. Le message que tu cherches à faire passer doit être limpide pour être facilement compris. Alors si dans ta tête c’est déjà le fouillis, que ça part dans tous les sens, imagine ce que ça va être pour celui ou celle qui te lit.

Solution :

  • Définis l’objectif de la page,
  • Rédige un plan structuré (titre 1, titre 2, titre 3…). Un texte bien structuré facilite la lecture en diagonale et c’est bon pour son référencement.
  • Prends du recul, rédige les parties.
  • Évite les phrases aux tournures complexes ou en langage expert (mots techniques, les abréviations…).

Relis-toi et fais-toi relire.

Une navigation simple

Difficulté : Facile

Quoi de pire qu’une navigation avec des sous-menus qui s’enchaînent en cascade à n’en plus finir et des intitulés peu clairs ? Effectivement, pas grand-chose. Si naviguer vers une page à la recherche d’une information relève du parcours du combattant, il y a fort à parier pour que l’internaute abandonne.

Solution :

  • Organise les pages comme le ferait ta clientèle idéale
  • Utilise des intitulés de navigation clairs
  • Évite les menus en cascade
  • Respecte la règle des 3 clics maximum pour atteindre une information
  • Regroupe les informations similaires dans une page dédiée
  • Améliore le maillage interne entre les pages (et les articles)
  • Veille à ce que tous les liens fonctionnent
  • Vérifie que les pages peuvent être indexées par les moteurs de recherche.

Des médias optimisés

Difficulté : Moyenne

Un site c’est grosso modo des fichiers de code (du texte) et des médias. Et ce qui pèse lourd ce sont tout ce qu’il y a en plus du texte : les images, les typographies, les vidéos, les contenus embarqués… C’est justement là dessus qu’il est très intéressant d’agir parce que c’est une stratégie qui porte ses fruits rapidement. Avec quelques bonnes pratiques, il est possible de changer la donne.

En voici quelques une :

  • Avant de télécharger les images
    – redimensionne les fichiers pour que leurs dimensions correspondent au contexte réel.
    – optimise le poids des fichiers : plus c’est léger, mieux c’est (1 Mo, c’est beaucoup trop).
  • Utilise un format d’image approprié au contenu :
    – pour des éléments graphiques : .png ou .svg
    – pour les photos : .jpg ou mieux du .webp
  • Utilise 2 polices d’écriture maximum.
  • Privilégie les polices variables, elles sont beaucoup plus légères.
  • Évite d’incorporer des cartes, des vidéos sur des pages à fort trafic. Elles seront tout de même chargées, même si ça intéresse qu’une toute petite partie des internautes.
  • Évite de télécharger des bibliothèques d’icônes si seulement quelques-unes t’intéressent.

Une partie technique optimisée

Difficulté : Difficile

Pour qu’un site reste en bonne santé, il faut veiller à ne pas le complexifier inutilement de fonctionnalités qui peuvent créer des erreurs, des failles de sécurité ou générer un code lourd et de faible qualité. Je ne vous parle pas des nombreuses mises à jour à installer…

Mes recommandations :

  • Choisis un thème avec un builder qui génère un code propre (bye-bye Divi et Elementor)
  • Désinstalle les extensions inutiles et fais le tri parmi celles aux fonctionnalités en double. Au-delà de 10 extensions, ça commence à faire beaucoup.
  • Veilles à ce que le code se charge uniquement quand il y a besoin (coucou contactform7 et ses fichiers qui se chargent sur toutes les pages).
  • Supprime les images qui ne sont pas utilisées et fait les redirections nécessaires.
  • Refactorise le code pour le rendre plus léger
  • Utilise des variables pour faciliter sa maintenance

Comment déloger le gras numérique d’un site existant ?

Pour commencer, il faut prendre du recul sur ce qui est fait et poser les bonnes questions. Du point de vue business et de ta clientèle idéale. Tu peux commencer par toi même ou faire appel à moi pour un audit. Ce dernier pose un diagnostic et établi un plan d’action à suivre en toute autonomie.

Voici quelques questions à te poser : cette [fonctionnalité, animation, effet, partie, image, paragraphe, phrase] : 

  • est-ce utile et nécessaire ?
  • est-ce claire ?
  • est-ce que ça pourrait être simplifiées ? être regroupées ?
  • est-ce que ça apporte une réelle plus-value ?
  • est-ce que ça sert ton propos ?
  • est-ce que ça sert tes objectifs ?
  • est-ce utile à l’utilisateur pour atteindre son objectif ?
  • est-ce optimisé·e ? (référencement organique, poids, dimensions…)

Si tu as répondu majoritairement “non”, tu peux supprimer, sinon améliore ou propose une alternative.

Illustrons ceci avec l’exemple de ce site internet. Pour la présentation de sa refonte, j’ai utilisé des carrousels avec deux images pour présenter l’avant et après de la page d’accueil. Les carrousels alourdissaient le code de la page, et ce n’était pas optimal pour visualiser les ajustements faits. Je les ai remplacés par deux images côte à côte, c’était bien plus simple et efficace. Pour réduire encore le poids, j’ai mis ces deux visuels sur la même image (41 Ko) pour n’en charger plus qu’une. L’économie a été de 20 ko et d’une requête au serveur par carrousel. Il y en avait 3, soit au total 60 ko et 3 requêtes économisées.

3 bénéfices principaux de la chasse au gras numérique…

1 • C’est bon pour le business

  • Le site est plus léger et se chargera bien plus vite. L’expérience utilisateur est améliorée
  • Gagne en efficience : le bon message, de la bonne manière, à la bonne personne, au bon moment
  • Avec tous ces indicateurs au vert, le référencement du site est amélioré. 
  • La prise de contact et la vente sont facilitées.
  • Une économie de temps et financière : plus facile à maintenir et les problèmes sont plus rapides à identifier car il y a moins d’éléments à contrôler.
  • La surface d’attaque est réduite
  • Le risque d’incompatibilité est plus limité
  • Moins de plugins, c’est moins de mises à jour à appliquer
  • On participe à diminuer la pollution numérique liée au stockage et à l’utilisation

2 • Bon pour l’utilisateur

  • Le message est plus direct et clair : l’utilisateur trouve plus facilement ce qu’il cherche car la navigation est facilitée et les informations sont mieux structurées.
  • L’utilisateur est moins déconcentré par des latences de chargements, ou des animations, images, vidéos qui peuvent le détourner de son objectif premier.
  • Réduit la fracture numérique : le site est accessible même sur les vieux terminaux ou avec un débit réduit (3G)

3 • Bon pour la planète

  • Moins de données chargées
  • Une puissance de calcul plus modeste.
  • Lutte contre l’obsolescence prématurée des terminaux.
  • Préserve la faune, la flore, et les ressources
  • Limite la création de nouvelles infrastructures
  • Rendre le net moins polluant

J’en oublie certainement beaucoup d’autres.

Avais-tu conscience de tout ça ? Dis-moi en commentaire !

Toutes les bonnes pratiques sont celles que j’utilise pour créer des sites vitrine éco-responsable.

Laisser un commentaire Tous les champs sont obligatoires