08/07/2020

Site Internet écoresponsable : la théorie

Public pour cette page :Tous profils

Soyons lucides : écoresponsable ou non, un site Internet ne peut prétendre être tout à fait neutre pour l'environnement dans la mesure où sa conception et son exploitation requièrent la mise en œuvre de machines devant être produites, alimentées et retraitées.

Nous, développeurs témoins des enjeux environnementaux et sociétaux du Numérique, avons peu de marge de manœuvre pour changer cela.

Qui peut aujourd'hui prétendre ne travailler qu'avec du matériel 100% recyclé et alimenté en énergie verte ? Qui peut, par ses propres moyens, assurer la diffusion d'un site Internet sans précisément recourir aux infrastructures du réseau ? Qui, enfin, peut garantir que les utilisateurs feront de même pour connecter leurs équipements au produit ?

Cette impuissance sur la réalité matérielle d'Internet est d'autant plus frustrante que le Numérique poursuit une croissance effrénée et destructrice.

Nous avons cependant la possibilité — et la responsabilité — d'agir à d'autres niveaux.

Je l'écris sur Awebsome.fr :

À défaut de repenser nos technologies toutes entières, nous pouvons en effet modérer leur consommation à divers degrés et freiner la nécessité de leur renouvellement tout en améliorant, de manière significative, le confort des utilisateurs au quotidien.

Tels sont les enjeux du site Internet écoresponsable dont j'aborde ici ma vision.

Note : Cet article est une introduction à l'écoresponsabilité en matière de création Web. Ayant vocation à toucher une large audience, il traite uniquement des considérations théoriques et non des leviers techniques.

Vous manquez de temps pour lire article ? Téléchargez-le gratuitement au format PDF !

La vision Awebsome du site Internet écoresponsable

Si la vision du site Internet écoresponsable est nuancée au sein même de la communauté des développeurs, une volonté commune nous anime : réduire l'impact environnemental du Numérique en créant des services en ligne plus efficients et plus inclusifs.

Certains parlent d'écoconception. Il s'agit selon moi d'un abus de langage au même titre que "site Internet" employé ici par souci de référencement (Internet est un réseau, le Web un protocole d'Internet ; il faudrait donc écrire "site Web").

Écoconcevoir, c'est placer tous les enjeux environnementaux et sociétaux en phase de développement. Or ce n'est pas ce que nous faisons, relisez l'introduction de cet article pour vous en convaincre. Notre travail est le fruit du dialogue, de choix éclairés, d'optimisations transversales en tous genres. Sa qualité s'évalue surtout à l'utilisation à travers des critères mesurables.

  • Diminution du poids du site et des coûts d'hébergement.
  • Augmentation significative des performances.
  • Maîtrise de la consommation énergétique et du transfert de données.
  • Fortification immédiate et à long terme.
  • Amélioration de la satisfaction utilisateur.

La qualité s'apprécie dans la durée en donnant toutes les chances au produit de traverser le temps sans intervention humaine.

Pour ces raisons, je préfère soutenir l'idée que ce que nous faisons, c'est créer des sites Internet écoresponsables. Et voici la méthodologie que j'applique avec Awebsome pour y parvenir :

La vision awebsome du site Internet écoresponsable
La vision Awebsome du site Internet écoresponsable en 6 points.
  1. La majorité des fonctionnalités du site est utilisée
  2. Les technologies du site sont standardisées, supportées et respectées
  3. Les ressources du site sont optimisées et leur format, adapté à leur usage respectif
  4. La diffusion du contenu du site est progressive et appropriée au contexte utilisateur
  5. Le site exploite autant que possible la mise en cache côté client
  6. Le contenu mis en ligne sur le site est pertinent pour les utilisateurs

I. La majorité des fonctionnalités du site est utilisée

