Low-tech web : quand la contrainte énergétique devient direction artistique

Il existe un magazine en ligne qui s'éteint quand le ciel est couvert. Low-Tech Magazine tourne sur un serveur alimenté par un panneau solaire à Barcelone ; une jauge affiche la charge de la batterie, et si le soleil manque trop longtemps, le site devient indisponible : assumé, revendiqué, documenté. C'est l'expérience fondatrice du low-tech web : traiter le budget énergétique comme une contrainte de design, au même titre que la grille ou la charte.

Avant de crier au gadget militant, regarde ce que cette contrainte a produit : un des sites les plus rapides, les plus lisibles et les plus identitaires du web. La sobriété n'a pas appauvri le design, elle l'a signé.

Le poids : l'éléphant dans la page

Le web moyen est obèse, et il le sait : le HTTP Archive mesure année après année des pages médianes qui se comptent en mégaoctets, pour afficher le plus souvent du texte et quelques images. Chaque octet transféré coûte de l'énergie en chaîne : datacenter, réseau, terminal. Le low-tech web attaque le problème à la racine : réduire drastiquement ce qui transite.

La beauté de la chose, pour un designer-développeur : tout ce qui sert la planète sert aussi l'utilisateur. Une page de 200 ko charge instantanément sur un mobile en zone blanche, coûte rien en forfait data, et tourne sur un téléphone de dix ans. L'écologie et la performance sont le même métier avec deux slogans.

Le dithering : l'esthétique née de la contrainte

La signature visuelle du mouvement, c'est le dithering : réduire une image à une poignée de couleurs en simulant les nuances par des motifs de points, la technique des journaux imprimés et des consoles d'antan. Une photo passée en quatre teintes tramées pèse une fraction de l'original, et surtout : elle a une gueule folle. Grain, texture, caractère : l'anti-photo-de-stock absolue.

C'est la leçon d'histoire du design qui se répète : les identités les plus fortes naissent des contraintes les plus dures. La sérigraphie a ses aplats, la risographie son grain, le low-tech web son tramage. Une direction artistique gratuite en octets, pendant que le site d'à côté paie 400 ko pour un dégradé qui passe inaperçu.

En pratique, la panoplie complète :

• Images tramées ou en palettes réduites (PNG 8 bits, dithering via tout bon outil d'image), et surtout : moins d'images.
• Polices système : zéro fichier de fonte à charger, et l'esthétique « brute » assumée.
• Pas de scripts tiers (analytics lourds, widgets sociaux, pubs) : le gras caché des pages, souvent majoritaire.
• HTML/CSS au cordeau : contenu rendu serveur, CSS de quelques ko. Un site statique ou un PHP léger fait ça nativement.
• Le compteur assumé : afficher le poids de la page en pied, comme Low-Tech Magazine affiche sa batterie. La contrainte devient contenu.

Mesurer sans se raconter d'histoires

Des outils comme Website Carbon estiment l'empreinte d'une page ; les modèles sont approximatifs et débattus : les estimations varient selon les méthodologies, prudence sur les chiffres absolus. Mais l'indicateur fiable et incontestable reste le poids transféré, lisible dans l'onglet réseau de n'importe quel navigateur. Vise une fourchette : une page d'article sous 500 ko est sobre, sous 100 ko est exemplaire. Ton concurrent est à 4 Mo ; la barre n'est pas haute, elle est au sol.

Sobre ne veut pas dire triste

Le contresens à éviter : le low-tech web n'est pas le web puni mais un web à contraintes choisies : le brutalisme, le texte magnifiquement composé, les SVG (vectoriels, donc quasi gratuits) et l'art génératif en trois teintes prouvent qu'on peut être sobre et spectaculaire. Ce qui meurt dans la cure : le carrousel autoplay, la vidéo de fond que personne n'a demandée, le script de heatmap qui espionne pour rien. On ne perd pas le design ; on perd le remplissage. Paix à son âme, personne ne viendra.

Le low-tech web pose au designer la question la plus ancienne du métier, celle du print où chaque couleur coûtait : qu'est-ce qui mérite d'être là ? Le web à bande passante illimitée avait permis de ne plus y répondre. La contrainte énergétique remet la question sur la table, et les designs qui en sortent sont plus forts, plus rapides et plus durables. Il fallait juste accepter de redessiner avec un budget. Les meilleurs ont toujours travaillé comme ça.

FAQ

C'est quoi le dithering ?

Une réduction du nombre de couleurs d'une image compensée par des motifs de points simulant les nuances : poids minuscule, esthétique tramée reconnaissable.

Un site sobre est-il forcément moche ?

Non : typographie soignée, SVG, brutalisme et images tramées produisent des identités fortes. On supprime le remplissage, pas le design.

Comment mesurer la sobriété de mon site ?

Le poids transféré dans l'onglet réseau des DevTools est l'indicateur fiable. Sous 500 ko par page : sobre ; sous 100 ko : exemplaire.