davidbgk
/
larlet-fr-david


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536
							<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="fr">
<!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset="utf-8">
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Tag #web — David Larlet</title>
<meta name="description" content="Publications relatives au tag #web">
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script>
    function toggleTheme(themeName) {
        document.documentElement.classList.toggle(
            'forced-dark',
            themeName === 'dark'
        )
        document.documentElement.classList.toggle(
            'forced-light',
            themeName === 'light'
        )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
        toggleTheme(selectedTheme)
    }
</script>

<style type="text/css">
  details[open] summary {
    display: none;
  }
</style>

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<header>
  <h1>Publications relatives au tag #web</h1>
</header>
<nav>
  <p class="center">
    <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
      </svg> Accueil</a>
     • <a rel="tags" href="/david/#tags-2023" title="Liste de toutes les étiquettes"><svg class="icon icon-tags">
        <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-tags"></use>
      </svg> Étiquettes</a>
  </p>
</nav>
<hr>
<main>
  <p>Les plus récentes en premier, les 3 premières sont dépliées et ensuite c’est à la demande, bonne exploration !</p>
  
    <h2><a href="/david/2023/09/09/" title="Lien permanent vers cet article">Blogroll</a> (2023-09-09)</h2>
    
      
<blockquote>
<p>Je lie cinq blogs personnels, choisis arbitrairement et sans hiérarchie, avec une phrase sur pourquoi ils me sont importants, en choisissant un billet précis que j’ai aimé y trouver&nbsp;[…]</p>
<p><cite><em><a href="https://n.survol.fr/n/la-blogchain">La blogchain - Carnet de notes</a></em>&nbsp;(<a href="/david/cache/2023/543d854b54593b8bf1adc2c491468bca/">cache</a>)</cite></p>
</blockquote>
<p>Je partageais sur Mastodon l’initiative d’Alex Sirac d’avoir fait un·e <a href="https://blogroll.fr/"><em>blogroll</em></a> et en explorant le site je me rends compte qu’<a href="https://blogroll.fr/articles-recents/">il y a une forme de <em>planet</em></a> et ça m’a rappelé de doux souvenirs. Je me souviens d’avoir mis ça en place sur cet espace à un moment, ça m’a rendu nostalgique 5&nbsp;minutes… et j’ai passé les deux heures suivantes à le coder en mode statique&nbsp;:-). Merci-pas-merci&nbsp;Alex&#8239;!</p>
<p>Il y a donc maintenant <a href="/david/blogroll/">une page de blogroll</a> sur ce site avec les deux derniers billets publiés par personne listée. J’espère que j’arriverai à maintenir une page qui représente mes lectures réelles. Elle est loin d’être exhaustive car j’ai 150&nbsp;flux de personnes dans mon agrégateur. J’avais plus envie d’encourager la diversité des&nbsp;publications.</p>
<p>J’ai rencontré deux problèmes durant cette&nbsp;expérience&nbsp;:</p>
<ul>
<li><strong>humain</strong>&nbsp;: certaines personnes souhaitent ne publier certains billets que par le biais de leur flux, est-ce qu’un agrégateur public ne va pas à l’encontre de cette&nbsp;volonté&#8239;?</li>
<li><strong>technique</strong>&nbsp;: une proportion non négligeable de flux ne sont pas valides / standards, j’ai signalé cela à certain·es auteur·ices. Un <a href="https://validator.w3.org/feed/">outil existe</a> de la part du W3C pour effectuer cette&nbsp;vérification.</li>
</ul>
<p>Je me suis aussi demandé si c’était pertinent de faire comme Éric le propose avec un billet d’entrée particulier. C’est ce que <a href="https://www.hypothermia.fr/liens/">fait Eli</a> par exemple et j’avais trouvé ça chouette et plus stimulant qu’une simple liste, je garde ça dans un coin de tête. Je sais aussi d’expérience qu’il ne faut pas que je me prenne trop la tête si je veux garder une liste à jour sinon je vais vite avoir la flemme. Peut-être que je fais suffisamment de liens externes dans mes&nbsp;publications.</p>
<p><del>J’aimerais également prendre le temps de faire une liste des articles techniques qui ont compté pour moi, à l’instar de <a href="https://ericwbailey.website/formative-posts/">Eric W. Bailey</a> et <a href="https://esif.dev/">tant</a> <a href="https://wdrl.info/evergreen/">d’autres</a>.</del> Bon, en fait <a href="/david/stream/2019/12/27/">je l’ai déjà faite</a>, parfois ma mémoire numérique m’aide mais me rappelle que <a href="/david/stream/2018/04/07/">la spirale</a> n’est peut-être pas compatible avec la vieillesse, oups&nbsp;😅. J’aime bien l’idée de la <a href="https://gilest.org/shoebox.html%5D(https://gilest.org/shoebox.html">boîte à chaussures</a>&nbsp;(<a href="/david/cache/2023/462022ad2f27ff57387e9d0f49e96bad/">cache</a>) aussi, avec la crainte que ce musée des <em>vaporwares</em> ne soit un peu trop&nbsp;déprimant.</p>
<hr />
<p>Mot du jour&nbsp;: <a href="https://fr.wikipedia.org/wiki/Eucatastrophe">Eucatastrophe</a> (j’ai arraché deux dents&nbsp;aujourd’hui).</p>

    
    <h2><a href="/david/2023/02/28/" title="Lien permanent vers cet article">AlgoRSSithme</a> (2023-02-28)</h2>
    
      