La plus basique des fonctionnalités pour l'utilisateur repose sur de nombreuses autres fonctionnalités. Lorsqu'un visiteur laisse un commentaire en ligne (fonctionnalité publique), l'exploitant du site Internet a généralement de son côté accès à sa modération (fonctionnalité réservée). Pour que l'un ou l'autre puisse réaliser l'action, d'autres fonctionnalités (fonctionnalités techniques) interviennent sous le capot et ces dernières empruntent à d'autres (fonctionnalités issues de bibliothèques de codes) pour pouvoir opérer.

La plupart des sites Internet sont aujourd'hui bâtis comme des couteaux suisses, depuis leur code source, jusqu'à leur interface utilisateur. Pour chaque fonctionnalité exploitée, d'autres, inutiles, sont intégrées sur plusieurs couches.

Pourquoi ? Le plus souvent : par souci de productivité. En multipliant les sources, il est désormais facile de créer des sites ou des applications Web complexes en un rien de temps, parfois même sans comprendre tout à fait ce avec quoi l'on joue. Problème : aussi sûres soient ces sources qui viennent se greffer au projet — parfois elles ne le sont pas ou sont éphémères —, chacune d'elle apporte son trop-plein de fonctionnalités inutiles et son lot de vulnérabilités. Et ces désagréments finissent par peser lourd dans la balance.

Un site Internet écoresponsable propose, autant que possible et pour toutes les couches de l'application, des fonctionnalités pleinement exploitées.

Ce travail intervient...

  • En amont, avant la première ligne de code : il s'agit de déterminer les fonctionnalités publiques et réservées qui conditionnent la réussite du projet, les autres devant être écartées.
  • Tout au long du développement du produit, en faisant des choix d'efficience et de sobriété au détriment du confort du développeur.

...Et se révèle très avantageux pour votre site Internet :

  • Sa légèreté ouvre la voie à une réduction des coûts liés à son hébergement.

  • Sa sobriété fonctionnelle lui permet de jouir de performances accrues.

  • Son autonomie en fait le seul maître à bord de son intégrité, ce qui est propice à sa pérennité.

  • Son efficience entraîne une baisse de la consommation énergétique et du transfert de données.

  • La justesse de son interface utilisateur (UI) en simplifie l'apprentissage.

II. Les technologies du site sont standardisées, supportées et respectées

Les technologies du Web sont en évolution constante. Le World Wide Web Consortium (W3C) travaille par exemple sans discontinuer à faire évoluer HTML et CSS quand le ECMA International est en charge de JavaScript. Ces trois langages accomplissent des choses différentes, complémentaires, mais ont cela de commun que c'est au navigateur Web de les comprendre. On dit qu'ils sont "Client-Side".

Dans le cas de ces langages, la publication d'un nouveau standard ne vaut pas pour support immédiat. Il peut s'écouler des mois voire des années entre la validation d'un standard et son support par un nombre acceptable de navigateurs Web. Le plus souvent, une technologie sera très largement répandue avant même sa recommandation officielle.

Lorsqu'enfin ce support est acquis, il convient d'utiliser les standards dans le cadre d'usage qui est le leur. Les détourner pour obtenir tout autre chose ou mal les employer par simple méconnaissance est en effet très fréquent. Ces pratiques permettent d'arriver à ses fins en surface, mais sont source de troubles en profondeur. Elles pénalisent les utilisateurs en situation de handicap en cassant leurs repères, font courir au site Internet le risque d'être restitué de façon imprévisible par tel ou tel navigateur Web, affaiblissent la qualité de son référencement naturel...

Un site Internet écoresponsable s'en remet aux technologies dont le support global par les navigateurs Web est supérieur à 90% et respecte leurs spécifications avec du code conforme.

Être bon élève à ce sujet n'est pas si compliqué — à condition d'avoir la maîtrise du projet de bout en bout. C'est même plutôt recommandé.

  • Exploiter à bon escient des standards solides est capital pour espérer une interprétation homogène, pérenne et à moindre coût d'un site Internet par différents navigateurs Web.

  • Mieux structuré, le contenu est mieux référencé par les moteurs de recherches et mieux restitué aux personnes en situation de handicap.

