Reef Notes
Ce qu'on apprend en construisant des sites, noté au fur et à mesure. Le carnet, pas le portfolio.
La note du mois
Une proportion est facile à choisir et le plus souvent fausse. Une échelle gagne sa place quand chaque palier a un rôle sur une vraie page : cinq tailles, une longueur de ligne qui tient à 320 comme à 1440 pixels, et un clamp() qu'une designer peut lire à voix haute.
À propos
L'un construit, l'une mesure, l'autre dessine, et tous les trois écrivent. Trois ou quatre projets par an, et tout ce qu'ils nous apprennent finit ici.
Les entrées les plus récentes, de la plus fraîche à la plus ancienne. Le reste attend dans les archives.
Les outils de laboratoire mesurent un robot sur de la fibre. Les données de terrain mesurent vos lecteurs dans le bus. Voici le dispositif honnête le plus simple que nous ayons su construire : trois métriques, un point d'entrée, aucun script tiers, et la semaine où nos deux séries de chiffres se sont contredites de deux secondes et demie.
La plupart des projets qui ont mal tourné avaient déjà mal tourné en page une. Voici le brief sans lequel nous refusons désormais de démarrer : qui décide, ce qui existe déjà, ce qui vaut pour fini, et les trois questions qui révèlent un budget sans que personne ait à citer un chiffre.
Inverser une palette prend un après-midi. Le difficile, c'est tout ce que la palette ne contrôle pas : les photos, les captures d'écran, les graphiques, les vidéos intégrées, et cette couleur de marque qui ne veut plus rien dire une fois le fond passé au noir.
Un schéma qui casse le build vaut mieux qu'un CMS qui laisse n'importe qui publier une page cassée. Ce que nous validons dans Astro, ce que nous laissons volontairement tranquille, et les trois règles qui empêchent un schéma Zod de devenir un second CMS.
Une police variable n'est pas automatiquement moins chère que deux graisses statiques, le sous-ensemble économise moins qu'on ne le croit, et la partie coûteuse reste la police de secours que personne n'a dessinée. Le vrai prix d'un caractère, en octets, en requêtes et en décalage.
Un budget, ce n'est pas un score Lighthouse, et ce n'est pas un message dans Slack. Voici celui que nous écrivons désormais dans le contrat : quatre nombres, l'appareil sur lequel on les mesure, et la phrase qui tranche quand on nous demande une vidéo en en-tête en semaine neuf.
Chaque article appartient à un seul sujet : un fil se lit donc d'un bout à l'autre, sans traverser tout le reste.
2 articles
La moitié lente du métier : bien nommer les choses, écrire un balisage qui survivra à la prochaine refonte, choisir la solution ennuyeuse en connaissance de cause. Des notes sur la façon dont une page se construit vraiment, pas sur la façon dont on la démontre.
Lire ce sujet
2 articles
Des chiffres qu'on peut défendre : des budgets posés avant le premier commit, ce que racontent les données de terrain quand les vrais téléphones arrivent, et l'écart entre un bon score en laboratoire et une page qui paraît rapide. Au fond, il s'agit surtout d'en livrer moins.
Lire ce sujet
2 articles
La typographie, c'est l'essentiel d'un site, et l'essentiel du travail ne se voit pas : la longueur de ligne, le rythme vertical, la stratégie de chargement, la police de secours que personne n'a pris la peine de dessiner. Ce qu'on livre, et ce que ça coûte en kilo-octets.
Lire ce sujet
1 article
Des décisions d'interface prises à voix haute : les états avant les écrans, un contraste qui tient aussi en mode sombre, une animation qui porte du sens plutôt que de l'attention. Ici, le design est une liste de contraintes, pas une planche d'ambiance.
Lire ce sujet
1 article
Le métier derrière le code : rédiger un cahier des charges qu'un client peut vraiment signer, facturer un travail plutôt que des heures, tenir entre deux projets. La partie du travail indépendant que personne ne met dans son portfolio.
Lire ce sujet
Ici, tout le monde livre encore des projets clients. Chaque signature mène à tout ce que son auteur a publié, première note comprise.
Fondatrice et développeuse web
Mara a ouvert le studio en 2016, après huit ans passés en agence, et écrit encore la majeure partie du HTML qui part en production. Ce sont les parties ingrates d'un projet qui l'intéressent : le nommage, la modélisation des données et la clause de contrat que personne n'a envie de lire.
3 articles
Ingénieure performance
Noor vient d'une plateforme de commerce en ligne où cent millisecondes avaient une valeur chiffrée, et elle en a gardé l'habitude de mesurer avant de discuter. Elle s'occupe de la collecte des données de terrain du studio et de la réunion inconfortable où l'on montre au client ce que donne son site sur un téléphone de cinq ans d'âge.
2 articles
Designer d'interface
Tomas dessine directement dans le navigateur, ce qui est une façon polie de dire qu'il refait ses propres maquettes trois fois avant de les montrer. Il tranche les questions de typographie et de couleur du studio, et tient à jour un tableau de tous les rapports de contraste sur lesquels nous nous sommes disputés.
3 articles
Un court résumé de ce que nous avons publié et de ce que nous avons raté. Pas de pixel espion, pas de séquence automatique, un clic pour partir définitivement.