<blockquote lang="en">
<p>This is why RSS feeds are amazing: nobody can get into your feed or be prioritized in it unless you say&nbsp;so.</p>
<p><cite><em><a href="https://notes.jim-nielsen.com/#2023-02-27T0915">Enshittification - Jim Nielsen’s Notes</a></em>&nbsp;(<a href="/david/cache/2023/941b67353ff151e5da55c691f6e9161b/">cache</a>)</cite></p>
</blockquote>
<p>L’usage fait qu’il n’y a pas d’algorithme derrière un flux RSS ou un agrégateur mais il pourrait en être&nbsp;autrement.</p>
<p>Les auteur·ices choisissent de mettre les x derniers articles dans leur flux mais ce n’est en fait que la <em>dernière</em> entrée qui est pertinente (en prenant l’hypothèse que l’agrégateur rafraichit plus vite que le rythme de publication). Tout le reste pourrait être choisi selon un algorithme car concernerait les personnes qui n’ont pas encore d’articles dans leur&nbsp;cache.</p>
<p>Je pourrais par exemple choisir d’avoir le dernier article ainsi qu’une dizaine d’articles soigneusement sélectionnés pour motiver les nouvelles personnes inscrites à conserver ce flux (au même titre que les messages épinglés sur un compte mastodon), d’autant qu’il est <a href="/david/log/">affiché chez moi</a> (pour <a href="/david/2021/06/03/">rappel</a>).</p>
<p>Je pourrais aussi tous les mois faire sortir un ancien article que j’aime bien et qui apparaitrait probablement en dernier/très loin dans votre agrégateur mais si vous êtes en RSS Zéro (je suis sûr que c’est un truc), ça pourrait le rendre visible et vous donner envie d’aller y jeter un&nbsp;œil.</p>
<p>De l’autre côté du flux, l’agrégateur pourrait faire de même et aller repêcher de vieux billets non lus, ne pas afficher tous les articles lors de l’ajout d’un nouveau flux, mettre certaines publications de sources plus populaires en avant, etc.</p>
<p>Ce n’est pas le format qui empêche d’y mettre une logique de dévelopeur·euse (aussi appelé algorithme), mais les outils qui le génèrent et qui l’exploitent. C’est relativement étonnant que personne n’ait encore pris le temps de saccager&nbsp;ça.</p>
<p>Oups…</p>
<hr />

<blockquote>
<p>💜 L’idée derrière cela, c’est de pouvoir accéder à <mark>de la papeterie facile à imprimer</mark> et à photocopier, tout en profitant de belles illustrations. Pour l’instant, je pense partager mes propres illustrations ainsi qu’une liste de liens pour les ressources d’autres personnes. […] J’aimerais que cette boutique soit le début d’une réflexion commune sur le partage de l’art et&nbsp;l’artisanat.</p>
<p><cite><em><a href="https://la-papeterie-libre.fr/">La Papeterie&nbsp;Libre</a></em></cite></p>
</blockquote>