Note : seules quelques technologies ont été citées ici, mais bien d'autres sont concernées.

III. Les ressources du site sont optimisées et leur format, adapté à leur usage respectif

Qu'est-ce qu'une ressource pour le Web ?

  • Une image (JPEG, PNG, GIF...).
  • Un son (WAV, MP3, Ogg...).
  • Une vidéo (MP4, MOV, AVI...)
  • Une police d'écriture (TTF, WOFF2, OTF...).
  • Un document (PDF, XLS, TXT...).
  • ...

Le code source d'un site Internet est lui-même composé de fichiers HTML, CSS, JavaScript, JSON, PHP, etc.

Toutes ces ressources ont souvent un rôle bien défini. Et si certaines extensions peuvent sembler interchangeables, c'est souvent faux. Ce n'est pas parce que quelque chose fonctionne que c'est approprié. Enfourchez une bicyclette, rendez-vous sur l'autoroute. Rien ne vous en empêche ; entre nous, est-ce vraiment l'idéal ?

J'en veux pour preuve les formats JPEG et PNG, destinés à des images de nature différente. Le premier est à privilégier pour la photographie, le second pour les images numériques. Le format PNG offre par ailleurs une gestion de la transparence que le format JPEG ne supporte pas.

Ces caractéristiques, seule une minorité d'internautes les connaissent.

Choisir le bon format de fichier, c'est pourtant bénéficier du meilleur ratio de compression. Car oui, tout est affaire de compression. Dès lors que vous souhaitez partager un fichier en ligne, il convient de sélectionner le format adéquat avant de l'optimiser plus ou moins. J'écris "plus ou moins", parce qu'il existe différents degrés d'optimisation et que certains peuvent altérer la qualité du fichier, voire l'endommager. Ce n'est pas toujours le résultat souhaité.

En fait, il existe tant de techniques pour arriver à ses fins qu'un développeur écoresponsable se doit de posséder de nombreuses connaissances transversales pour exceller dans son art.

