#web
Publications relatives à cette étiquette
Tout
We’re expected to do everything, keep up with everything, adapt to constant changes, and understand multiple conflicting architectural paradigms ranging from immediate mode rendering, to relational databases, to REST API designs, to both imperative and declarative programming, to complex state querying languages like GraphQL, to all of the various intricacies of how CSS handles rendering.
We’re made to do all this while watching our peers lose their jobs, our employers savage society through pervasive surveillance and collaboration with authoritarian companies, and our data centres suck up the entire water supply for entire municipalities.
No wonder we’re all fucked up emotionally and mentally.
The deskilling of web dev is harming the product but, more importantly, it’s damaging our health
[archive]
J’aimerais bien papoter avec Baldur Bjarnason un jour. Et je sais que mon niveau d’anglais actuel ne me permettrait pas d’aborder ces sujets avec la subtilité qui le nécessite.
My web experience was thus enlightenment and disempowerment. Opportunity and anxiety. Tears and joy.
[…]
My vision for the web over the next ten years is that we can turn that feeling of malaise, which I think is rooted in disempowerment, into a feeling that things can be different.
No one person set off a light bulb in my mind that made me think I could have a personal website where I blog about all the things I find fun and interesting. Rather, it was seeing role models from all different backgrounds that made me think I could take more control of the web, and use the web as a platform not for consumption or creation for capital, but as a place of expression.
Un peu d’optimisme ne fait pas de mal.
The best way to think of SLS is as a balding guy with a mullet: there are fireworks down below that are meant to distract you from a sad situation up top.
Maciej Cegłowski, in style 😂.
Voir aussi : Why Not Mars [archive].
Rye said Apple’s response addressed the most depressing aspect of their research: That there was previously no way for anyone to opt out of this data collection.
“You may not have Apple products, but if you have an access point and someone near you owns an Apple device, your BSSID will be in [Apple’s] database,” he said. “What’s important to note here is that every access point is being tracked, without opting in, whether they run an Apple device or not. Only after we disclosed this to Apple have they added the ability for people to opt out.”
Le ver est dans la pomme depuis un peu trop longtemps à mon goût…
Un résumé sur masto.
Recall works by taking a screenshot of your active window every few seconds, recording everything you do in Windows for up to three months by default.
These snapshots will be analyzed by the on-device Neural Processing Unit (NPU) and an AI model to extract data from the screenshot. The data will be saved in a semantic index, allowing Windows users to browse through the snapshot history or search using human language queries.
Microsoft’s new Windows 11 Recall is a privacy nightmare
[archive]
C’est la porte ouverte à toute les fenêtres, Windows Unlimited eut été un meilleur nom. 🤡
Russian troops in Ukraine are using thousands of Starlink satellite communications terminals made by Elon Musk’s SpaceX, the Ukrainian military intelligence chief told the Wall Street Journal in an interview published on Thursday.
Lieutenant General Kyrylo Budanov said that Russian troops have been communicating over the Starlink system “for quite a long time” and acquired the terminals from private Russian firms that purchased them from intermediaries.
Russia using thousands of SpaceX Starlink terminals in Ukraine, WSJ says
[archive]
Neutralité du net vs. héroïsation des fournisseurs d’accès à internet.
This leads us straight back to the original conversation about “Man or Bear,” which has nothing to do with bears. (Sorry, bears!) “Would you rather be stuck in a forest with a man or a bear?” is just another way of asking, “Are you afraid of men?” It’s the same question I’ve been fielding for the entirety of my life as a solo female traveler. It’s the same question that hovers over women all the time as we move through the world.
And it’s a question that’s always been difficult for me to answer. I’m not afraid of all men. But I am afraid of some men. The real problem is the gray area in between and what it takes to manage the murkiness of that unknown.
A Woman Who Left Society to Live With Bears Weighs in on “Man or Bear”
[archive]
En tant qu’homme qui peut croiser des hommes et des ours dans la forêt, j’ai déjà plus peur de croiser un homme. Je n’imagine même pas en tant que femme.
À mon niveau, lorsque je croise une femme seule dans la forêt (très rare, mais ça arrive), j’essaye de rester à bonne distance en ayant l’attitude que j’aurais vis-à-vis… d’un ours.
As I listened to his laughter, a visceral understanding rose from my stomach and landed in my brain. In that moment I knew something that I could no longer prevent myself from knowing. That the person I loved got bigger when I got smaller. That he could not stop bringing me down, because bringing me down was what brought him up.
😭
GPX Viewer
Suite de mes expérimentations de la veille à la fois en cartographie et en web components. Je me suis demandé s’il était possible de faire un composant qui ne dépende pas de uMap pour afficher une trace GPX. Le fait d’avoir passé une heure à trouver la bonne CSP pour arriver à afficher une carte m’a d’une certaine manière motivé (c’était une journée galère).
Il se trouve qu’il existe leaflet-gpx qui fait exactement ce que je voulais. Il ne me restait « plus qu’à » en faire un composant web, ce que j’avais déjà fait par ailleurs :
Vous devriez voir s’afficher une carte de mon « Grand Tour de la forêt de Ouareau », qui contient cette trace GPX, centrée sur 46.2117, -73.9335 avec un zoom de 12. Il est probable que cela ne s’exécute pas dans un agrégateur par exemple.
Alors en fait, comme rien n’est jamais simple en JS, il a fallu que j’adapte le plugin qui n’était pas compatible avec les modules JS et que je fasse des galipettes pour que ça finisse par tomber en marche 🤸. Cet écosystème est merveilleux (quel métier !). J’ai quand même remonté le problème.
Au passage, inspiré par le travail de Knut Hühne [archive] sur la sémantique des données d’une carte, je me suis demandé si j’allais définir un itinerary pour un Trip avec des GeoCoordinates mais ça m’a fait tirer un fil beaucoup trop long. Je garde l’idée sous le coude pour mes propres recherches dans le domaine cela dit.
Un composant de plus, je ne suis pas très satisfait de celui-ci car j’avais l’espoir d’arriver à quelque chose de facilement réutilisable. J’aurais au moins commencé à mettre les doigts dans le XML du format GPX. Il est possible de définir plusieurs segments au sein d’une même trace. Il peut y avoir pas mal de métadonnées, notamment de mise en forme de la trace mais aussi de caractéristiques (biologiques, physiques, etc).
The fact is that we can’t rely on any single website to hold the whole world’s knowledge, because it can be corrupted sooner or later. The only solution is a distributed architecture, with many smaller websites connecting with each other and sharing information. This is where ActivityPub comes in, the protocol used by Mastodon, Lemmy, Peertube and many other federated social media projects.
I have worked on Lemmy for the past four years, bringing it from a prototype to a fully functional Reddit alternative. I wrote the entire federation code and became very familiar with the protocol. I realized that the same technology easily be used to create a federated encyclopedia. As no one else took up such a project, I finally decided to do it on my own and create Ibis. Thanks to my previous experience with the tech stack and the ActivityPub library I created, I was able to complete a proof of concept in a relatively short time of four months.
Announcing Ibis, the federated Wikipedia Alternative
[archive]
Wikipedia décentralisé, je dis oui ! Merci Alex [archive].
C’est important pour diverses raisons.
I think it’s time to admit that my hobby is buying stuff for my new hobby.
Chris Hallbeck, sur masto
Touché.
Sérendipité
Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble opinion.
As an analogy, it’s kind of like going on vacation to a new place and staying/living amongst the locals vs. staying at a manicured 5-star hotel that gives you no reason to leave. Can you really say you visited the location if you never left the hotel?
Je suis toujours étonné qu’il n’y ait pas des navigateurs qui affichent la toile de nos navigations de manière plus ou moins artistiques. On pourrait avoir des topologies de navigations, potentiellement quotidiennes, des points de comparaison avec d’autres personnes, une représentation de la curiosité, de l’enfermement dans des silos, etc.
A surprising number of other features can be expressed in terms of links.
printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'
Qui me fait découvre watchgha, bien pratique pour avoir un accès rapide aux résultats de l’intégration continue.
Le constat est simple : je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu l’exemple.
Très chouettes publications cette dernière semaine en tout cas <3.
Rétropédalage sur le surlignage. Beaucoup trop de retours qui trouvent cela davantage distrayant qu’utile. Pour l’instant, j’ai gardé la logique mais sans animation. Je me demande si je vais en faire un opt-in à un moment.
Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. J’ai ainsi appris à encrer à la plume, dorer à la feuille d’or pur, peindre aux pigments en poudre et relier au cuir de chèvre. Je m’y suis dévouée corps et âme, dédiant le moindre de mon temps libre à la concrétisation de ce projet qui devait se mener dans le plus grand secret. Je m’attelais à l’ouvrage à la moindre opportunité, me levant parfois à l’aube pour grappiller une heure de calligraphie avant d’aller bosser ou prolongeant des soirées jusqu’au petit matin lorsque K travaillait de nuit.
Au total j’ai passé plus de 230 heures sur ce projet
Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas l’artiste.
Rust-like error handling in Python, with type-safety in mind.
J’ai très souvent retrouvé le besoin de ce pattern dans mes projets.
Sortie de la version 2.0 de pressoir-cli (oui, c’est ma période). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop meta pour ne pas le faire 😇.
Nginx de part sa robustesse, sa structure minimaliste et son fonctionnement événementiel asynchrone est un serveur web plébiscité pour ses performances. Mais ce n’est pas parce qu’on a une Porsche qu’il ne faut pas tenter de la rendre encore plus puissante !
Pour lecture ultérieure.
font-size: calc(1rem + 0.25vw);
Moins poussé que le Fluid type scale calculator mais dans un contexte plus minimaliste / simple ça fait déjà le taf.
To enable such progress, the Web Consortium too has evolved, always taking a people-first approach: the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003 which assures that specifications can be implemented on a Royalty-Free basis and used at no cost, thus boosting adoption and usage. Another is the creation in 2011 of W3C Community and Business Groups which enable everyone –not just W3C Members– to participate in the development of the Web or its technologies. Our most recent inflection point was re-launching the Consortium in 2023 as a public-interest non-profit organization to work for the good of the public.
From a humble beginning 35 years ago, the Web is now central to the daily lives of billions
[archive]
35 ans de liens. Merci Tim et al. d’avoir permis cela.
Surligner
A small JavaScript library to create and animate annotations on a web page
Rough Notation uses RoughJS to create a hand-drawn look and feel. Elements can be annotated in a number of different styles. Animation duration and delay can be configured, or just turned off.
Rough Notation is 3.8kb in size when gzipped, and the code is available on GitHub.
J’utilise cette façon de mettre en avant des fragments de citations depuis un petit moment et en passant par chez Biou
[archive] aujourd’hui, j’ai trouvé l’effet bien sympathique. Je ne l’applique pour l’instant(?) que sur la balise <mark> (relativement inoffensif si ça casse), en respectant prefers-reduced-motion et en animant que lorsque la partie surlignée devient visible grâce à IntersectionObserver.
Cela peut se révéler être distrayant pour certaines personnes car ça bouge à un endroit éloigné du point de lecture (merci @maiwann), invisible pour d’autres qui chargent les onglets sans être dessus (merci @lamecarlate). Il s’agit d’une famille d’animations pas trop invasives, encore moins essentielles, qui peuvent se révéler être de fausses bonnes idées. Je vais tester pour un temps, toujours dans cette recherche d’aller vers un peu plus de fantaisie.
N’hésitez pas à me faire des retours.
Plus tard dans la journée, Nicolas Hoizey m’indique qu’il sera possible d’avoir un comportement approchant en CSS [archive] prochainement.
Le lendemain, j’ai désactivé l’animation suite à plusieurs retours de lecteur·ices.
Ce qu’Hashbang propose est de créer un registrar sous forme de SCIC avec en plus un processus participatif pour définir les services et leurs tarifs. Le premier service proposé sera certainement le nom de domaine, mais personne ne peut actuellement définir quel tarif sera proposé. Ce sera issu d’un processus participatif en fonction des participant·e·s au départ.
Chez Hashbang, nous portons un regard attentif aux enjeux environnementaux et nous proposons donc de mesurer et limiter l’impact environnemental des activités du registrar.
Nous souhaitons également s’assurer qu’il n’y ait pas de discriminations et que les personnes minorisé·e·s puissent s’emparer de cet espace. Il faut donc s’attendre à ce qu’il y ait des événements en mixité choisie et du langage inclusif.
Appel à intérêt pour un bureau d’enregistrement coopératif [archive]
Superbe initiative, coopératives pour tou·tes !
I know a lot of people hate anti-ad-block popups, but to me they are perfect.
In presenting those popups, those websites demonstrate that they realize the lack of control they have. They show us so plainly that they are unable to make money from us, which leaves them no option but to grovel and beg us to turn off ad-blocking.[…]
When we use web browsers, we are in more control than they are. That’s simply not the case when we’re inside an app they get to control.
Ma configuration à ce sujet est assez extrême et il n’est pas rare (surtout sur les boutiques !) que je doive m’y reprendre à pas mal de fois pour débloquer les megabytes de JavaScript [archive] à télécharger qui sont pertinents, ou plutôt nécessaires aux personnes ayant développé ces sites. Car pour ma part, je n’aurais besoin que de HTML dans 99% des cas…
…dit-il en venant d’ajouter 13Ko de JS 😬.
LoginWall
I don’t have a LinkedIn account. I don’t like the idea that we both need an account. I need one to post my résumé, and you need one to view it. How does that benefit me to have my résumé behind a login wall? It doesn’t. It benefits LinkedIn. Now, my résumé is on my website, displayed more beautifully than LinkedIn lets me.
[…]
Every new thing that I add to my website works to regain my internet presence away from companies that do not have my interests at heart. And I will avoid future problems like a company deciding to put login walls or paywalls in front of my content. Or putting Nazi content beside mine. I can avoid all of that by self-publishing.
Le problème de sites comme LinkedIn c’est qu’il est difficile de se rendre compte de leur inaccessibilité lorsqu’on a un compte. Ou alors les personnes mettent leurs CV en signature de courriel en sachant que je ne vais pas pouvoir les consulter ?
Avec TwiX c’est encore pire car ça varie d’un jour sur l’autre. Parfois le tweet est accessible mais seul, parfois il faut un compte, parfois on accède à une page avec la liste des dernières publications de la personne mais ordonnées par « popularité », ça sent bon la girouette qui est à la tête de l’entreprise.
Et je ne parle même pas de ce qui se passe sur Facebook.
What I try to keep in mind is the curb cut effect, also known as the « i want subtitles on my favourite show because even though my ears are just fine, i like to eat crisps while watching » rule. In many cases, adding accessibility to your website makes it nicer for everyone, not only for the people who needed these changes. (Corollary: everything that makes you squint is giving a giant migraine to someone else out there.)
Accessibility notes from your headache-prone friend
[archive]
Je ne connaissais pas le nom de cet effet, j’espère le retenir en le notant ici. Merci Alex !
Lu le lendemain sur masto :
It is true that meeting the needs of many disabled people makes services better for non-disabled people.
It is wrong though to say that all accessibility efforts benefit non-disabled people.
They don’t, meeting some access needs only benefit some disabled people.
It is tiring hearing "you’ll be disabled in the future" when there’s such a broad experience of disability that many people won’t experience due to age.
We must create strategies where we aim to humanise and value disabled people inherently and not have to lean so hard on non-disabled people’s self interest.
J’ai joué avec le Planificateur d’itinéraire de Komoot hier, je ne m’étais jamais demandé vraiment quelles distances est-ce que je pouvais parcourir dans la forêt. J’aime bien le fait d’avoir l’option de suivre les chemins connus. À voir si j’arrive à faire ce grand tour en rando rapide / légère. Je connais déjà 80% du parcours et je sais dès à présent que la deuxième journée serait bien longue. L’avantage d’être en terrain connu, c’est de connaître les endroits où je peux couper en cas de pépin physique.
J’ai du matériel très léger mais je me rends compte que la nourriture est déjà un défi sur 4 jours pour garder un sac qui permette de courir. Je m’entraîne en ce moment en faisant des aller-retours à la bibliothèque avec 5kg de livres sur le dos. On verra bien si c’est utile… au pire j’aurais découvert des BD :-).
Sondages
Une faible majorité des votants estime qu’il faut mentionner dans le résumé introductif le nom pré-transition d’une personne transgenre qui a acquis sous cette ancienne identité une notoriété suffisante pour remplir les critères d’admissibilité.
Dans leurs verbatims, les partisans de la mention du morinom insistent sur le caractère encyclopédique de l’information (62), puisque les sujets concernés ont acquis la notoriété sous leur ancien nom (50) et qu’elle s’appuie sur des sources secondaires publiques (31). Il convient selon eux d’indiquer de façon claire et accessible (31), sans réécriture de l’histoire (22), cette information utile au lecteur (15). Ils estiment que les biographies des personnes transgenres ne doivent pas être traitées différemment des autres (14) et rappellent que sur Wikipédia le sujet d’une biographie n’a pas de privilège éditorial sur son contenu (8). Si à leur sens l’information doit figurer dans l’article, il est en revanche inopportun de la répéter (24).
Les opposants arguent quant à eux que la mention du morinom est nuisible aux personnes concernées (83) ou constitue un manque de respect pour le sujet de la biographie (40). Ils considèrent qu’un nom obsolète ne peut pas être encyclopédique (37), qu’il s’agit d’une information privée (38), inutile (36), dont la mention est transphobe (17). L’avis d’une personne transgenre sujet d’une biographie doit selon eux être respecté (29).
Wikipédia:Sondage/Mention du nom de naissance pour les personnes trans/Résultats
54% des 357 avis décomptés. Tristesse anticipée.
Wikipedia est le seul service centralisé sur le Web qui ne souffre d’aucune concurrence. Alors les luttes sont internes, pour décrire le monde tel qu’il est perçu par une certaine population, que l’autre partie de la population prendra pour vérité. Il y a probablement un truc mâle·sain dans tout ça.
Today, the French-speaking Wikipedia passed a decision to deadname trans people in their biographies.
Some will argue that this makes WP-FR transphobic, and there is certainly something to it: while Wikipedia is not a monolithic institution, and while I am critical of the phrase "Wikipedian community", it is a fact that WP-FR is effectively controlled by people hostile or indifferent to inclusion.
But this decision is utterly un-Wikipedian, and therefore lacks any legitimity, for 2 reasons
CSS :has() is a powerful feature that opens a lot of possibilities that weren’t possible before. It literally gives us CSS superpowers! I recommend you start using it today and experiment with it.
Incroyable article d’Ahmad Shadeed complété par d’autres cas pratiques [archive] d’Andy Bell qui m’ont donné envie de jouer avec sur ma page d’accueil. C’est subtil et je reviendrai dessus mais je trouve ça intéressant pour montrer le lien entre les articles de l’année et leurs étiquettes. Cela ne m’embête pas que ce ne soit pas accessible à des doigts, au clavier et/ou aux anciens navigateurs car c’est du bonus. En effet, c’est du Baseline2023™ niveau support.
Je me suis rendu compte en consultant les résultats de ce sondage (92% des 363 personnes ayant répondu vont consulter les archives d’un blog qu’elles découvrent) qu’il n’était pas évident de découvrir ce que je raconte par ici. Surtout avec des titres à un seul mot, aussi je tente des choses pour rendre plus explicite la toile qui est tissée quotidiennement. Depuis bientôt 20 ans.
A title drop is when a character in a movie says the title of the movie they’re in. Here’s a large-scale analysis of 73,921 movies from the last 80 years on how often, when and maybe even why that happens.
Parfois tu tombes sur un site qui a demandé un effort non négligeable et tu te dis à quoi bon trop génial !
So who are the most excessive offenders in mentioning their titles over the course of the film? The overall star when it comes to fiction only came out last year: it’s Barbie by Greta Gerwig with an impressive 267 title drops within its 1 hour and 54 minutes runtime, clocking in at a whopping 2.34 BPM (Barbies Per Minute).
Ibid.
Je comprends mieux mon endormissement.
Simple
We can bring that into RSS by treating any interaction as content. If you post something, thats an entry in your feed (as before). If you comment on something, thats also an entry in your feed. If you like something, thats another entry in your feed. If you follow someone (which would mean subscribing to some RSS feed), thats also another entry in your feed. To mark that interactive nature of some feed entry, we can simple extend RSS a bit
Tout est dans le simple
🙃.
Rédiger une spécification comme Media RSS n’est déjà pas trivial mais alors faire en sorte que cela soit adopté et devienne un standard c’est une autre paire de manches.
RSS originated in 1999, and has strived to be a simple, easy to understand format, with relatively modest goals. After it became a popular format, developers wanted to extend it using modules defined in namespaces, as specified by the W3C.
RSS 2.0 adds that capability, following a simple rule. A RSS feed may contain elements and attributes not described on this page, only if those elements and attributes are defined in a namespace.
Beaucoup de personnes ont envie de faire davantage avec RSS, c’est la diffusion à une échelle non anecdotique qui est difficile. Peut-être qu’un acteur comme Mastodon pourrait peser dans la balance d’une telle initiative.
Another feature area I would think about is interactivity. I’m fascinated with Google’s work in Gmail around “Inbox Actions” – basically the one-click buttons to perform an email action like RSVP, or reviewing a bug. Here’s an explainer with some examples.
Let’s call it Feed Actions. Feed Actions could also be an RSS extension.
Three requests for the Google Chrome team as they experiment with RSS
[archive]
J’ai deux communautés dans lesquelles c’est même devenu un running gag de créer un outil qui explorerait de nouvelles possibilités.
Suivez-moi et vous n’aurez plus jamais faim ! Gniarkgniarkgniark 🦁⚡️
Préparatifs
J’admire les personnes qui arrivent à prendre une photo de leur sac de manière éclatée avant de partir. J’ai toujours pas mal de choses à rajouter au dernier moment, j’essaye au moins d’avoir les basiques de façon certaine.
A utopia for web that I can envision would have rich component creation and manipulation capabilities in built as a part of spec and browsers implementing them. Hence, we won’t have to include any of the heavy third party libraries which will give faster load times to the users by saving the download costs by a huge amounts.
Generating Config driven Dynamic Forms using Web Components
[archive]
Aujourd’hui, j’ai exploré les façons de faire des formulaires en assemblant des Web Components. Cet article de 2019 donne un bon aperçu de ce qu’il est possible de faire. Il y a aussi cet autre article [archive] qui m’a permis de découvrir ElementInternals. Des frameworks comme Shoelace pourraient être inspirants dans le domaine.
RH uses GNOME 3. Ubuntu used Unity, alienated a lot of people who only knew how to use Windows-like desktops, and that made Mint a huge success. GNOME 2 got forked as MATE, and Mint adopted it, helping a lot. Mint also built its own fork of GNOME 3, Cinnamon. Formerly tiny niche desktops like Xfce and LXDE got a huge boost. Debian adopted GNOME 3 and systemd, annoying lots of its developers and causing the Devuan fork to happen.
Everyone seems to forget why GNOME and GNOME 3 and Unity happened
[archive]
Fascinante histoire.
As of version 2.1.0 this project will split into Plausible Community Edition and Plausible Enterprise Edition. The Community Edition (CE) will remain completely open source under the AGPLv3 license. The Enterprise Edition (EE) will contain extra features that will be published as source-available on Github, but we do not grant rights for anyone else to use, distribute or otherwise exploit these features.
Des raisons un peu plus détaillées [archive] ayant motivé ce choix.
Injection
It’s fun to think of other possible uses… Perhaps you could pull in HTML modules along with their relevant CSS link. Or embed a tweet or code examples in documentation or a blog post. It could probably even be used to load and apply a regular rel=stylesheet link asynchronously, and at a low priority, which is otherwise surprisingly hard to do (note: I didn’t test this idea much to say for sure).
J’ai cette page ouverte dans un onglet depuis littéralement des années. C’est Alexis qui me l’a rappelé en partageant htmz aujourd’hui qui va un tout petit peu plus loin.
Voilà le code en question :
<iframe
src="/static/david/2024/test-injection.html"
onload="
this.before(
(
this.contentDocument.body||this.contentDocument
).children[0]
);
this.remove()
"
hidden>
</iframe>
En résumé, on prend le code l’iframe et on l’injecte au chargement dans le document en cours. Voici un exemple (pas sûr que ça fonctionne depuis un agrégateur…) :
J’ai ajouté l’attribut hidden à la proposition initiale pour éviter le flash. Si vous inspectez le code, vous constatez que le paragraphe précédent tout à fait classique alors qu’il s’agissait d’une iframe (sauf si vous avez une extension qui bloque les iframe bien sûr). Jusque là c’est une forme d’inclusion
[archive] mais rien de bien utile.
Ce qui devient un peu plus fou serait de pouvoir injecter un Web Component de cette façon ! Le problème étant que le this.remove() est exécuté avant le chargement du script de l’iframe… et si on le retire on conserve cet élément hidden dans le document. Ce n’est pas critique mais ce n’est pas très élégant non plus, d’autant que cela signifie que le composant est défini et instancié deux fois.
Il y a probablement des choses qui m’échappent mais il se fait tard.
To be continued…
Découvertes du jour : <base> et globalThis.
Aussi, il n’est pas forcément indiqué de générer une SECRET_KEY avec Django, il vaut mieux le faire en Python directement :
[depuis un shell]
$ python3 -c 'import secrets; print(secrets.token_hex(100))'
So, what’s the fun of writing on the internet anymore? Well, if your aim is to be respected as an author, there’s probably not much fun to be had here at all. Don’t write online for fame and glory. Oblivion, obscurity and exploitation are all but guaranteed. Write here because ideas matter, not authorship. Write here because the more robots, pirates, and single-minded trolls swallow up cyberspace, the more we need independent writing in order to think new thoughts in the future — even if your words are getting dished up and plated by an algorithm.
What’s the fun in writing on the internet anymore?
[archive]
Rester (et alimenter la machine) ou quitter (et laisser l’espace à la machine).
Je n’aime pas beaucoup la métaphore de la forêt noire [archive] ces temps-ci car j’apprécie un peu trop les forêts pour ça. J’aurais davantage l’impression de faire partie d’une haie alors qu’il y a beaucoup de monoculture aux alentours. Avec les double sens que cette méta·phore implique.
Tooltipopover
Popover API – This provides a declarative mechanism to create content that always renders in the topmost-layer, so that it overlays other web page content. This can be useful for building features like tooltips and notifications. Support for popover was the #1 author request in the recent State of HTML survey.
Ma première intuition pour enrichir les liens de la version archivée était de passer par des éléments natifs (comme toujours). Initialement, j’ai même envisagé un élément <dialog> qui est déjà mieux supporté mais ça rentrait mal dans le DOM là où je voulais l’insérer. Je me met alors en quête d’un polyfill pour la Popover API qui pourrait convenir mais j’ai un peu peur des effets de bord vu que je découvre et qu’il y a quand même pas mal de possibilités. J’en suis même à me lire une bonne page de doc
[archive] pour essayer de comprendre la distinction entre les deux.
Je finis par abandonner cette piste et je me dis que ça pourrait être un Web Component intéressant. Je m’arrache les cheveux un bon petit moment sur le positionnement et je capitule en me disant qu’il y a déjà des personnes qui ont produit des outils comme Floating UI ou Tippy.js. Choisir c’est renoncer… et j’ai fait les deux à la fois en optant pour Tippy qui prend soin de l’accessibilité [archive]. J’ai trop besoin d’avoir l’expérience de l’interface pour pouvoir affiner par la suite et faire les choses à ma sauce.
N’hésitez pas à jouer avec et à me faire des retours, c’est amené à évoluer.
My recipe for fiction set ten years in the future used to be 90% already-here, 9% not-here-yet but predictable, and 1% who-ordered-that. But unfortunately the ratios have changed. I think we're now down to maybe 80% already-here —climate change takes a huge toll on infrastructure— then 15% not-here-yet but predictable, and a whopping 5% of utterly unpredictable deep craziness.
Cela me rappelle une discussion récente au sujet du manque de pertinence de la météo et de la difficulté à faire de la prédiction sur des données rendues obsolètes par le changement climatique. Les modèles ne sont pas (encore ?) adaptés à un tel chaos.
Manifestement, les écrivains non plus.
Someone out there is working on it: a geolocation-aware social media scraping deep learning application, that uses a gamified, competitive interface to reward its “players” for joining in acts of mob violence against whoever the app developer hates. Probably it has an inoccuous-seeming but highly addictive training mode to get the users accustomed to working in teams and obeying the app's instructions—think Ingress or Pokemon Go. Then, at some pre-planned zero hour, it switches mode and starts rewarding players for violence—players who have been primed to think of their targets as vermin, by a steady drip-feed of micro-targeted dehumanizing propaganda delivered over a period of months.
Ibid.
Ah si en fait 😬.
If we want a system that is consistent with the flourishing of life on earth, we will need a system that mimics nature. Our current economic model doesn’t - for many reasons - and needs to change. Looking at nature, including our own human nature in our private lives, gives us many ideas for what this new, harmonious system could look like.
Il n’y a que les classes moyennes qui peuvent être socialistes. C’était tout l’enjeu de leur destruction pour n’avoir plus que des personnes qui aient peur de perdre le trop peu ou le vraiment beaucoup qu’elles ont. Et la peur rend la manipulation tellement plus facile…
If a monkey hoarded more bananas than it could eat, while most of the other monkeys starved, scientists would study that monkey to figure out what the heck was wrong with it. When humans do it, we put them on the cover of Forbes.
Ibid.
🙈
Déploiement
Ce qui me fait penser que cela fait plusieurs fois que je veux demander comment David déploie son site.
Mes dépôts contiennent le HTML généré car c’est ce que je considère comme étant la version pérenne de mes écrits donc je ne souhaite pas avoir une génération sur le serveur. Cela fait grossir le dépôt mais ça offre une tranquillité d’esprit de pouvoir observer les différences lorsque je modifie le moteur.
Il se trouve que ces dépôts sont sur le même serveur que celui qui sert les pages HTML que vous voyez. Je lance donc une commande distante avec minicli qui va faire une archive du dépôt git au bon endroit sur le serveur :
git archive --remote=larlet-fr-index.git master | tar -x -C larlet-fr
git archive --remote=larlet-fr-david.git master | tar -x -C larlet-fr
git archive --remote=larlet-fr-david-cache.git master | tar -x -C larlet-fr/david
[…]
J’itère ainsi sur chacun des dépôts concernés et l’avantage c’est que je peux donner un sous-dossier à la commande tar selon où je veux placer le contenu dans l’arborescence. Par exemple, ci-dessus, les articles archivés larlet-fr-david-cache.git arrivent directement dans mon dossier personnel larlet-fr/david. Il faut tout de même vérifier de ne pas écraser ses propres dossiers/fichiers.
Le déploiement met à ce jour une trentaine de secondes. Ce n’est pas optimisé mais je n’ai pas besoin de l’optimiser.
I therefore officially announce 2024 to be the year when the square checkbox has finally died.
À quand une petite coche sur les futurs toggle/switch natifs [archive] ? Ou pire ? 🙈
R.I.P. les boutons [archive] aussi…
Les poètes et écrivains évitaient tous la colère des rois et des puissants par l’utilisation de métaphores. Mais c’est justement par cette analogie que cela devient intéressant.
Les empires informatiques d’aujourd’hui comme exemples de l’absolutisme du pouvoir des siècles précédents posent la question plus qu’intéressantes sur la liberté d’expression. Quand tout l’espace de notre expression transite par un domaine privé et commercial, nous ne sommes plus dans l’espace public de notre expression mais bien dans cet espace contrôlé. Que devient le sens de notre communication si dès que nous sommes sur ces espaces, l’expression devient plus limitée que celle que l’espace public permet.
Il est interdit de parler anglais dans les écoles québécoises. Il n’en fallait pas beaucoup plus pour que les élèves aient envie de l’apprendre et d’échanger entre eux dans cette langue. Oppression + contre-pouvoir = culture commune.
Aussi, l’enseignement de l’anglais est relativement médiocre pour une province qui insiste sur le bilinguisme. Difficile d’en mesurer l’intention.
[…] Je ne sais pas ce qui est le plus important, préserver un nom de domaine n’est qu’une partie. Préserver le contenu derrière le nom de domaine est plus difficile. Il faut penser serveurs, mise à jour de sécurité, les technologies utilisées, etc.
Le No JS pour les sites Web est rarement mentionné pour la longévité du contenu. Et pourtant c’est une pièce fondamentale.
Peut-être il serait plus important de penser à ce que les autres voudront préserver plutôt que de penser à ce que nous voulons transmettre. De même que voulons nous préserver des générations antérieures pour nous aider à mieux penser notre propre disparition.
Peut-être que si chaque personne avait sa propre archive des publications des autres, on aurait accès à un réseau de citations distribuées qui contribueraient à cette préservation. Et qui auraient été considérées comme étant « pertinentes » par les lecteur·ices ? Les guillemets sont importants car citation ne veut pas forcément dire caution ou intérêt le plus grand. Par exemple, l’anecdote
[archive] Je me pose de sérieuses questions sur l’image que nous renvoyons à notre enfant.
me fait beaucoup réfléchir et me donne envie de la conserver sans forcément la citer. Comment combiner réactions publiques et souvenirs plus intimes ?
Maintenant je vais vouloir citer encore plus d’articles de Karl (-:.
PS : Un réseau de flus ou readeck serait aussi une option s’ils pouvaient devenir un des nœuds d’une archive distribuée et collective.
Vieillesse
Je travaille dans des équipes techniques informatiques, le web, les nouvelles technologies, les startups. Autour de moi je ne vois que des jeunes, avec quelques rares personnes de ma génération.
Il n’y a quasiment aucune personne de 50 ans ou plus dans les équipes techniques. Les exemples que j’ai en tête sont quelques pointures nationales ou internationales, pas du tout représentatives du métier.
Cet onglet d’Éric D. est ouvert dans mon navigateur depuis plus d’un an (rassurez-vous, il était bien entouré avec au moins 300 collègues). Le temps passant, je me pose également ces questions…
Il y a deux aspects :
- Jusqu’à quand est-ce que l’on aura besoin de moi ?
- Jusqu’à quand est-ce que j’aurai besoin de coder ?
Sur la première, j’ai l’impression que l’expérience de base s’accumule et aura toujours une certaine valeur, je ne vois pas vraiment de plateau depuis 25 ans mais des centres d’intérêts qui évoluent plutôt en étoile. Certains sont des impasses — ou mis en dormance plus ou moins prolongée —, d’autres sont temporels et/ou gagnent un regain d’intérêt au gré de produits et de rencontres. Ce n’est pas tant d’avoir appris à apprendre que d’avoir croisé suffisamment de situations pour permettre à des équipes de sauter certains fossés ou sentir lorsqu’il y a un outil / techno / pattern qui vaut le coup. Je ne me sens pas obsolète et encore moins face à une IA-llucinante actuelle qui nécessite cette expérience.
C’est le deuxième point qui est critique car il touche à l’envie et peut-être que d’ici quelques années la technique m’intéressera moins pour plein de raisons (stagnation, répétition, sentiment d’inutilité, consommation de ressources, etc). Et peut-être que le code ne sera plus alors une expression de ma personnalité à laquelle je voudrai consacrer autant de temps. Et peut-être que je n’aurai plus envie de transmettre non plus à des personnes moins expérimentées pour ces mêmes raisons. Aujourd’hui, derrière ce besoin de coder, il y a cette nécessité d’apprendre en continu et de me sentir capable d’avoir un semblant d’impact sur ce monde.
Je peux aussi considérer que je ne suis qu’à la moitié de ma carrière technique. C’est vertigineux exprimé ainsi. Et pourquoi pas.
After almost 10 years of remote work, it would be close to impossible for me to go back to an office.
J’ai souvent ce sentiment (je partage les autres points de l’article aussi). Je ne sais pas du tout ce que ça ferait de retourner dans un bureau mais au-delà de cette hypothèse physique, c’est le côté avec subordination / pyramidal que j’ai l’impression d’avoir dépassé sans vraiment de possibilité de retour en arrière. Il n’y a que dans des collectifs bien spécifiques que j’aurais une chance de trouver une place qui me soit acceptable.
Voir aussi cette discussion à ce sujet.
J’ai de plus en plus de mal avec les légalistes donneurs de leçons qui utilisent le ton le plus anxiogèno-aggressif qui soit. La vieillesse a ceci de bon que je commence à savoir retourner ces situations en interrogeant les intentions et les peurs de ces personnes.
The big one is that the logical alternatives to Node – the “no Node” work environments developers are likely to reach for aren’t going to be based on JavaScript. Import maps mean that browsers effectively have an API surface that non-JS projects can use to build a dependency management system. Much of the tooling surrounding JavaScript is now implemented in Rust, not JS – much of it driven by Deno itself – and that makes it more easily accessible outside both the Node and Deno ecosystems.
Je partage l’analyse de Baldur, l’avenir est à la rouille. De Biome à Ruff en passant par rye ou hurl pour n’en citer que quelques uns, Rust est en train de devenir un véritable atout pour tout ce qui est outils-performants-autour-du-web.
Les (vieilles) mauvaises langues pourraient dire que l’on arrive au bout de la décennie tout-JS, surtout avec l’arrivée de WebAssembly+Python 🤞.
Impact
If front web developers work closer to the users’ needs and problems, if they feel more implicated in the user experience, they will understand the impact of what they are building and will naturally adopt the strengths of the front web. […]
Maybe, in order to fix the front web, we have to fix human nature: make things less about money and self-satisfaction, and more about improving people’s lives and understanding the impact of what we are creating.
Même si je m’émeus encore de l’esthétique d’un Web Component ou d’une nouvelle technique CSS, j’essaye d’être plus attentif au fil des ans à l’impact potentiel des bouts de code que j’assemble. C’est là où les démo [archive] prennent tout leur sens pour vérifier la pertinence de ce qui a été produit. Se libérer de l’égoïsme technique pour aller vers le soin porté aux utilisateur·ices, essayer de comprendre leurs besoins, synthétiser, proposer, se tromper, recommencer. Dans une spirale d’essais-erreurs, on se rapproche d’un centre enviable où les contraintes techniques sont minimisées et les besoins proches d’être comblés. Chaque partie ayant un petit peu appris sur l’autre au cours de ce bout de chemin commun.
Une carrière est la cartographie de ces expériences. Savoir identifier les optima locaux qui ont pu procurer de la joie ainsi que les lieux de convergence où l’on aime bien aller car il y a le bon dosage effort / récompense. Apprendre à reconnaître les sentiers hasardeux où l’on a déjà laissé des plumes et reconnaître aussi qu’un contexte et des personnes peuvent changer.
Admettre que l’on a soi-même changé tout au long de ce cheminement.
At most software startups, customers typically don’t care if your product runs on Heroku, Kubernetes, or a really brittle singly-homed machine in Joe’s closet. No purchasing decisions hinge on your commitment to write servers in Rust or use Nix for hermetic everything. And although they might exist, I have sadly never had a customer write a testimonial for the elegant collection of internal services involved in responding to that single HTTP request.
No; customers are not paying for, nor give a shit about, these things. Sorry. It’s still cool stuff. It’s just not what you’re selling.
Customers want software that delivers problem-solving impact. And at the early stage, which is all the way until you’ve reached product-market fit, they’re almost certainly not getting enough, fast enough. You should be spending as much time as you can at this level of the stack, The Product: thinking, building, learning.
You can’t make an article on a UX topic without showcasing a practical example. Let’s explore examples that I spotted on the web and how to fix them.
Superbe article de Ahmad Shadeed. En résumé, il faut soigner ses paddings mais il y a pas mal d’astuces CSS pour y arriver dans certaines conditions. Je retiens notamment l’usage d’un :after pour ça lorsqu’il s’agit d’icônes notamment :
.search__filter:after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
transform: scale(2);
}
Je découvre au passage qu’il y a pas mal d’options d’accessibilité dans Polypane que j’utilise depuis peu et que je n’ai pas pleinement exploré.
Appariement
Je me réveille avec une envie d’expérimentations typographiques. Après une nuit de réflexion, ce sera Century Supra qui fera la paire avec Concourse pour du sans serif (oui, je suis fan du travail de Matthew Butterick depuis très longtemps). Il va falloir que je m’habitue à ce que mon édition dans iA Writer ne ressemble plus au rendu sur la prévisualisation du site.
Au niveau de la taille, j’ai enfin l’occasion de tester un échelle modulaire et c’est suffisamment adaptatif pour le moment. Il faudra que je retravaille certains espacements mais je n’en suis pas encore à cette étape. Je ne comprends pas encore tout à fait la formule et j’arrive à vivre avec.
Je me rappelle aussi qu’un des intérêts que j’avais trouvé aux CSS layers c’est de pouvoir mieux documenter la CSS alors je sors les styles en ligne de l’itération d’hier pour avoir une feuille dédiée dont je commence à documenter les différentes sections.
Je m’amuse comme un petit fou même si la CSS fait subitement 350 lignes.
Je crois qu’on écrit pour créer un monde dans lequel on puisse vivre. Je ne pouvais vivre dans aucun de ceux qui m’étaient proposés : le monde de mes parents, le monde de la guerre, le monde de la politique. Il me fallait créer un monde à moi, comme un climat, un pays, une atmosphère, où je puisse respirer, régner et me régénérer lorsque j’étais détruite par la vie.
Journal 1947-1955, Anaïs Nin
L’introduction de Alors nous irons trouver la beauté ailleurs par Corinne Morel Darleux m’aura suffit pour aujourd’hui 🙂.
On a couru 10 km avec l’enfant. À ce rythme là, je ne sais pas si je vais pouvoir suivre longtemps ! La récompense a été de croiser un renard urbain de vraiment très près, moins de 5 mètres, que l’on a bien eu le temps d’observer vu qu’il courrait vers nous. Par contre un flasque de plus de 10 ans s’est percée dans ma poche pendant la course, j’étais bien trempé avec du vent. Il faisait -6°C.
Tout ça pour aller chercher un bidon d’huile pour la transmission de la voiture.
Fondations
Tellement de choses sont dorénavant possibles en CSS, je suis submergé par l’ampleur de la tâche. J’ai envie d’essayer trop de choses : des grids, des layers, des fonctionnalités avancées de typographie, que cet espace redevienne un terrain de jeu dans ce domaine car je sens bien que j’ai un peu délaissé cet aspect au fil du temps.
Je commence par regarder à quoi ressemble une page nue avec la précédente sémantique HTML. Ce n’est pas si mal mais les icônes en SVG pourraient avoir des dimensions plus appropriées. Je les retire, il est temps de gagner en légèreté. Je regarde à quoi ressemblent des reset modernes :
- A (more) Modern CSS Reset par Andy Bell ;
- My Custom CSS Reset par Josh W. Comeau ;
- CSS Remedy par Jen Simmons et Miriam Suzanne ;
- A tiny modern CSS reset par Jeremy Thomas.
J’aimerais commencer ma CSS par @layer reset mais c’est sur du Baseline™ 2022. Toujours cette tension entre jouer avec les nouveautés sans exclure pour autant une partie de l’auditoire potentiel. Au pire, cette page nue est consultable et le flux devrait être supporté partout. Peut-être que je n’ai pas besoin d’avoir des CSS layers mais quand je fais une refonte de cet espace je ne suis pas que sur le besoin. J’obtiens un reset que j’imagine fonctionnel mais il est un peu frustrant d’arriver à un résultat finalement moins lisible que ce que j’avais sans aucun styles. Commencer par déconstruire pour reconstruire est probablement l’un des maux de notre culture. Ne pas accepter qu’il puisse exister quelque chose de suffisant sur lequel s’appuyer. Une attitude de colon.
Je finis par tout jeter / ré-interroger et je m’en sors avec 6 règles.
J’ai besoin de voir mon texte en action pour pouvoir le travailler. Qu’il passe de lisible à enviable, que sa fabrique — coucou Antoine [archive] — fasse partie intégrante de sa création+diffusion. C’est le texte que je suis en train d’écrire qui est le modèle. Je commence par adoucir les contrastes et à centrer quelques éléments. Puis j’applique cette astuce pour avoir des citations à fond perdu tout en centrant le texte de l’article. J’ai envie de leur donner la place qu’elles méritent dans mes publications.
Je suis satisfait de mon résultat très minimaliste du jour.
Le long trajet est essentiel. Surtout ne pas se laisser tenter par un livre, un ordinateur de poche, ou autres artifices. L’ennui permet l’étincelle des rêveries, tout comme la nuit la profondeur des rêves.
🧡
Plus tard, je me rends compte en voulant faire les choses proprement que j’avais déjà fait des essais il y a un peu plus d’un an :
Je ne sais pas trop quoi en penser, c’est toujours marrant de retrouver de vieilles tentatives. De mémoire, c’était déjà plus pour m’amuser avec les layers qu’une refonte sérieuse (et cette typo 😱 (Bizmeud, en retraite)). Il n’est pas exclus que les essais actuels finissent également à la poubelle.
Tiens, est-ce que j’arrive à faire déborder l’image du flux aussi ? Oui, et ça ouvre des perspectives d’agencements photographiques à explorer…