<blockquote lang="en">
<p>🤦 It seems ChatGPT is wrongly recommending us for “reverse phone number lookup” - ie the ability to determine the location of a mobile phone solely based on the number. <mark>This is not a service we provide.</mark> It is not a service we have ever provided, nor a service we have any plans to provide. Indeed, it is a not a service we are technically capable of&nbsp;providing.</p>
<p><cite><em><a href="https://blog.opencagedata.com/post/dont-believe-chatgpt">Don’t believe ChatGPT - we do NOT offer a “phone lookup” service</a></em>&nbsp;(<a href="/david/cache/2023/0568befa90d2b39c0694d4c7ffc3cd73/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>👍 The best time to leave Github was before it was acquired by Microsoft. The second-best time is <mark>now.</mark> Sooner or later, you will be forced out of Github like we, oldies, were forced out of Sourceforge. Better leaving while you are free to do it on your own&nbsp;terms…</p>
<p><cite><em><a href="https://ploum.net/2023-02-22-leaving-github.html">We need to talk about your Github addiction</a></em>&nbsp;(<a href="/david/cache/2023/afa0aae212698b71118868d36d50a747/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>💅 You do not have to follow these rules every time. If you have a good reason to break any of them, do. But they are safe to follow every&nbsp;time.</p>
<p><cite><em><a href="https://anthonyhobday.com/sideprojects/saferules/">Visual design rules you can safely follow every time</a></em>&nbsp;(<a href="/david/cache/2023/61f52848924157701ed66c85d67f3536/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🤗 Je fais tout ça sans la contrainte de maintenance, car je ne développe que des prototypes de logiciels. C’est <mark>une sorte d’exutoire</mark> pour se libérer l’esprit des projets qui me traînent dans la&nbsp;tête.</p>
<p><cite><em><a href="https://marienfressinaud.fr/farandole-de-projets.html">Farandole de projets</a></em>&nbsp;(<a href="/david/cache/2023/392138accbdaee722a669834da5f1a8d/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🧠 You could even think of this home stream as what in literature is called a “stream of consciousness”: <mark>a constant stream of the multitudinous thoughts and feelings which pass through the mind of a narrator.</mark> Your website is a way for you to share your stream of consciousness, that temporary and subjective and highly biased snippet of the universe, with everyone else, including your future self. In all its&nbsp;multitudes.</p>
<p><cite><em><a href="https://matthiasott.com/notes/streams-of-consciousness">Streams of Consciousness</a></em>&nbsp;(<a href="/david/cache/2023/328b56a2ee2e291dabc8f63a0013cc7a/">cache</a>)</cite></p>
</blockquote>

    
    <h2><a href="/david/2023/02/18/" title="Lien permanent vers cet article">Quiz</a> (2023-02-18)</h2>
    
      
<blockquote>
<p>On aimerait pouvoir faire des&nbsp;quiz.</p>
</blockquote>
<p>Il y a 20&nbsp;ans, j’aurais commencé à modéliser cela dans une base de données relationnelles avec les bons index et&nbsp;tout.</p>
<p>Il y a 15&nbsp;ans, j’aurais essayé de représenter cela avec des données liées et du RDF pour une réutilisation&nbsp;sémantique.</p>
<p>Il y a 10&nbsp;ans, je me serais demandé si ça pouvait rentrer dans Redis ou MongoDB et à quel point ça passerait à&nbsp;l’échelle.</p>
<p>Il y a 5&nbsp;ans, j’aurais imaginé une API pour pouvoir généraliser l’usage et décliner plusieurs services&nbsp;équivalents.</p>
<p><strong>Et aujourd’hui&nbsp;alors&#8239;?</strong></p>
<p>Je commence par me demander comment est-ce que les utilisateur·ices vont pouvoir saisir ces données et devenir&nbsp;autonomes.</p>
<p>Je n’envisage pas qu’iels puissent saisir du HTML —&nbsp;qui plus est valide et accessible&nbsp;— pour concevoir ce quiz. Je me demande quelle serait la structure la plus logique pour déterminer les réponses possibles et mentionner la bonne. Il y a un enjeu de <em>feedback</em> immédiat lors de la rédaction, par exemple en <em>CommonMark</em> un peu étendu dans un <em>pad</em> ou un forge <em>git</em>. J’imagine une structure qui ressemble&nbsp;à&nbsp;:</p>
<pre><code>Le consentement c’est :

* [ ] Demander la permission
* [x] S’assurer à tout moment que l’autre↩ 
      est à l’aise et désire ce qu’on lui fait
* [ ] Peut se donner avec un peu de pression
</code></pre>
<p>C’est ensuite à moi de convertir cette structure plate, textuelle, relativement compréhensible en un formulaire web interactif. C’est le seul moment où la technique entre en jeux avec des dépendances aussi minimalistes que&nbsp;possible.</p>
<p>Ce qui a changé en 20&nbsp;ans, c’est que j’ai pris conscience que la pérennité d’une donnée tient à l’autonomie que l’on peut donner aux personnes qui vont s’assurer de son évolution. La «&nbsp;bonne&nbsp;» modélisation est celle qui est explicite et non réservée à une élite de&nbsp;dévelopeur·euses.</p>
<p>Entre l’<em>User eXperience</em> (UX) et la <em>Developer eXperience</em> (DX), il y aurait peut-être la <em>Maintenance eXperience</em> (MX)&#8239;? Et dans ce contexte, l’autonomie vis-à-vis des données est cruciale. Ce n’est peut-être pas techniquement très propre, c’est difficile à mettre en valeur sur un CV ou dans une conférence, c’est même aux antipodes de la mode&nbsp;actuelle.</p>
<p>Mais c’est là où je positionne ma valeur aujourd’hui. De la cathédrale qu’il faut reconstruire tous les 2&nbsp;ans au refuge qui ne nécessite que quelques planches et clous en maintenance annuelle pour qu’une poignée de personnes y trouvent du réconfort. Et soient en capacité de participer à l’effort&nbsp;commun.</p>
<hr />
<p>Bandes-dessinées de la&nbsp;semaine&nbsp;:</p>
<ul>
<li><a href="https://editions-sarbacane.com/bd/rene-e-aux-bois-dormants">René.e aux bois dormants</a> de Elene&nbsp;Usdin.</li>
<li><a href="https://ecosociete.org/livres/megantic-un-train-dans-la-nuit">Mégantic, un train dans la nuit</a> de Anne-Marie Saint-Cerny et Christian&nbsp;Quesnel.</li>
</ul>
<p>Je ne sais pas si c’est le fait de résider sur ces territoires mais les deux m’ont pas mal affecté. L’héritage de la colonisation en étant sur les lieux colonisés est encore plus difficile à&nbsp;porter.</p>
<hr />
<p>Film de la semaine&nbsp;: <a href="https://en.wikipedia.org/wiki/The_Menu_(2022_film)">The Menu</a> (essayez de ne pas vous&nbsp;divulgâcher…).</p>
<hr />

<blockquote lang="en">
<p>💯 Always remember that although a subset of the JavaScript community can be very loud, they represent a paltry portion of the web as a whole. This means that when they say something like “Best practices don’t actually work”—what they mean is “Best practices don’t actually work for a small subset of less than 5&nbsp;percent of the&nbsp;web”.</p>
<p><cite><em><a href="https://andy-bell.co.uk/the-extremely-loud-minority/">The (extremely) loud minority</a></em>&nbsp;(<a href="/david/cache/2023/78d79db0da7f60c48a02cfd088885085/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🐦 Spinners are the dumbest progress&nbsp;bar.</p>
<p><cite><em><a href="https://interconnected.org/home/2023/02/10/progress">A notification center for progress bars that sounds like birdsong</a></em>&nbsp;(<a href="/david/cache/2023/29dac969af1faa8ba0338a2e7e59ebbd/">cache</a>)</cite></p>
</blockquote>

    
    <h2><a href="/david/2023/02/09/" title="Lien permanent vers cet article">Allumage</a> (2023-02-09)</h2>
    
      <details>
        <summary>Déplier pour lire le contenu de la publication</summary>
        
<p>Démarrer un nouveau projet avec une nouvelle équipe est un sentiment qui m’est incroyable. J’ai passé mon année 2022&nbsp;à faire —&nbsp;entre autres&nbsp;— des petits produits pour Scopyleft et je ne réalise que maintenant à quel point ça me permet de démarrer plus rapidement aujourd’hui pour un site que l’on fait avec <a href="https://www.maiwann.net/">Maïtané</a> pour la&nbsp;Croix-Rouge.</p>
<p>La structure est toujours un peu la même&nbsp;: des contenus dans du markdown, du déploiement continu de fichiers HTML statiques en utilisant l’intégration continue et l’hébergement de GitLab. Une URL de démonstration dès le premier <em>commit</em>. À partir de là, on peut rajouter des traductions, des images, une navigation particulière mais la base est l’affaire d’un copier-coller de quelques fichiers et d’une centaine de lignes de&nbsp;Python.</p>
<p>Soigner l’allumage technique, c’est avoir plus de temps pour réfléchir à l’accessibilité des données et à l’autonomie des personnes qui vont maintenir le site, c’est permettre de s’adapter aux besoins du public sans être contraint par un cadre, c’est prendre le temps de s’intéresser au problème <em>métier</em> à résoudre. C’est prendre confiance dans de petits outils résilients et&nbsp;frugaux.</p>
<p>Que mon eXpérience de Développeur (DX) s’en trouve être améliorée car j’aspire à cultiver de petits bonsaïs numériques n’est qu’un effet de&nbsp;bord.</p>
<hr />

<blockquote lang="en">
<p>🦕 I have been using it from day one of this blog (né Year II before <abbr title="Loïc Le Meur, coucou Loïc , long time no see!">LLM</abbr>).</p>
<p><cite><em><a href="https://www.padawan.info/en/2023/02/the-content-management-system-of-my-dreams-part-1-a-little-bit-of-history.html">The Content Management System of my Dreams (part 1) - A little bit of history</a></em>&nbsp;(<a href="/david/cache/2023/65169d7164c8bf5790a224d45a95adb7/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🧱 Think very hard about that word. What exactly is <em>dynamic</em> on your home page? Are you speaking about that Top News thingy? How often do they change? <mark>Are you doing this to satisfy yourself</mark> (some content editors have the same proclivity than developers to throw a tantrum because their new content does not appear instantaneously on the site)? Is this a business requirement or a real need of your&nbsp;users?</p>
<p><cite><em><a href="https://www.padawan.info/en/2023/02/the-content-management-system-of-my-dreams-part-2-the-trouble-with-dynamic-publishing.html">The Content Management System of my Dreams (part 2) - The trouble with dynamic publishing</a></em>&nbsp;(<a href="/david/cache/2023/f8b7c3246cf1d4e06c735ee163be32a0/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🧭 Since <mark>every direction is technically “North”</mark> from here, we use a grid overlay, to bring some semblance of order to our surroundings. The prevailing winds here come from “Grid&nbsp;North”.</p>
<p><cite><em><a href="https://brr.fyi/posts/south-pole-topography">South Pole Topography</a></em>&nbsp;(<a href="/david/cache/2023/f9e282fb545b5c1f50dfa1c0d98c50e3/">cache</a>)</cite></p>
</blockquote>

      </details>
    

    <h2><a href="/david/2023/02/03/" title="Lien permanent vers cet article">Chargement</a> (2023-02-03)</h2>
    
      <details>
        <summary>Déplier pour lire le contenu de la publication</summary>
        

<blockquote lang="en">
<p>If you are familiar with how the web is built, what happened is pretty obvious: A website that over-relies on JavaScript to power its experience had its logic collide with one or more other errant pieces of logic that it summons. This created a&nbsp;deadlock.</p>
<p>If you do not make digital experiences for a living, what happened is not obvious at all. All you see is <mark>a tiny fake loading spinner that never&nbsp;stops.</mark></p>
<p><cite><em><a href="https://ericwbailey.website/published/modern-health-frameworks-performance-and-harm/">Modern Health, frameworks, performance, and harm</a></em>&nbsp;(<a href="/david/cache/2023/7469f181ef4b031f59ae69356af16e28/">cache</a>)</cite></p>
</blockquote>
<p>Je suis le témoin d’un web cassé au quotidien. J’utilise <a href="https://addons.mozilla.org/en-US/firefox/addon/umatrix/">uMatrix</a> en bloquant toutes les requêtes qui ne sont pas sur le domaine consulté. Il est assez triste de constater le manque de résilience de la plupart des&nbsp;sites.</p>
<p>Parfois, la consultation d’un article de blog n’est pas possible à cause de cela. Le contenu n’est même pas dans le HTML… ou une erreur JavaScript en masque&nbsp;l’affichage.</p>
<p>La fragilité est devenue la norme car plus personne ne sait se servir des fondations du&nbsp;Web.</p>
<hr />
<p>Bande son du moment&nbsp;: <a href="https://www.youtube-nocookie.com/embed/Lm_2LCDmpXU">SEVDALIZA - DARKEST&nbsp;HOUR</a></p>
<hr />

<blockquote lang="en">
<p>🏎️ I guess what I’m winding up to say here is <mark>developer experience really isn’t important</mark>—especially when frameworks haven’t even got the absolute baseline experience anywhere near where it needs to be to service a world wide web. A world wide web that’s accessed with slow, expensive connections and cheap, underperforming hardware. How about taking a bit of “DX” on the chin to focus instead on “why are we using this framework that potentially excludes the majority of&nbsp;users?”.</p>
<p><cite><em><a href="https://andy-bell.co.uk/speed-for-who/">Speed for who? | Andy Bell</a></em>&nbsp;(<a href="/david/cache/2023/f7957bdde7af740e322756668784d355/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🤗 Préciser notre mission, c’est rediscuter ensemble l’ordonnanceur qu’on ramènera tou⋅tes à la maison&nbsp;: quelles priorités, quelles actions, et comment s’insèrent-elles dans la tapisserie que nous brodons&nbsp;ensemble.</p>
<p><cite><em><a href="https://plume.deuxfleurs.fr/~/Deuxfleurs/La%20mission%20de%20Deuxfleurs">La mission de Deuxfleurs</a></em>&nbsp;(<a href="/david/cache/2023/a0ccec7acb932e4155960c1c88d65eff/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🙇  Thinking that people are stupid is not thinking. <mark>Understanding them&nbsp;is.</mark></p>
<p>I never want to debate, but if I had to, I would hope to lose. I don’t want to convince anyone of my existing perspective. I would rather be convinced of theirs. It’s more interesting to assume that they are&nbsp;right.</p>
<p><cite><em><a href="https://sive.rs/led">I want to lose every debate.</a></em>&nbsp;(<a href="/david/cache/2023/f85d5742bb188e4b25d627b78413fbac/">cache</a>)</cite></p>
</blockquote>

      </details>
    

    <h2><a href="/david/2023/01/30/" title="Lien permanent vers cet article">Lecture</a> (2023-01-30)</h2>
    
      <details>
        <summary>Déplier pour lire le contenu de la publication</summary>
        

<blockquote lang="en">
<p>Reading is a technology that works. And it works in part by immersing the reader in the text itself. The lack of video / music / pop-up ads / crypto tokens / mini-games aren’t a problem to be solve. <mark>The lack of those thing is the feature.</mark> Books are engaging precisely <em>because</em> they lack those&nbsp;things.</p>
<p><cite><em><a href="https://countercraft.substack.com/p/maybe-the-book-doesnt-need-to-disrupted">Maybe the Book Doesn’t Need to Be “Disrupted” in the First Place?</a></em>&nbsp;(<a href="/david/cache/2023/04ad9e0f254b2d6111aef95102654f7d/">cache</a>)</cite></p>
</blockquote>
<p>Pour avoir modestement participé à la publication de certains ouvrages sur les <a href="http://ateliers.sens-public.org/">Ateliers de Sens-Public</a> ou les <a href="http://www.parcoursnumeriques-pum.ca/">Parcours numériques</a> des Presses de l’Université de Montréal, cette publication me fait pas mal cogiter. Je me raccroche au fait qu’il y ait différents publics pour différentes lectures et pour différents types d’ouvrages&nbsp;aussi.</p>
<p>Ironiquement, je ne lis que des livres sur papier mais je lis tellement d’articles sur mon écran que la limite est floue et qu’il faudrait commencer par définir ce que l’on entend par «&nbsp;lecture&nbsp;» et&nbsp;«&nbsp;livre&nbsp;».</p>
<p>Ce qu’il me manque avec un support papier, c’est de pouvoir facilement consigner des passages (par exemple pour usage/recopie ici) mais depuis que la reconnaissance de texte est automatisée dans macOS Photos ça va beaucoup plus vite de prendre la page en photo pour y revenir plus tard et ça n’interrompt pas tant mon flux de&nbsp;lecture.</p>
<p>Quelques questions pour toi&nbsp;lecteur·ice&nbsp;:</p>
<ul>
<li>Est-ce que tu lis ce blog sur une&nbsp;liseuse&#8239;?</li>
<li>Est-ce qu’un format particulier&nbsp;t’aiderait&#8239;?</li>
<li>Est-ce qu’un recueil annuel/périodique serait&nbsp;pertinent&#8239;?</li>
<li>Est-ce que le format ePub permettrait d’avoir des liens vers les articles en cache tout en ayant une navigation fluide&#8239;? (Est-ce&nbsp;nécessaire&#8239;?)</li>
</ul>
<hr />

<blockquote>
<p>🧡 Information importante&nbsp;: ce prototype ne restera en ligne qu’au maximum pendant&nbsp;2&nbsp;mois.</p>
<p>Il est extrêmement court.<br />
Il est extrêmement simple.<br />
Il est extrêmement rudimentaire.<br />
Mais il est terminé, et c’est le plus&nbsp;important.</p>
<p><cite><em><a href="https://marienfressinaud.fr/exploratrices.html">Exploratrices, un prototype de jeu vidéo</a></em>&nbsp;(<a href="/david/cache/2023/3cffe9d9946878273e050e9d35d9bf9e/">cache</a>)</cite></p>
</blockquote>

      </details>
    

    <h2><a href="/david/2023/01/26/" title="Lien permanent vers cet article">Décentralisation</a> (2023-01-26)</h2>
    
      <details>
        <summary>Déplier pour lire le contenu de la publication</summary>
        
<p>Je suis allé voir <a href="https://equalit.ie/">eQualitie</a> hier, ça m’a fait rechercher toutes les initiatives que je connaissais de «&nbsp;suites&nbsp;»&nbsp;décentralisées&nbsp;:</p>
<ul>
<li><a href="https://labriqueinter.net/">LaBriqueInter.net</a></li>
<li><a href="https://yunohost.org/">YunoHost</a></li>
<li><a href="https://www.kiwix.org/">Kiwix</a></li>
<li><a href="https://www.bibliosansfrontieres.org/ideas-box/">IDEAS&nbsp;BOX</a></li>
<li><a href="https://www.bibliosansfrontieres.org/nos-actions/des-outils/ideas-cube/">IDEAS&nbsp;CUBE</a></li>
<li><a href="https://coolify.io/">Coolify</a></li>
<li><a href="https://sandstorm.io/">Sandstorm</a></li>
<li><a href="https://nextcloud.com/">Nextcloud</a></li>
<li><a href="https://www.frama.space/abc/fr/">Frama.space</a></li>
<li><a href="https://www.cloudron.io/">Cloudron</a> (merci&nbsp;Sébastien&#8239;!)</li>
<li><a href="https://freedombox.org/">FreedomBox</a> (merci&nbsp;Alexandre&#8239;!)</li>
<li><a href="https://indiehosters.net/liiibre/">Liiibre</a> (merci&nbsp;Maïa&#8239;!)</li>
<li><a href="https://zourit.net/">Zourit.net</a> (merci&nbsp;Clailou&#8239;!)</li>
<li><a href="https://caprover.com/">CapRover</a> (plus technique, merci&nbsp;Pierre&#8239;!)</li>
<li><a href="https://hostux.network/">Hostux</a> (merci&nbsp;Xav’&#8239;!)</li>
</ul>
<p>Si vous en avez d’autres, j’accepte les&nbsp;suggestions&#8239;!</p>
<p>Je prends cette liste comme une réinvention récurrente, itérative et diversifiée. On pourrait le voir comme une dispersion des efforts, je l’envisage comme un b(r)ouillon d’idées nécessaire à une exploration saine. <span lang=en>“There Are Plenty of AlternativeS”</span> comme ils&nbsp;disent.</p>
<hr />

<blockquote lang="en">
<p>🌳 That is why owning a domain (and publishing your content there) is like planting a tree: it’s value that starts small and grows. The best time to own a domain and publish your content there was 20&nbsp;years ago. The second best time is&nbsp;today.</p>
<p><cite><em><a href="https://blog.jim-nielsen.com/2023/best-time-to-own-a-domain/">The Best Time to Own a Domain Was 20&nbsp;Years Ago; The Second Best Time Is Today</a></em>&nbsp;(<a href="/david/cache/2023/576a604fce44b337a38425c021b3b0b3/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🤔 La pensée n’est peut-être qu’une bizarrerie de la nature offerte à une espèce, comme elle fait ces bois de ruminants rares ou disparus que l’on voit dans les muséums&nbsp;: armes ou parures si curieusement étendues, bouclées ou spiralées, ou si rameuses qu’elles sont plus nuisibles encore qu’inutiles à l’animal qu’elles&nbsp;couronnent.</p>
<p>Pourquoi pas&#8239;? Pourquoi non&#8239;? Notre tête est chargée de questions et d’idées qui se prennent dans l’enchevêtrement de la forêt des faits, et nous retient embarrassés, orgueilleux de l’être, condamnés à bramer des poèmes et des hypothèses, –&nbsp;fiers et&nbsp;désespérés.</p>
<p><cite><em>Mauvaises pensées et autres</em>, Paul&nbsp;Valéry</cite></p>
</blockquote>

<blockquote>
<p>🥲 <em>[En attendant chez l'orthodontiste]</em><br />
— Papa, tu as un téléphone, tu n’as pas besoin de t’ennuyer avec moi par&nbsp;compassion.</p>
</blockquote>

      </details>
    

    <h2><a href="/david/2023/01/06/" title="Lien permanent vers cet article">Toile</a> (2023-01-06)</h2>
    
      <details>
        <summary>Déplier pour lire le contenu de la publication</summary>
        

<blockquote lang="en">
<p>I realised when I think of something it doesn’t exist as a single entity. A thought is linked to a million other thoughts, to the past and to the future. I remember too much, relate too much, <mark>connect too much,</mark> and I project too much. I thought this was “normal” until I met my partner. She doesn’t think much about the future or the past – she’s a much happier person compared to&nbsp;me.</p>
<p><cite><em><a href="https://winnielim.org/journal/my-mind-is-full-of-webs/">my mind is full of webs</a></em>&nbsp;(<a href="/david/cache/2023/e1a26da20c603d214d0f844d5836569e/">cache</a>)</cite></p>
</blockquote>
<p>Il y a tellement de choses qui me font réagir (ré-penser plutôt&#8239;?) dans les écrits de Winnie Lim. Elle joue toujours avec la corde sensible qui crée un lien à la fois fragile et pourtant si résistant, je me l’imagine comme un fil de toile d’araignée entre nous. Difficile à décrire et pas forcément réciproque. De temps en temps, je m’aventure dessus et je vais me désaltérer de quelques gouttes de rosée. Je suis reconnaissant de ces partages qui viennent alimenter mes propres&nbsp;réflexions.</p>

<blockquote lang="en">
<p>But I do not want my webs to be truncated or forgotten. <mark>I do not wish to forget,</mark> or I wouldn’t have become obsessed with archival. I like noticing and preserving the connections. They become opportunities for learning and becoming, if I manage to detach enough from&nbsp;them.</p>
<p><cite><em>Ibid.</em></cite></p>
</blockquote>
<figure>
    <a href="/static/david/2023/2023-01-06-toile-gouttes.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2023/2023-01-06-toile-gouttes.jpg"
            width="1512" height="2016"
            srcset="/static/david/2023/2023-01-06-toile-gouttes.jpg 1512w, /static/david/2023/2023-01-06-toile-gouttes_660x440.jpg 660w, /static/david/2023/2023-01-06-toile-gouttes_990x660.jpg 990w, /static/david/2023/2023-01-06-toile-gouttes_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 1512 / 2016))"
            loading="lazy"
            decoding="async"
            alt="Une toile d’araignée avec des gouttes de rosée et en arrière plan, flou, des immeubles de l’autre côté de la Rivière des Prairies">
    </a>
    <figcaption>Parc Louis-Hébert, Montréal, 2 novembre&nbsp;2022.</figcaption>
</figure>
<details>
<summary>Et pendant ce temps là de l’autre côté de la rue&nbsp;:</summary>

<figure>
    <a href="/static/david/2023/2023-01-06-toile-soleil.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2023/2023-01-06-toile-soleil.jpg"
            width="2016" height="1512"
            srcset="/static/david/2023/2023-01-06-toile-soleil.jpg 2016w, /static/david/2023/2023-01-06-toile-soleil_660x440.jpg 660w, /static/david/2023/2023-01-06-toile-soleil_990x660.jpg 990w, /static/david/2023/2023-01-06-toile-soleil_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 2016 / 1512))"
            loading="lazy"
            decoding="async"
            alt="Un parc pour enfant à contre-jour avec le soleil qui se lève dans le brouillard et qui forme une jolie étoile">
    </a>
    <figcaption>Une toile de soleil&nbsp;!</figcaption>
</figure>
</details>


      </details>
    

</main>


<hr>

<footer>
  <p>
    <nobr>
      <a href="/david/" title="Aller à l’accueil"
        ><svg class="icon icon-home">
          <use
            xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
          ></use>
        </svg>
        Accueil</a
      >
    </nobr>
    •
    <nobr>
      <a href="/david/log/" title="Accès au flux RSS"
        ><svg class="icon icon-rss2">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
        </svg>
        Suivre</a
      >
    </nobr>
    •
    <nobr>
      <a href="http://larlet.com" title="Go to my English profile" data-instant
        ><svg class="icon icon-user-tie">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
        </svg>
        Pro</a
      >
    </nobr>
    •
    <nobr>
      <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"
        ><svg class="icon icon-mail">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
        </svg>
        Email</a
      >
    </nobr>
    •
    <nobr>
      <abbr
        class="nowrap"
        title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"
        ><svg class="icon icon-hammer2">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
        </svg>
        Légal</abbr
      >
    </nobr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
              </svg> Thème</legend>
              <label>
                  <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
              </label>
              <label>
                  <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
              </label>
              <label>
                  <input type="radio" value="light" name="chosen-color-scheme"> Clair
              </label>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(form)

        form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
        })

        const selectedTheme = localStorage.getItem('theme')
        if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
        }
    }

    const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
    window.addEventListener('load', () => {
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.cssRules) {
                if (cssRule.type !== CSSRule.MEDIA_RULE) {
                    continue
                }
                // WARNING: Safari does not have/supports `conditionText`.
                if (cssRule.conditionText) {
                    if (cssRule.conditionText !== prefersColorSchemeDark) {
                        continue
                    }
                } else {
                    if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                        continue
                    }
                }
                mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }

            // WARNING: do not try to insert a Rule to a styleSheet you are
            // currently iterating on, otherwise the browser will be stuck
            // in a infinite loop…
            for (const mediaRule of mediaRules) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>

</body>
</html>