À titre d'exemple, et de façon non exhaustive :

  • Pour le code source : qualité et factorisation du code, minification (suppression des espaces inutiles, des commentaires, des balises de fermetures optionnelles...).
  • Pour les images : recadrage, redimensionnement à la baisse, désaturation, compression en sortie... Il est même possible de composer des images moins complexes et donc plus légères grâce au bokeh, une technique photographique que vous pouvez observer en en-tête de page avec la carte de visite Awebsome.
  • Pour la vidéo : découpage, réduction de la résolution ou du framerate (nombre d'images par seconde), suppression de la piste son, compression en sortie...
  • Pour les fontes : suppression des glyphes non sollicités (typographies étrangères)...
  • ...

Ma devise en tant que développeur Web écoresponsable est claire : si optimiser un fichier sans dégrader l'expérience des utilisateurs est envisageable, il faut s'y résoudre.

Les avantages parlent d'eux-mêmes :

  • Réduction du poids total du site avec à la clé une baisse éventuelle des coûts d'hébergement.

  • Sauvegarde des performances (manipuler des ressources optimisées demande bien moins d'efforts aux terminaux).

  • Réduction considérable de la consommation énergétique et des données transférées.

  • Les utilisateurs bénéficient d'une expérience de navigation plus rapide, plus fluide et moins énergivore sans contrepartie perceptible.

IV. La diffusion du contenu du site est progressive et appropriée au contexte utilisateur

Le monde a changé. Notre façon de consommer Internet aussi.

Depuis plusieurs années, la multiplication des contextes utilisateur presse les éditeurs de proposer du contenu à la carte pour assurer une expérience viable à chacun, et c'est tant mieux. Mais peu s'y sont vraiment mis. L'on rencontre toujours autant de sites Internet dont le contenu entier (les médias notamment) est chargé dès l'arrivée au-dessus de la ligne de flottaison de la page, sans garantie aucune que l'utilisateur s'aventure au-delà. D'autres ne font guère de distinction entre desktop et mobile et livrent au second les ressources surdimensionnées du premier. Si ce dernier point semble rejoindre le chapitre précédent (III. Les ressources du site sont optimisées et leur format, adapté à leur usage respectif), il s'applique ici tout autrement. Proposer des ressources optimisées est devenu insuffisant : elles doivent désormais avoir été travaillées pour le contexte de navigation auquel elles entendent s'intégrer.

Un site Internet écoresponsable tient compte de la progression de l'utilisateur et du contexte de navigation qui est le sien pour lui apporter ce dont il a besoin ni plus ni moins.

Les avantages :

  • Mobiliser les ressources du site à bon escient lui permet d'être réactif au bon moment.

  • Servir le strict nécessaire justifie pleinement la consommation énergétique et les données transférées.

  • Différer le chargement de contenu secondaire permet de donner plus vite le contrôle aux utilisateurs. Pour information : plus d'un internaute sur deux renonce à rester sur un site Internet dont le temps de chargement excède trois secondes (source : vouchercloud, Consumer psychology & the E-commerce checkout).

V. Le site exploite autant que possible la mise en cache côté client

Cette page contient différents éléments visuels que vous avez certainement remarqués (une photographie en en-tête et perceptible en arrière-plan, une infographie, des pictogrammes). S'il s'agit de votre première visite sur le blog Awebsome, ces ressources et bien d'autres ont été demandées au serveur afin de constituer la page. Un premier passage obligé, sans lequel vous auriez obtenu une page vierge.

Parce que certaines ressources n'ont pas vocation à changer une fois en ligne, les retélécharger de façon systématique est un comportement aberrant et inutilement coûteux. C'est le cas pour ces images, que je demande donc à votre navigateur Web de mettre en cache. Ainsi, pour toutes vos visites à venir, et ce jusqu'à la suppression ou l'expiration dudit cache, ces éléments ne seront plus demandés au serveur, mais resservis par le navigateur Web lui-même, qui en aura gardé une copie locale sur votre terminal.

Les intérêts de la mise en cache côté client sont conséquents :

  • Le navigateur Web peut reconstruire la page à une vitesse stupéfiante.

  • Charger des ressources déjà présentes sur votre terminal constitue un effort moindre pour ce dernier et préserve vos données d'échanges superflus.

  • Ne pas systématiquement solliciter un serveur pour obtenir des ressources inchangées permet à ce dernier une meilleure absorption du trafic, ce qui accroît sa disponibilité.

  • Les utilisateurs réguliers sont servis plus vite et à moindre coût : que demander de plus ?

L'application d'une politique de mise en cache peut cependant s'avérer complexe :

  • Sa mise en œuvre exige des connaissances techniques spécifiques : une configuration maladroite peut rendre un site inexploitable.
  • Dans la mesure où vous n'avez pas le contrôle du cache local de vos utilisateurs, il est nécessaire de fixer un juste équilibre entre fraîcheur (contenu nouveau) et réemploi (contenu réutilisable) pour assurer que les mises à jour de votre site leur apparaîtront dans un délai raisonnable.

Note : il existe d'autres façons de mettre en cache. On peut, par exemple, stocker des calculs complexes effectués par un serveur — sur le serveur même — et réutiliser le résultat en cas de requête identique par vous-même ou quelqu'un d'autre. Cette forme de mise en cache répond toutefois à des problématiques spécifiques ; contrairement au cache côté client, l'intérêt n'est pas automatique.

VI. Le contenu mis en ligne sur le site est pertinent pour les utilisateurs

Cet aspect, le moins technique de tous, est en réalité entre les mains de l'exploitant du site Internet. Nous sommes tous habitués à publier du contenu en ligne sur nos sites Internet respectifs, sur les réseaux sociaux, sur des forums... Les échanges privés que nous avons avec les messageries et nos documents stockés dans le Cloud sont eux aussi sauvegardés et répliqués dans de multiples centres de données (data centers) pour garantir leur disponibilité à tout moment.

Parfois, ce que nous partageons est pertinent. D'autres fois, non.
Très souvent, ce qui est opportun l'est seulement pour un temps.

Il est urgent de se remettre en question à ce sujet. De prendre sur notre temps pour faire du vide, comme nous le faisons chez nous lorsque nous venons à manquer de place. Après tout : est-ce bien raisonner que de construire d'autres centres de données pour en emmagasiner toujours plus ?

Créer un site Internet écoresponsable sur le plan technique est une chose : s'il a été conçu ainsi, il faut maintenant lui donner la vie qu'il mérite avec du contenu à propos.

  • Publier avec raison.
  • Améliorer ce qui peut l'être.
  • Supprimer ce qui n'a plus lieu d'exister.

Le référencement d'un site Internet ne devrait pas être une excuse. Ce N'EST PAS une excuse. Les utilisateurs sont exigeants, mais ils ont le choix. Et ce choix se porte avant tout sur la qualité du contenu. Bien sûr, vous en attirerez avec la quantité. Mais ceux-là qui restent, ceux-là qui reviennent le font pour la qualité.

Tout est affaire de bon sens. Mes clients et moi partageons généralement les mêmes valeurs, aussi leur faire entendre raison est facile.

Pour les autres, il reste l'argumentaire :

  • S'accorder à ne laisser en ligne que du contenu à forte valeur ajoutée réduit le poids global du site (sauf si, bien sûr, vous ne produisez que cela). Les coûts d'hébergement peuvent s'en ressentir.

  • Les utilisateurs aiment trouver plus vite des informations qui ont du sens pour eux. De fait, leur fidélité est plus facilement acquise.

Le mot de la fin : vers un nouveau départ ?

Vous l'aurez remarqué : j'ai beaucoup parlé d'utilisateurs. À juste titre : ils sont au centre d'Internet et du Numérique. En tant que demandeurs, ce sont eux qu'il faut contenter, eux qui détiennent la flamme du pouvoir. Ils peuvent aussi bien nous mener à la consécration et nous faire tomber dans l'oubli. Nous leur devons le respect. À chacun d'entre eux, comme à nous-mêmes. Quand j'écris "site Internet écoresponsable", je pourrais tout aussi bien écrire "site Internet user-friendly". C'est vrai. Il n'y a pas de quoi rougir.

Les utilisateurs veulent pouvoir accéder avec facilité à du contenu susceptible de les enrichir. Or gonfler toujours plus les muscles pour satisfaire leur demande (comme nous comptons le faire avec la 5G) n'est pas viable. C'est une réponse inadaptée à un problème mal identifié.

Le site Internet écoresponsable est un élément de réponse pertinent. Il s'attaque au mal par la racine.

Demander moins d'efforts à nos terminaux pour un même service, c'est limiter la consommation énergétique et le transfert de données à court terme tout en augmentant leur durée de vie.

Supprimer cette impression de défaut de puissance qui incite au renouvellement (avec l'aide du marketing), c'est repousser l'échéance inévitable de l'épuisement de nos ressources abiotiques.

Ces efforts luttent déjà contre la fracture numérique. Ils permettent l'inclusion de celles et ceux dont les moyens sont limités pour acquérir des terminaux de dernière génération. Ils servent celles et ceux qui rêvent de profiter de la technologie, mais en sont écartés parce que la couverture réseau est faible autour de leur lieu de résidence. Enfin, ils donnent de la stabilité à celles et ceux qui sont toujours en mouvement.

Et vous, qu'en pensez-vous : votre site Internet peut-il changer le monde ?

On en discute ici ou ? Vous pouvez aussi partager cet article sur:

Linkedin