Article

david/2024/01/01/index.html

@@ -389,12 +389,14 @@ Pb : mémoire, troubles cognitifs, responsable de cancer, pb sommeil, déco
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -403,7 +405,6 @@ Pb : mémoire, troubles cognitifs, responsable de cancer, pb sommeil, déco
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/02/index.html

@@ -431,12 +431,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -445,7 +447,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/03/index.html

@@ -378,12 +378,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -392,7 +394,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/04/index.html

@@ -398,12 +398,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -412,7 +414,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/05/index.html

@@ -404,12 +404,14 @@ Isobel hésite. Sans lever les yeux de son livre, Emily répond à sa place&nbsp
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -418,7 +420,6 @@ Isobel hésite. Sans lever les yeux de son livre, Emily répond à sa place&nbsp
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/06/index.html

@@ -398,12 +398,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -412,7 +414,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/07/index.html

@@ -444,12 +444,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -458,7 +460,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/08/index.html

@@ -441,12 +441,14 @@ a::before {
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -455,7 +457,6 @@ a::before {
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/09/index.html

@@ -412,12 +412,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -426,7 +428,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/10/index.html

@@ -496,12 +496,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -510,7 +512,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/11/index.html

@@ -456,12 +456,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -470,7 +472,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/12/index.html

@@ -521,12 +521,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -535,7 +537,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/13/index.html

@@ -427,12 +427,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -441,7 +443,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/14/index.html

@@ -422,12 +422,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -436,7 +438,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/15/index.html

@@ -374,12 +374,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -388,7 +390,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/16/index.html

@@ -396,12 +396,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -410,7 +412,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/17/index.html

@@ -441,12 +441,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -455,7 +457,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/18/index.html

@@ -370,12 +370,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -384,7 +386,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/19/index.html

@@ -420,12 +420,14 @@ quelqu’un nous&nbsp;voit</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -434,7 +436,6 @@ quelqu’un nous&nbsp;voit</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/20/index.html

@@ -455,12 +455,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -469,7 +471,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/21/index.html

@@ -400,12 +400,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -414,7 +416,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/22/index.html

@@ -480,12 +480,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -494,7 +496,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/23/index.html

@@ -404,12 +404,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -418,7 +420,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/24/index.html

@@ -405,12 +405,14 @@ par nos&nbsp;obscurités</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -419,7 +421,6 @@ par nos&nbsp;obscurités</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/25/index.html

@@ -406,12 +406,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -420,7 +422,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/26/index.html

@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/01/27/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -255,7 +255,7 @@ Des affects, qui constituent la nécessaire force motrice du mouvement que nous
       
         • <a rel="next"
             href="/david/2024/01/27/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -428,12 +428,14 @@ Des affects, qui constituent la nécessaire force motrice du mouvement que nous
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -442,7 +444,6 @@ Des affects, qui constituent la nécessaire force motrice du mouvement que nous
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/27/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;1
+    Jour 1
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;1</h1>
+      <h1>Jour 1</h1>
       <p>Le <time datetime="2024-01-27">27 janvier 2024</time></p>
     </hgroup>
   </header>
@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/01/28/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -254,7 +254,7 @@
       
         • <a rel="next"
             href="/david/2024/01/28/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -427,12 +427,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -441,7 +443,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/28/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;2
+    Jour 2
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;2</h1>
+      <h1>Jour 2</h1>
       <p>Le <time datetime="2024-01-28">28 janvier 2024</time></p>
     </hgroup>
   </header>
@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/01/27/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -219,7 +219,7 @@
       
         <a rel="prev"
            href="/david/2024/01/27/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -398,12 +398,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -412,7 +414,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/29/index.html

@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/01/28/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -332,7 +332,7 @@ git archive --remote=larlet-fr-david-cache.git master | tar -x -C larlet-fr/davi
       
         <a rel="prev"
            href="/david/2024/01/28/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -511,12 +511,14 @@ git archive --remote=larlet-fr-david-cache.git master | tar -x -C larlet-fr/davi
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -525,7 +527,6 @@ git archive --remote=larlet-fr-david-cache.git master | tar -x -C larlet-fr/davi
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/30/index.html

@@ -417,12 +417,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -431,7 +433,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/01/31/index.html

@@ -441,12 +441,14 @@ Représentant de l’entreprise /  Représentant de&nbsp;l’association</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -455,7 +457,6 @@ Représentant de l’entreprise /  Représentant de&nbsp;l’association</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/01/index.html

@@ -443,12 +443,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -457,7 +459,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/02/index.html

@@ -460,12 +460,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -474,7 +476,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/03/index.html

@@ -444,12 +444,14 @@ end run
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -458,7 +460,6 @@ end run
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/04/index.html

@@ -474,12 +474,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -488,7 +490,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/05/index.html

@@ -382,12 +382,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -396,7 +398,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/06/index.html

@@ -425,12 +425,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -439,7 +441,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/07/index.html

@@ -397,12 +397,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -411,7 +413,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/08/index.html

@@ -390,12 +390,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -404,7 +406,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/09/index.html

@@ -382,12 +382,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -396,7 +398,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/10/index.html

@@ -385,12 +385,14 @@ etc.</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -399,7 +401,6 @@ etc.</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/11/index.html

@@ -372,12 +372,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -386,7 +388,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/12/index.html

@@ -462,12 +462,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -476,7 +478,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/13/index.html

@@ -416,12 +416,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -430,7 +432,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/14/index.html

@@ -384,12 +384,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -398,7 +400,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/15/index.html

@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/02/16/"
-            title="Publication suivante : uMap&nbsp;2">Suivant →</a>
+            title="Publication suivante : uMap 2">Suivant →</a>
       
     </p>
   </nav>
@@ -255,7 +255,7 @@
       
         • <a rel="next"
             href="/david/2024/02/16/"
-            title="Publication suivante : uMap&nbsp;2">Suivant →</a>
+            title="Publication suivante : uMap 2">Suivant →</a>
       
     </p>
   </nav>
@@ -428,12 +428,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -442,7 +444,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/16/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    uMap&nbsp;2
+    uMap 2
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>uMap&nbsp;2</h1>
+      <h1>uMap 2</h1>
       <p>Le <time datetime="2024-02-16">16 février 2024</time></p>
     </hgroup>
   </header>
@@ -422,12 +422,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -436,7 +438,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/17/index.html

@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/02/16/"
-           title="Publication précédente : uMap&nbsp;2">← Précédent</a> •
+           title="Publication précédente : uMap 2">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -214,7 +214,7 @@
       
         <a rel="prev"
            href="/david/2024/02/16/"
-           title="Publication précédente : uMap&nbsp;2">← Précédent</a> •
+           title="Publication précédente : uMap 2">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -393,12 +393,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -407,7 +409,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/18/index.html

@@ -464,12 +464,14 @@ button.primary {
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -478,7 +480,6 @@ button.primary {
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/19/index.html

@@ -470,12 +470,14 @@ $ python3 -c 'import secrets; print(secrets.token_hex(100))'
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -484,7 +486,6 @@ $ python3 -c 'import secrets; print(secrets.token_hex(100))'
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/20/index.html

@@ -409,12 +409,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -423,7 +425,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/21/index.html

@@ -445,12 +445,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -459,7 +461,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/22/index.html

@@ -411,12 +411,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -425,7 +427,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/23/index.html

@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/02/24/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -273,7 +273,7 @@
       
         • <a rel="next"
             href="/david/2024/02/24/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -446,12 +446,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -460,7 +462,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/24/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;1
+    Jour 1
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;1</h1>
+      <h1>Jour 1</h1>
       <p>Le <time datetime="2024-02-24">24 février 2024</time></p>
     </hgroup>
   </header>
@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/02/25/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -225,7 +225,7 @@
       
         • <a rel="next"
             href="/david/2024/02/25/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -398,12 +398,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -412,7 +414,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/25/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;2
+    Jour 2
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;2</h1>
+      <h1>Jour 2</h1>
       <p>Le <time datetime="2024-02-25">25 février 2024</time></p>
     </hgroup>
   </header>
@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/02/24/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -233,7 +233,7 @@
       
         <a rel="prev"
            href="/david/2024/02/24/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -412,12 +412,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -426,7 +428,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/26/index.html

@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/02/25/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -250,7 +250,7 @@
       
         <a rel="prev"
            href="/david/2024/02/25/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -429,12 +429,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -443,7 +445,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/27/index.html

@@ -399,12 +399,14 @@ Et je sais enfin qui je&nbsp;suis…</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -413,7 +415,6 @@ Et je sais enfin qui je&nbsp;suis…</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/28/index.html

@@ -426,12 +426,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -440,7 +442,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/02/29/index.html

@@ -431,12 +431,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -445,7 +447,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/01/index.html

@@ -431,12 +431,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -445,7 +447,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/02/index.html

@@ -174,7 +174,7 @@
                     <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
-                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
+                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
 <figure>
     <a href="/static/david/2024/2024-03-02-coros-apex-2-temperatures.png"
         title="Cliquer pour une version haute résolution">
@@ -190,7 +190,7 @@
     <figcaption>Même Kiki a du mal par -20°C&nbsp;!</figcaption>
 </figure>
 <p><em>Détail marrant&nbsp;: Kilian Jornet était déjà sur les photos de promotion de la Suunto Ambit Black et on le retrouve sur la Coros Apex 2&nbsp;Pro&nbsp;d’aujourd’hui.</em></p>
-<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
+<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
 <p>Je cherche en priorité une montre qui affiche un fond de carte, ce n’est pas tant ma trace programmée que ce qu’il y a autour qui m’intéresse dans d’autres contextes exploratoires. Sur ma montre actuelle, je ne pouvais qu’enregistrer une trace à suivre qui m’indiquait les déviations mais <em>pour ma pratique</em> ce n’était pas très intéressant. Savoir qu’il y a un lac / chemin forestier à proximité peut changer ma sortie. Difficile de savoir <em>a priori</em> si les données pour mes lieux de balade seront à jour ou suffisamment&nbsp;détaillées.</p>
 <p>J’ai regardé l’Apple Watch Ultra 2, la Suunto Vertical Titanium Solar, des Garmin d’«&nbsp;aventure&nbsp;» et finalement la Coros Apex 2 (Pro). Dans tous les cas, ce sont de grosses montres et j’ai un poignet fin. Dans tous les cas, le <em>marketing</em> est complètement délirant&nbsp;🙃. Sans compter le prix. La Coros semble être la moins chère (!) qui réponde à l’ensemble de mes attentes, la version Pro ayant une meilleure précision GPS et autonomie, ce qui m’importe&nbsp;beaucoup.</p>
 <p>Ah, <a href="/david/2024/02/07/#hr-69">aussi</a>. Difficile à justifier, même amortie sur la prochaine décennie… et c’est d’ailleurs là où j’ai de sérieux doutes en terme d’obsolescence programmée, ce qui a duré 10&nbsp;ans ne durera probablement plus 10&nbsp;ans. Triste réalité. J’essaye de ne pas trop me demande si <em>je</em> vais être capable de passer encore une décennie à arpenter la&nbsp;forêt.</p>
@@ -401,12 +401,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -415,7 +417,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/03/index.html

@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/03/04/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -296,7 +296,7 @@
       
         • <a rel="next"
             href="/david/2024/03/04/"
-            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
+            title="Publication suivante : Jour 1">Suivant →</a>
       
     </p>
   </nav>
@@ -469,12 +469,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -483,7 +485,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/04/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;1
+    Jour 1
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;1</h1>
+      <h1>Jour 1</h1>
       <p>Le <time datetime="2024-03-04">4 mars 2024</time></p>
     </hgroup>
   </header>
@@ -154,7 +154,7 @@
       
         • <a rel="next"
             href="/david/2024/03/05/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -209,7 +209,7 @@
       
         • <a rel="next"
             href="/david/2024/03/05/"
-            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
+            title="Publication suivante : Jour 2">Suivant →</a>
       
     </p>
   </nav>
@@ -382,12 +382,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -396,7 +398,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/05/index.html

@@ -10,7 +10,7 @@
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <!-- Required to make a valid HTML5 document. -->
   <title>
-    Jour&nbsp;2
+    Jour 2
   — David Larlet</title>
   <script>
     function toggleTheme(themeName) {
@@ -135,7 +135,7 @@
       
   <header>
     <hgroup>
-      <h1>Jour&nbsp;2</h1>
+      <h1>Jour 2</h1>
       <p>Le <time datetime="2024-03-05">5 mars 2024</time></p>
     </hgroup>
   </header>
@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/03/04/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -218,7 +218,7 @@
       
         <a rel="prev"
            href="/david/2024/03/04/"
-           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
+           title="Publication précédente : Jour 1">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -397,12 +397,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -411,7 +413,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/06/index.html

@@ -144,7 +144,7 @@
       
         <a rel="prev"
            href="/david/2024/03/05/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
       •
@@ -247,7 +247,7 @@
       
         <a rel="prev"
            href="/david/2024/03/05/"
-           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
+           title="Publication précédente : Jour 2">← Précédent</a> •
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
@@ -426,12 +426,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -440,7 +442,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/07/index.html

@@ -431,12 +431,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -445,7 +447,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/08/index.html

@@ -413,12 +413,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -427,7 +429,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/09/index.html

@@ -443,12 +443,14 @@ Lovée dans mes&nbsp;bras</p>
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -457,7 +459,6 @@ Lovée dans mes&nbsp;bras</p>
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/10/index.html

@@ -372,12 +372,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -386,7 +388,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/11/index.html

@@ -437,12 +437,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -451,7 +453,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/12/index.html

@@ -152,6 +152,10 @@
          title="Aller à la page de recherche"
          rel="search" data-no-instant>Recherche</a>
       
+        • <a rel="next"
+            href="/david/2024/03/13/"
+            title="Publication suivante : Sérendipité">Suivant →</a>
+      
     </p>
   </nav>
   
@@ -196,6 +200,7 @@
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
                 <span class="sr-only">[archive]</span></a> <a data-link-domain="caniuse.com" href="https://caniuse.com/mdn-css_properties_animation-range">prochainement</a>.</p>
+<p><mark>Le lendemain</mark>, <a href="/david/2024/03/13/#hr-114">j’ai désactivé l’animation</a> suite à plusieurs retours de&nbsp;lecteur·ices.</p>
 <a href="#hr-110" title="Lien vers cette section de la page"><hr id="hr-110" /></a>
 
 <blockquote>
@@ -290,6 +295,10 @@
       
       <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
       
+        • <a rel="next"
+            href="/david/2024/03/13/"
+            title="Publication suivante : Sérendipité">Suivant →</a>
+      
     </p>
   </nav>
 
@@ -461,12 +470,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -475,7 +486,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

david/2024/03/13/index.html

@@ -0,0 +1,580 @@
+<!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>
+    Sérendipité
+  — David Larlet</title>
+  <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>
+  <!-- Documented, feel free to shoot an email. -->
+  <link rel="stylesheet" href="/static/david/css/style_2024-03-09.css">
+  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_a_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/century_supra_ot_a_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/century_supra_ot_a_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/century_supra_ot_b_regular.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <meta name="description" content="Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble opinion.">
+  <!-- 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)">
+  <!-- Is that even respected? Retrospectively? What a shAItshow…
+  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
+  <meta name="robots" content="noai, noimageai">
+  
+<style type="text/css">
+  .tippy-content {
+    min-width: 280px;
+    padding: .5rem;
+    font-size: calc(var(--fluid-0) * 0.8);
+    font-family: var(--labor-font);
+    letter-spacing: initial;
+    text-align: left;
+  }
+  .tippy-content h3 {
+    margin-top: 0;
+  }
+  .tippy-content h3 img {
+    max-width: 2rem;
+    max-height: 2rem;
+    display: inline-block;
+  }
+  .tippy-content .tippy-links {
+    display: flex;
+    justify-content: space-around;
+  }
+  .tippy-content a {
+    padding: .4rem;
+    color: #F06048;
+  }
+</style>
+
+  <body data-instant-intensity="viewport-all">
+    <article>
+      
+  <header>
+    <hgroup>
+      <h1>Sérendipité</h1>
+      <p>Le <time datetime="2024-03-13">13 mars 2024</time></p>
+    </hgroup>
+  </header>
+  <nav>
+    <p>
+      
+        <a rel="prev"
+           href="/david/2024/03/12/"
+           title="Publication précédente : Surligner">← Précédent</a> •
+      
+      <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
+      •
+      <a href="/david/recherche/"
+         title="Aller à la page de recherche"
+         rel="search" data-no-instant>Recherche</a>
+      
+    </p>
+  </nav>
+  
+
+<blockquote lang="en">
+<p>Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble&nbsp;opinion.</p>
+<p>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. <mark>Can you really say you visited the location if you never left the&nbsp;hotel?</mark></p>
+<p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/following-links/" hreflang="en"
+            title="Consultation de l’article (anglais)">Following Links - Jim Nielsen’s Blog</a>
+            <a href="/david/cache/2024/c26881e908632b460cfd93fe61cc0466/" hreflang="en"
+                data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
+                data-source="https://blog.jim-nielsen.com/2024/following-links/"
+                data-date="2024-03-12"
+                data-favicon="https://blog.jim-nielsen.com/favicon.ico"
+                data-domain="blog.jim-nielsen.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>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.</p>
+
+<blockquote lang="en">
+<p>A surprising number of other features can be expressed in terms of&nbsp;links.</p>
+<p><cite><em><a data-link-domain="subconscious.substack.com" href="https://subconscious.substack.com/p/all-you-need-is-links" hreflang="en"
+            title="Consultation de l’article (anglais)">All you need is links</a>
+            <a href="/david/cache/2024/a801772c901c3e5cfad33f637d00151e/" hreflang="en"
+                data-tippy data-description="Before reaching for features, my goal is to explore, to the fullest extent, the creative potential of plain old links."
+                data-source="https://subconscious.substack.com/p/all-you-need-is-links"
+                data-date="2024-03-12"
+                data-favicon="https://substackcdn.com/image/fetch/f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%2Fpublic%2Fimages%2F4d01c24b-d99d-497e-9e60-1a2427581cad%2Ffavicon-16x16.png"
+                data-domain="subconscious.substack.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<a href="#hr-112" title="Lien vers cette section de la page"><hr id="hr-112" /></a>
+
+<blockquote lang="en">
+<p><code>printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'</code></p>
+<p><cite><em><a data-link-domain="notes.billmill.org" href="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html" hreflang="en"
+            title="Consultation de l’article (anglais)">Hyperlink escape codes</a>
+            <a href="/david/cache/2024/f68e9507784b5baf1584085908d60f58/" hreflang="en"
+                data-tippy data-description="To print out a clickable hyperlink in a terminal"
+                data-source="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html"
+                data-date="2024-03-13"
+                data-favicon="https://notes.billmill.org/favicon.ico"
+                data-domain="notes.billmill.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Qui me fait découvre <a data-link-domain="github.com" href="https://github.com/nedbat/watchgha">watchgha</a>, bien pratique pour avoir un accès rapide aux résultats de l’intégration&nbsp;continue.</p>
+<figure>
+    <a href="/static/david/2024/2024-03-13-watchgha.png"
+        title="Cliquer pour une version haute résolution">
+        <img
+            src="/static/david/2024/2024-03-13-watchgha.png"
+            width="2422" height="192"
+            srcset="/static/david/2024/2024-03-13-watchgha.png 2422w, /static/david/2024/2024-03-13-watchgha.png 660w, /static/david/2024/2024-03-13-watchgha.png 990w, /static/david/2024/2024-03-13-watchgha.png 1320w"
+            sizes="min(100vw, calc(100vh * 2422 / 192))"
+            loading="lazy"
+            decoding="async"
+            alt="Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.">
+    </a>
+    <figcaption>Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un&nbsp;moment).</figcaption>
+</figure>
+<a href="#hr-113" title="Lien vers cette section de la page"><hr id="hr-113" /></a>
+
+<blockquote>
+<p>Le constat est simple&nbsp;: je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu&nbsp;l’exemple.</p>
+<p><cite><em><a data-link-domain="vincent-valentin.name" href="https://vincent-valentin.name/articles/motivation-s" hreflang="fr"
+            title="Consultation de l’article">Motivation(s) chez Vincent Valentin.</a>
+            <a href="/david/cache/2024/c6e0fe933581c74380fa8eaa7f229353/" hreflang="fr"
+                data-tippy data-description="Site personnel de Vincent Valentin, habitant à Nantes, quarante-quatre ans et intégrateur web depuis plus de quinze ans."
+                data-source="https://vincent-valentin.name/articles/motivation-s"
+                data-date="2024-03-13"
+                data-favicon="https://vincent-valentin.name/favicon-32x32.png"
+                data-domain="vincent-valentin.name"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Très chouettes publications cette dernière semaine en tout cas&nbsp;&lt;3.</p>
+<a href="#hr-114" title="Lien vers cette section de la page"><hr id="hr-114" /></a>
+<p>Rétropédalage sur <a href="/david/2024/03/12/" title="Surligner">le surlignage</a>. 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 <em>opt-in</em> à un&nbsp;moment.</p>
+<a href="#hr-115" title="Lien vers cette section de la page"><hr id="hr-115" /></a>
+
+<blockquote>
+<p>Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. <mark>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.</mark> 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&nbsp;nuit.</p>
+<p>Au total j’ai passé plus de 230&nbsp;heures sur ce&nbsp;projet</p>
+<p><cite><em><a data-link-domain="hypothermia.fr" href="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/" hreflang="fr"
+            title="Consultation de l’article">Chiroto T. Datoca</a>
+            <a href="/david/cache/2024/f5294ac20ea593cce56caf2379813a4a/" hreflang="fr"
+                data-tippy data-description="Il y a quinze ans, j'ai entamé un projet de calligraphie que je n'ai jamais terminé, un cadeau que je n'ai jamais offert."
+                data-source="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/"
+                data-date="2024-03-13"
+                data-favicon="https://www.hypothermia.fr/wp-content/uploads/fbrfg/favicon-32x32.png"
+                data-domain="hypothermia.fr"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas&nbsp;l’artiste.</p>
+<a href="#hr-116" title="Lien vers cette section de la page"><hr id="hr-116" /></a>
+
+<blockquote lang="en">
+<p>Rust-like error handling in Python, with type-safety in&nbsp;mind.</p>
+<p><cite><em><a data-link-domain="github.com" href="https://github.com/alexandermalyga/poltergeist">poltergeist</a></em></cite></p>
+</blockquote>
+<p>J’ai très souvent retrouvé le besoin de ce <em>pattern</em> dans mes&nbsp;projets.</p>
+<a href="#hr-117" title="Lien vers cette section de la page"><hr id="hr-117" /></a>
+<p>Sortie de la <a data-link-domain="pypi.org" href="https://pypi.org/project/pressoir-cli/2.0.0/">version 2.0&nbsp;de pressoir-cli</a> (oui, <a href="/david/2024/02/16/" title="uMap 2">c’est ma période</a>). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop <em>meta</em> pour ne pas le&nbsp;faire&nbsp;😇.</p>
+<a href="#hr-118" title="Lien vers cette section de la page"><hr id="hr-118" /></a>
+
+<blockquote>
+<p>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&nbsp;puissante&#8239;!</p>
+<p><cite><em><a data-link-domain="buzut.net" href="https://buzut.net/optimiser-nginx/" hreflang="fr"
+            title="Consultation de l’article">Optimisez Nginx pour de meilleurs performances</a>
+            <a href="/david/cache/2024/b33059055c307477e43390a51f9a104a/" hreflang="fr"
+                data-tippy data-description="Nginx est réputé pour sa rapidité, mais quand votre serveur fait face à un trafic énorme, il est possible d'en tirer encore plus. Voyons comment !"
+                data-source="https://buzut.net/optimiser-nginx/"
+                data-date="2024-03-13"
+                data-favicon="https://buzut.net/img/favicon.png"
+                data-domain="buzut.net"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Pour lecture&nbsp;ultérieure.</p>
+<a href="#hr-119" title="Lien vers cette section de la page"><hr id="hr-119" /></a>
+
+<blockquote>
+<p><code>font-size: calc(1rem + 0.25vw);</code></p>
+<p><cite><em><a data-link-domain="jameshfisher.com" href="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/" hreflang="en"
+            title="Consultation de l’article (anglais)">A formula for responsive font-size</a>
+            <a href="/david/cache/2024/08b2b2735f74ebf856d8a850cc9e41cc/" hreflang="en"
+                data-tippy data-description="This CSS is now part of most websites I make:"
+                data-source="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/"
+                data-date="2024-03-13"
+                data-favicon="https://jameshfisher.com/assets/jim_128.png"
+                data-domain="jameshfisher.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Moins poussé que le <a data-link-domain="utopia.fyi" href="https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&amp;s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&amp;g=s,l,xl,12">Fluid type scale calculator</a> mais dans un contexte plus minimaliste / simple ça fait déjà le&nbsp;taf.</p>
+<a href="#hr-120" title="Lien vers cette section de la page"><hr id="hr-120" /></a>
+
+<blockquote lang="en">
+<p>To enable such progress, <strong>the Web Consortium too has evolved, always taking a people-first approach:</strong> the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003&nbsp;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&nbsp;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 <mark>re-launching the Consortium in 2023&nbsp;as a public-interest non-profit organization</mark> to work for the good of the&nbsp;public.</p>
+<p><cite><em><a data-link-domain="w3.org" href="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/" hreflang="en"
+            title="Consultation de l’article (anglais)">From a humble beginning 35&nbsp;years ago, the Web is now central to the daily lives of billions</a>
+            <a href="/david/cache/2024/c684ecb41e8e4ea04c6dac1e1d87f776/" hreflang="en"
+                data-tippy data-description="In this blog post, W3C CEO Seth Dobbs depicts how from a humble beginning 35 years ago, the Web is now central to the daily lives of billions of people."
+                data-source="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/"
+                data-date="2024-03-13"
+                data-favicon="https://www.w3.org/favicon.ico"
+                data-domain="w3.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>35&nbsp;ans de liens. Merci Tim <em>et al.</em> d’avoir permis&nbsp;cela.</p>
+
+  
+    <nav>
+      <p>
+        
+          <a href="/david/2024/liens/"
+             title="Liste de tous les articles 2024 associés à cette étiquette"
+             rel="tag">#liens</a>
+        
+          <a href="/david/2024/partage/"
+             title="Liste de tous les articles 2024 associés à cette étiquette"
+             rel="tag">#partage</a>
+        
+          <a href="/david/2024/web/"
+             title="Liste de tous les articles 2024 associés à cette étiquette"
+             rel="tag">#web</a>
+        
+        <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
+      </p>
+    </nav>
+  
+  <nav>
+    <p>
+      
+        <a rel="prev"
+           href="/david/2024/03/12/"
+           title="Publication précédente : Surligner">← Précédent</a> •
+      
+      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
+      
+    </p>
+  </nav>
+
+      
+        <form action="/david/recherche/" method="get">
+          <fieldset>
+            <legend>Recherche</legend>
+            <label for="input-search">Termes de votre recherche :</label>
+            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
+            <input type="submit" value="Chercher">
+            <p id="indexation-infos">
+              <small>
+                Seuls les contenus de ces 8 dernières années sont indexés.
+              </small>
+            </p>
+          </fieldset>
+        </form>
+      
+      <aside>
+        <theme-toggle></theme-toggle>
+      </aside>
+    </article>
+    <hr>
+    <footer>
+      <p>
+        <a href="/david/" title="Aller à l’accueil">Accueil</a>
+        •
+        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
+        •
+        <a href="http://larlet.com"
+           title="Go to my English profile"
+           data-instant>Pro</a>
+        •
+        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
+        •
+        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
+      </p>
+      <template id="theme-selector">
+        <form>
+          <style type="text/css">
+            fieldset div {
+              text-align: center;
+            }
+          </style>
+          <fieldset>
+            <legend>Thème</legend>
+            <div>
+              <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>
+            </div>
+          </fieldset>
+        </form>
+      </template>
+    </footer>
+    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
+    <script>
+      class ThemeToggle extends HTMLElement {
+        constructor() {
+          super()
+          const themeSelectorTemplate = document.querySelector('#theme-selector')
+          const form = themeSelectorTemplate.content.firstElementChild
+          this.attachShadow({ mode: 'open' })
+          this.shadowRoot.appendChild(form.cloneNode(true))
+        }
+
+        connectedCallback() {
+          const form = this.shadowRoot.querySelector('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 colorsLayer = undefined
+        let hasDarkRules = false
+        for (const styleSheet of Array.from(document.styleSheets)) {
+          let mediaRules = []
+          for (const layerRule of styleSheet.cssRules) {
+            if (!(layerRule instanceof CSSLayerBlockRule)) {
+              continue
+            }
+            if (layerRule.name === 'colors') {
+              colorsLayer = layerRule
+            }
+            for (const cssRule of layerRule.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) {
+            // Safari requires the `0` second parameter (even if default).
+            colorsLayer.insertRule(mediaRule.cssText, 0)
+            hasDarkRules = true
+          }
+        }
+
+        if (hasDarkRules) {
+          if ('customElements' in window && !customElements.get('theme-toggle')) {
+            customElements.define('theme-toggle', ThemeToggle)
+          }
+        }
+      })
+    </script>
+    
+  <script src="/static/david/js/popper-2.11.8.min.js"></script>
+  <script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script>
+  <script>
+    tippy('[data-tippy]', {
+      content(reference) {
+        reference.addEventListener('click', (e) => e.preventDefault())
+        return `
+        <h3 lang="fr">
+          <img src="${reference.dataset.favicon}" loading="lazy">
+          <a href="${reference.dataset.source}"
+            >Article sur ${reference.dataset.domain}</a></h3>
+        <p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p>
+        <div class="tippy-links" lang="fr">
+          <a href="${reference.href}">Archive au ${reference.dataset.date}</a>
+        </div>
+        `
+      },
+      allowHTML: true,
+      interactive: true,
+      delay: [150, 700],
+      hideOnClick: false
+    })
+  </script>
+  <script type="module">
+    import { annotate } from '/static/david/js/rough-notation-0.5.1.esm.min.js'
+
+    const markObserver = new IntersectionObserver((entries, observer) => {
+      const computedStyle = getComputedStyle(document.documentElement)
+      const markBackground = computedStyle.getPropertyValue('--mark-background')
+      for (const entry of entries) {
+        if (entry.intersectionRatio === 0) continue
+        const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
+        const annotation = annotate(
+          markElement, {
+            type: 'highlight',
+            multiline: true,
+            color: markBackground,
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
+          }
+        )
+        annotation.show()
+        observer.unobserve(markElement)
+      }
+    }, {threshold: 1.0})
+
+    for (const markElement of document.querySelectorAll('mark')) {
+      markObserver.observe(markElement)
+    }
+  </script>
+
+  </body>
+</html>

david/2024/_sources/2024-03-12 - Surligner.md

@@ -16,6 +16,8 @@ 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](https://frontendmasters.com/blog/highlight-text-when-a-user-scrolls-down-to-that-piece-of-text/) [prochainement](https://caniuse.com/mdn-css_properties_animation-range).
 
+==Le lendemain==, [j’ai désactivé l’animation](/david/2024/03/13/#hr-114) 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.==

david/2024/_sources/2024-03-13 - Serendipite.md

@@ -0,0 +1,83 @@
+# Sérendipité
+
+> [en] 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?==
+>
+> <cite>*[Following Links - Jim Nielsen’s Blog](https://blog.jim-nielsen.com/2024/following-links/)*</cite>
+
+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.
+
+> [en] A surprising number of other features can be expressed in terms of links.
+> 
+> <cite>*[All you need is links](https://subconscious.substack.com/p/all-you-need-is-links)*</cite>
+
+---
+
+> [en] `printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'`
+>
+> <cite>*[Hyperlink escape codes](https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html)*</cite>
+
+Qui me fait découvre [watchgha](https://github.com/nedbat/watchgha), bien pratique pour avoir un accès rapide aux résultats de l’intégration continue.
+
+![Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.](/static/david/2024/2024-03-13-watchgha.png "Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un moment).")
+
+---
+
+> 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.
+> 
+> <cite>*[Motivation(s) chez Vincent Valentin.](https://vincent-valentin.name/articles/motivation-s)*</cite>
+
+Très chouettes publications cette dernière semaine en tout cas <3.
+
+---
+
+Rétropédalage sur [le surlignage](/david/2024/03/12/). 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
+>
+> <cite>*[Chiroto T. Datoca](https://www.hypothermia.fr/2024/03/chiroto-t-datoca/)*</cite>
+
+Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas l’artiste.
+
+---
+
+> [en] Rust-like error handling in Python, with type-safety in mind.
+> 
+> <cite>*[poltergeist](https://github.com/alexandermalyga/poltergeist)*</cite>
+
+J’ai très souvent retrouvé le besoin de ce *pattern* dans mes projets.
+
+---
+
+Sortie de la [version 2.0 de pressoir-cli](https://pypi.org/project/pressoir-cli/2.0.0/) (oui, [c’est ma période](/david/2024/02/16/)). 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 !
+> 
+> <cite>*[Optimisez Nginx pour de meilleurs performances](https://buzut.net/optimiser-nginx/)*</cite>
+
+Pour lecture ultérieure.
+
+---
+
+> `font-size: calc(1rem + 0.25vw);`
+> 
+> <cite>*[A formula for responsive font-size](https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/)*</cite>
+
+Moins poussé que le [Fluid type scale calculator](https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&g=s,l,xl,12) mais dans un contexte plus minimaliste / simple ça fait déjà le taf.
+
+---
+
+> [en] 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.
+> 
+> <cite>*[From a humble beginning 35 years ago, the Web is now central to the daily lives of billions](https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/)*</cite>
+
+35 ans de liens. Merci Tim _et al._ d’avoir permis cela.
+
+#liens #partage #web

david/2024/adaptation/index.html

@@ -169,7 +169,7 @@
     
   
     <h2>
-      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
+      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-03-05">5 mars 2024</time>
     </h2>
     
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>

david/2024/aventure/index.html

@@ -135,7 +135,7 @@
   </nav>
   
     <h2>
-      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
+      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-03-05">5 mars 2024</time>
     </h2>
     
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
@@ -194,7 +194,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-02-25">25 février 2024</time>
+      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-02-25">25 février 2024</time>
     </h2>
     
 <p>Sommeil entrecoupé, comme toujours, je finis par ouvrir une dernière fois les yeux après avoir passé plus de 12&nbsp;heures bien emmitouflé. Il faudrait que j’apprenne à expirer moins d’eau car le résultat est problématique (la fermeture éclair du duvet est bien gelée au matin). Et à moins bouger aussi, car chaque nouvelle position est longue à&nbsp;réchauffer…</p>
@@ -268,7 +268,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-02-24">24 février 2024</time>
+      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-02-24">24 février 2024</time>
     </h2>
     
 <p>Arrivée en fin de matinée. La voiture affiche -12°C et je sais que je ne vais probablement pas avoir plus ces 30&nbsp;prochaines heures dans la forêt. Depuis que j’ai appris la connaissance de la Grande Boucle de la forêt de Ouareau, j’ai eu envie de la faire, à mon rythme, avec une nuit à l’autre bout du parc. Ma pulka est énorme, ils annoncent une nuit fraîche et avec du vent. Je me lance dans la première descente alors que la neige est dure comme de la roche. J’apprends à mes dépens que les écailles des skis ne sont pas adaptées lorsque je repars en arrière à la première montée. Première chute, ça commence&nbsp;bien.</p>

david/2024/commun/index.html

@@ -447,7 +447,7 @@ button.primary {
     
   
     <h2>
-      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap&nbsp;2</a> <time datetime="2024-02-16">16 février 2024</time>
+      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap 2</a> <time datetime="2024-02-16">16 février 2024</time>
     </h2>
     
 

david/2024/decision/index.html

@@ -208,7 +208,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap&nbsp;2</a> <time datetime="2024-02-16">16 février 2024</time>
+      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap 2</a> <time datetime="2024-02-16">16 février 2024</time>
     </h2>
     
 

david/2024/dependance/index.html

@@ -383,7 +383,7 @@
                     <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
-                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
+                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
 <figure>
     <a href="/static/david/2024/2024-03-02-coros-apex-2-temperatures.png"
         title="Cliquer pour une version haute résolution">
@@ -399,7 +399,7 @@
     <figcaption>Même Kiki a du mal par -20°C&nbsp;!</figcaption>
 </figure>
 <p><em>Détail marrant&nbsp;: Kilian Jornet était déjà sur les photos de promotion de la Suunto Ambit Black et on le retrouve sur la Coros Apex 2&nbsp;Pro&nbsp;d’aujourd’hui.</em></p>
-<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
+<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
 <p>Je cherche en priorité une montre qui affiche un fond de carte, ce n’est pas tant ma trace programmée que ce qu’il y a autour qui m’intéresse dans d’autres contextes exploratoires. Sur ma montre actuelle, je ne pouvais qu’enregistrer une trace à suivre qui m’indiquait les déviations mais <em>pour ma pratique</em> ce n’était pas très intéressant. Savoir qu’il y a un lac / chemin forestier à proximité peut changer ma sortie. Difficile de savoir <em>a priori</em> si les données pour mes lieux de balade seront à jour ou suffisamment&nbsp;détaillées.</p>
 <p>J’ai regardé l’Apple Watch Ultra 2, la Suunto Vertical Titanium Solar, des Garmin d’«&nbsp;aventure&nbsp;» et finalement la Coros Apex 2 (Pro). Dans tous les cas, ce sont de grosses montres et j’ai un poignet fin. Dans tous les cas, le <em>marketing</em> est complètement délirant&nbsp;🙃. Sans compter le prix. La Coros semble être la moins chère (!) qui réponde à l’ensemble de mes attentes, la version Pro ayant une meilleure précision GPS et autonomie, ce qui m’importe&nbsp;beaucoup.</p>
 <p>Ah, <a href="/david/2024/02/07/#hr-69">aussi</a>. Difficile à justifier, même amortie sur la prochaine décennie… et c’est d’ailleurs là où j’ai de sérieux doutes en terme d’obsolescence programmée, ce qui a duré 10&nbsp;ans ne durera probablement plus 10&nbsp;ans. Triste réalité. J’essaye de ne pas trop me demande si <em>je</em> vais être capable de passer encore une décennie à arpenter la&nbsp;forêt.</p>

david/2024/dystopie/index.html

@@ -135,7 +135,7 @@
   </nav>
   
     <h2>
-      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
+      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-03-04">4 mars 2024</time>
     </h2>
     
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>

david/2024/experience/index.html

@@ -374,7 +374,7 @@ etc.</p>
     
   
     <h2>
-      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-01-28">28 janvier 2024</time>
+      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-01-28">28 janvier 2024</time>
     </h2>
     
 <p>Même avec la nourriture suspendue, les souris on fait un sacré raffut. Elles devaient elles aussi avoir trop chaud. Après avoir dormi avec 2&nbsp;fenêtres ouvertes, il fait tout de même 18°C au réveil. Parfait pour notre gruau de camping (seconde tradition avec les nouilles instantanées), cette fois à la neige&nbsp;fondue.</p>
@@ -434,7 +434,7 @@ etc.</p>
     
   
     <h2>
-      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-01-27">27 janvier 2024</time>
+      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-01-27">27 janvier 2024</time>
     </h2>
     
 <p>De la pluie verglaçante depuis 2&nbsp;jours. Une cheville pas encore opérationnelle. Mais de l’envie et une réservation depuis deux mois pour une première sortie hivernale en refuge. Ensemble. La route pour y aller est déjà épique et des flocons gros comme des pastèques s’écrasent sur le pare-brise. Il est rare au Québec de suivre un <em>pickup</em> qui ne dépasse pas les 70&#8239;km/h sur&nbsp;l’autoroute.</p>

david/2024/foret/index.html

@@ -135,7 +135,7 @@
   </nav>
   
     <h2>
-      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
+      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-03-04">4 mars 2024</time>
     </h2>
     
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>
@@ -179,7 +179,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-02-25">25 février 2024</time>
+      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-02-25">25 février 2024</time>
     </h2>
     
 <p>Sommeil entrecoupé, comme toujours, je finis par ouvrir une dernière fois les yeux après avoir passé plus de 12&nbsp;heures bien emmitouflé. Il faudrait que j’apprenne à expirer moins d’eau car le résultat est problématique (la fermeture éclair du duvet est bien gelée au matin). Et à moins bouger aussi, car chaque nouvelle position est longue à&nbsp;réchauffer…</p>
@@ -253,7 +253,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-02-24">24 février 2024</time>
+      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-02-24">24 février 2024</time>
     </h2>
     
 <p>Arrivée en fin de matinée. La voiture affiche -12°C et je sais que je ne vais probablement pas avoir plus ces 30&nbsp;prochaines heures dans la forêt. Depuis que j’ai appris la connaissance de la Grande Boucle de la forêt de Ouareau, j’ai eu envie de la faire, à mon rythme, avec une nuit à l’autre bout du parc. Ma pulka est énorme, ils annoncent une nuit fraîche et avec du vent. Je me lance dans la première descente alors que la neige est dure comme de la roche. J’apprends à mes dépens que les écailles des skis ne sont pas adaptées lorsque je repars en arrière à la première montée. Première chute, ça commence&nbsp;bien.</p>
@@ -372,7 +372,7 @@
     
   
     <h2>
-      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-01-28">28 janvier 2024</time>
+      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-01-28">28 janvier 2024</time>
     </h2>
     
 <p>Même avec la nourriture suspendue, les souris on fait un sacré raffut. Elles devaient elles aussi avoir trop chaud. Après avoir dormi avec 2&nbsp;fenêtres ouvertes, il fait tout de même 18°C au réveil. Parfait pour notre gruau de camping (seconde tradition avec les nouilles instantanées), cette fois à la neige&nbsp;fondue.</p>
@@ -432,7 +432,7 @@
     
   
     <h2>
-      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-01-27">27 janvier 2024</time>
+      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-01-27">27 janvier 2024</time>
     </h2>
     
 <p>De la pluie verglaçante depuis 2&nbsp;jours. Une cheville pas encore opérationnelle. Mais de l’envie et une réservation depuis deux mois pour une première sortie hivernale en refuge. Ensemble. La route pour y aller est déjà épique et des flocons gros comme des pastèques s’écrasent sur le pare-brise. Il est rare au Québec de suivre un <em>pickup</em> qui ne dépasse pas les 70&#8239;km/h sur&nbsp;l’autoroute.</p>

david/2024/gratitude/index.html

@@ -135,7 +135,7 @@
   </nav>
   
     <h2>
-      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-02-25">25 février 2024</time>
+      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-02-25">25 février 2024</time>
     </h2>
     
 <p>Sommeil entrecoupé, comme toujours, je finis par ouvrir une dernière fois les yeux après avoir passé plus de 12&nbsp;heures bien emmitouflé. Il faudrait que j’apprenne à expirer moins d’eau car le résultat est problématique (la fermeture éclair du duvet est bien gelée au matin). Et à moins bouger aussi, car chaque nouvelle position est longue à&nbsp;réchauffer…</p>

david/2024/index.html

@@ -155,8 +155,8 @@
       <a href="/david/2024/01/24/">Taille</a>, 
       <a href="/david/2024/01/25/">Stratégie</a>, 
       <a href="/david/2024/01/26/">Cargo</a>, 
-      <a href="/david/2024/01/27/">Jour&nbsp;1</a>, 
-      <a href="/david/2024/01/28/">Jour&nbsp;2</a>, 
+      <a href="/david/2024/01/27/">Jour 1</a>, 
+      <a href="/david/2024/01/28/">Jour 2</a>, 
       <a href="/david/2024/01/29/">Déploiement</a>, 
       <a href="/david/2024/01/30/">Équipe</a>, 
       <a href="/david/2024/01/31/">Mécénat</a>.
@@ -180,7 +180,7 @@
       <a href="/david/2024/02/13/">Feutrage</a>, 
       <a href="/david/2024/02/14/">GéoCodage</a>, 
       <a href="/david/2024/02/15/">Licence</a>, 
-      <a href="/david/2024/02/16/">uMap&nbsp;2</a>, 
+      <a href="/david/2024/02/16/">uMap 2</a>, 
       <a href="/david/2024/02/17/">Quotidien</a>, 
       <a href="/david/2024/02/18/">In·directions</a>, 
       <a href="/david/2024/02/19/">Injection</a>, 
@@ -188,8 +188,8 @@
       <a href="/david/2024/02/21/">Cinéma</a>, 
       <a href="/david/2024/02/22/">Responsabilité</a>, 
       <a href="/david/2024/02/23/">Préparatifs</a>, 
-      <a href="/david/2024/02/24/">Jour&nbsp;1</a>, 
-      <a href="/david/2024/02/25/">Jour&nbsp;2</a>, 
+      <a href="/david/2024/02/24/">Jour 1</a>, 
+      <a href="/david/2024/02/25/">Jour 2</a>, 
       <a href="/david/2024/02/26/">Galaxie</a>, 
       <a href="/david/2024/02/27/">Rédaction</a>, 
       <a href="/david/2024/02/28/">Dérèglement</a>, 
@@ -202,15 +202,16 @@
       <a href="/david/2024/03/01/">Simple</a>, 
       <a href="/david/2024/03/02/">Montre</a>, 
       <a href="/david/2024/03/03/">Permanence</a>, 
-      <a href="/david/2024/03/04/">Jour&nbsp;1</a>, 
-      <a href="/david/2024/03/05/">Jour&nbsp;2</a>, 
+      <a href="/david/2024/03/04/">Jour 1</a>, 
+      <a href="/david/2024/03/05/">Jour 2</a>, 
       <a href="/david/2024/03/06/">Vannerie</a>, 
       <a href="/david/2024/03/07/">Sondages</a>, 
       <a href="/david/2024/03/08/">Flow</a>, 
       <a href="/david/2024/03/09/">Marque</a>, 
       <a href="/david/2024/03/10/">Dune</a>, 
       <a href="/david/2024/03/11/">LoginWall</a>, 
-      <a href="/david/2024/03/12/">Surligner</a>.
+      <a href="/david/2024/03/12/">Surligner</a>, 
+      <a href="/david/2024/03/13/">Sérendipité</a>.
       
     </p>
   
@@ -244,10 +245,11 @@
       <a href="/david/2024/identite/" rel="tag">#identité (1)</a>, 
       <a href="/david/2024/laboratoire/" rel="tag">#laboratoire (3)</a>, 
       <a href="/david/2024/lecture/" rel="tag">#lecture (3)</a>, 
+      <a href="/david/2024/liens/" rel="tag">#liens (1)</a>, 
       <a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>, 
       <a href="/david/2024/opensource/" rel="tag">#opensource (7)</a>, 
       <a href="/david/2024/parentalite/" rel="tag">#parentalité (5)</a>, 
-      <a href="/david/2024/partage/" rel="tag">#partage (5)</a>, 
+      <a href="/david/2024/partage/" rel="tag">#partage (6)</a>, 
       <a href="/david/2024/parvenir/" rel="tag">#parvenir (3)</a>, 
       <a href="/david/2024/photographie/" rel="tag">#photographie (2)</a>, 
       <a href="/david/2024/poesie/" rel="tag">#poésie (2)</a>, 
@@ -259,7 +261,7 @@
       <a href="/david/2024/sport/" rel="tag">#sport (5)</a>, 
       <a href="/david/2024/technique/" rel="tag">#technique (15)</a>, 
       <a href="/david/2024/velo/" rel="tag">#vélo (1)</a>, 
-      <a href="/david/2024/web/" rel="tag">#web (12)</a>.
+      <a href="/david/2024/web/" rel="tag">#web (13)</a>.
       
     </p>
   

david/2024/liens/index.html

@@ -0,0 +1,501 @@
+<!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>
+    Étiquette #liens
+  — David Larlet</title>
+  <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>
+  <!-- Documented, feel free to shoot an email. -->
+  <link rel="stylesheet" href="/static/david/css/style_2024-03-09.css">
+  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_a_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/century_supra_ot_a_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/century_supra_ot_a_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/century_supra_ot_b_regular.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <link rel="preload"
+        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
+        as="font"
+        type="font/woff2"
+        media="(prefers-color-scheme: dark)"
+        crossorigin>
+  <meta name="description" content="Publications relatives au tag #liens">
+  <!-- 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)">
+  <!-- Is that even respected? Retrospectively? What a shAItshow…
+  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
+  <meta name="robots" content="noai, noimageai">
+  
+  <style type="text/css">
+    details[open] summary {
+      display: none;
+    }
+  </style>
+
+  <body data-instant-intensity="viewport-all">
+    <article>
+      
+  <header>
+    <hgroup>
+      <h1>#liens</h1>
+      <p>Publications relatives à cette étiquette</p>
+    </hgroup>
+  </header>
+  <nav>
+    <p>
+      <a href="/david/" title="Aller à l’accueil">
+        Accueil</a>
+      •
+      <a rel="tags"
+        href="/david/2024/#tags"
+        title="Liste de toutes les étiquettes">
+        Étiquettes</a>
+      •
+      <a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a>
+      •
+      <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
+    </p>
+  </nav>
+  
+    <h2>
+      <a href="/david/2024/03/13/" title="Lien permanent vers cet article">Sérendipité</a> <time datetime="2024-03-13">13 mars 2024</time>
+    </h2>
+    
+
+<blockquote lang="en">
+<p>Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble&nbsp;opinion.</p>
+<p>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. <mark>Can you really say you visited the location if you never left the&nbsp;hotel?</mark></p>
+<p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/following-links/" hreflang="en"
+            title="Consultation de l’article (anglais)">Following Links - Jim Nielsen’s Blog</a>
+            <a href="/david/cache/2024/c26881e908632b460cfd93fe61cc0466/" hreflang="en"
+                data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
+                data-source="https://blog.jim-nielsen.com/2024/following-links/"
+                data-date="2024-03-12"
+                data-favicon="https://blog.jim-nielsen.com/favicon.ico"
+                data-domain="blog.jim-nielsen.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>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.</p>
+
+<blockquote lang="en">
+<p>A surprising number of other features can be expressed in terms of&nbsp;links.</p>
+<p><cite><em><a data-link-domain="subconscious.substack.com" href="https://subconscious.substack.com/p/all-you-need-is-links" hreflang="en"
+            title="Consultation de l’article (anglais)">All you need is links</a>
+            <a href="/david/cache/2024/a801772c901c3e5cfad33f637d00151e/" hreflang="en"
+                data-tippy data-description="Before reaching for features, my goal is to explore, to the fullest extent, the creative potential of plain old links."
+                data-source="https://subconscious.substack.com/p/all-you-need-is-links"
+                data-date="2024-03-12"
+                data-favicon="https://substackcdn.com/image/fetch/f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%2Fpublic%2Fimages%2F4d01c24b-d99d-497e-9e60-1a2427581cad%2Ffavicon-16x16.png"
+                data-domain="subconscious.substack.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<a href="#hr-112" title="Lien vers cette section de la page"><hr id="hr-112" /></a>
+
+<blockquote lang="en">
+<p><code>printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'</code></p>
+<p><cite><em><a data-link-domain="notes.billmill.org" href="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html" hreflang="en"
+            title="Consultation de l’article (anglais)">Hyperlink escape codes</a>
+            <a href="/david/cache/2024/f68e9507784b5baf1584085908d60f58/" hreflang="en"
+                data-tippy data-description="To print out a clickable hyperlink in a terminal"
+                data-source="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html"
+                data-date="2024-03-13"
+                data-favicon="https://notes.billmill.org/favicon.ico"
+                data-domain="notes.billmill.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Qui me fait découvre <a data-link-domain="github.com" href="https://github.com/nedbat/watchgha">watchgha</a>, bien pratique pour avoir un accès rapide aux résultats de l’intégration&nbsp;continue.</p>
+<figure>
+    <a href="/static/david/2024/2024-03-13-watchgha.png"
+        title="Cliquer pour une version haute résolution">
+        <img
+            src="/static/david/2024/2024-03-13-watchgha.png"
+            width="2422" height="192"
+            srcset="/static/david/2024/2024-03-13-watchgha.png 2422w, /static/david/2024/2024-03-13-watchgha.png 660w, /static/david/2024/2024-03-13-watchgha.png 990w, /static/david/2024/2024-03-13-watchgha.png 1320w"
+            sizes="min(100vw, calc(100vh * 2422 / 192))"
+            loading="lazy"
+            decoding="async"
+            alt="Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.">
+    </a>
+    <figcaption>Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un&nbsp;moment).</figcaption>
+</figure>
+<a href="#hr-113" title="Lien vers cette section de la page"><hr id="hr-113" /></a>
+
+<blockquote>
+<p>Le constat est simple&nbsp;: je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu&nbsp;l’exemple.</p>
+<p><cite><em><a data-link-domain="vincent-valentin.name" href="https://vincent-valentin.name/articles/motivation-s" hreflang="fr"
+            title="Consultation de l’article">Motivation(s) chez Vincent Valentin.</a>
+            <a href="/david/cache/2024/c6e0fe933581c74380fa8eaa7f229353/" hreflang="fr"
+                data-tippy data-description="Site personnel de Vincent Valentin, habitant à Nantes, quarante-quatre ans et intégrateur web depuis plus de quinze ans."
+                data-source="https://vincent-valentin.name/articles/motivation-s"
+                data-date="2024-03-13"
+                data-favicon="https://vincent-valentin.name/favicon-32x32.png"
+                data-domain="vincent-valentin.name"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Très chouettes publications cette dernière semaine en tout cas&nbsp;&lt;3.</p>
+<a href="#hr-114" title="Lien vers cette section de la page"><hr id="hr-114" /></a>
+<p>Rétropédalage sur <a href="/david/2024/03/12/" title="Surligner">le surlignage</a>. 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 <em>opt-in</em> à un&nbsp;moment.</p>
+<a href="#hr-115" title="Lien vers cette section de la page"><hr id="hr-115" /></a>
+
+<blockquote>
+<p>Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. <mark>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.</mark> 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&nbsp;nuit.</p>
+<p>Au total j’ai passé plus de 230&nbsp;heures sur ce&nbsp;projet</p>
+<p><cite><em><a data-link-domain="hypothermia.fr" href="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/" hreflang="fr"
+            title="Consultation de l’article">Chiroto T. Datoca</a>
+            <a href="/david/cache/2024/f5294ac20ea593cce56caf2379813a4a/" hreflang="fr"
+                data-tippy data-description="Il y a quinze ans, j'ai entamé un projet de calligraphie que je n'ai jamais terminé, un cadeau que je n'ai jamais offert."
+                data-source="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/"
+                data-date="2024-03-13"
+                data-favicon="https://www.hypothermia.fr/wp-content/uploads/fbrfg/favicon-32x32.png"
+                data-domain="hypothermia.fr"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas&nbsp;l’artiste.</p>
+<a href="#hr-116" title="Lien vers cette section de la page"><hr id="hr-116" /></a>
+
+<blockquote lang="en">
+<p>Rust-like error handling in Python, with type-safety in&nbsp;mind.</p>
+<p><cite><em><a data-link-domain="github.com" href="https://github.com/alexandermalyga/poltergeist">poltergeist</a></em></cite></p>
+</blockquote>
+<p>J’ai très souvent retrouvé le besoin de ce <em>pattern</em> dans mes&nbsp;projets.</p>
+<a href="#hr-117" title="Lien vers cette section de la page"><hr id="hr-117" /></a>
+<p>Sortie de la <a data-link-domain="pypi.org" href="https://pypi.org/project/pressoir-cli/2.0.0/">version 2.0&nbsp;de pressoir-cli</a> (oui, <a href="/david/2024/02/16/" title="uMap 2">c’est ma période</a>). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop <em>meta</em> pour ne pas le&nbsp;faire&nbsp;😇.</p>
+<a href="#hr-118" title="Lien vers cette section de la page"><hr id="hr-118" /></a>
+
+<blockquote>
+<p>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&nbsp;puissante&#8239;!</p>
+<p><cite><em><a data-link-domain="buzut.net" href="https://buzut.net/optimiser-nginx/" hreflang="fr"
+            title="Consultation de l’article">Optimisez Nginx pour de meilleurs performances</a>
+            <a href="/david/cache/2024/b33059055c307477e43390a51f9a104a/" hreflang="fr"
+                data-tippy data-description="Nginx est réputé pour sa rapidité, mais quand votre serveur fait face à un trafic énorme, il est possible d'en tirer encore plus. Voyons comment !"
+                data-source="https://buzut.net/optimiser-nginx/"
+                data-date="2024-03-13"
+                data-favicon="https://buzut.net/img/favicon.png"
+                data-domain="buzut.net"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Pour lecture&nbsp;ultérieure.</p>
+<a href="#hr-119" title="Lien vers cette section de la page"><hr id="hr-119" /></a>
+
+<blockquote>
+<p><code>font-size: calc(1rem + 0.25vw);</code></p>
+<p><cite><em><a data-link-domain="jameshfisher.com" href="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/" hreflang="en"
+            title="Consultation de l’article (anglais)">A formula for responsive font-size</a>
+            <a href="/david/cache/2024/08b2b2735f74ebf856d8a850cc9e41cc/" hreflang="en"
+                data-tippy data-description="This CSS is now part of most websites I make:"
+                data-source="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/"
+                data-date="2024-03-13"
+                data-favicon="https://jameshfisher.com/assets/jim_128.png"
+                data-domain="jameshfisher.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Moins poussé que le <a data-link-domain="utopia.fyi" href="https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&amp;s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&amp;g=s,l,xl,12">Fluid type scale calculator</a> mais dans un contexte plus minimaliste / simple ça fait déjà le&nbsp;taf.</p>
+<a href="#hr-120" title="Lien vers cette section de la page"><hr id="hr-120" /></a>
+
+<blockquote lang="en">
+<p>To enable such progress, <strong>the Web Consortium too has evolved, always taking a people-first approach:</strong> the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003&nbsp;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&nbsp;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 <mark>re-launching the Consortium in 2023&nbsp;as a public-interest non-profit organization</mark> to work for the good of the&nbsp;public.</p>
+<p><cite><em><a data-link-domain="w3.org" href="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/" hreflang="en"
+            title="Consultation de l’article (anglais)">From a humble beginning 35&nbsp;years ago, the Web is now central to the daily lives of billions</a>
+            <a href="/david/cache/2024/c684ecb41e8e4ea04c6dac1e1d87f776/" hreflang="en"
+                data-tippy data-description="In this blog post, W3C CEO Seth Dobbs depicts how from a humble beginning 35 years ago, the Web is now central to the daily lives of billions of people."
+                data-source="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/"
+                data-date="2024-03-13"
+                data-favicon="https://www.w3.org/favicon.ico"
+                data-domain="w3.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>35&nbsp;ans de liens. Merci Tim <em>et al.</em> d’avoir permis&nbsp;cela.</p>
+
+    
+      <nav>
+        <p>
+          
+            <a href="/david/2024/liens/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#liens</a>
+          
+            <a href="/david/2024/partage/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#partage</a>
+          
+            <a href="/david/2024/web/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#web</a>
+          
+          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
+        </p>
+      </nav>
+    
+  
+
+      
+        <form action="/david/recherche/" method="get">
+          <fieldset>
+            <legend>Recherche</legend>
+            <label for="input-search">Termes de votre recherche :</label>
+            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
+            <input type="submit" value="Chercher">
+            <p id="indexation-infos">
+              <small>
+                Seuls les contenus de ces 8 dernières années sont indexés.
+              </small>
+            </p>
+          </fieldset>
+        </form>
+      
+      <aside>
+        <theme-toggle></theme-toggle>
+      </aside>
+    </article>
+    <hr>
+    <footer>
+      <p>
+        <a href="/david/" title="Aller à l’accueil">Accueil</a>
+        •
+        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
+        •
+        <a href="http://larlet.com"
+           title="Go to my English profile"
+           data-instant>Pro</a>
+        •
+        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
+        •
+        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
+      </p>
+      <template id="theme-selector">
+        <form>
+          <style type="text/css">
+            fieldset div {
+              text-align: center;
+            }
+          </style>
+          <fieldset>
+            <legend>Thème</legend>
+            <div>
+              <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>
+            </div>
+          </fieldset>
+        </form>
+      </template>
+    </footer>
+    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
+    <script>
+      class ThemeToggle extends HTMLElement {
+        constructor() {
+          super()
+          const themeSelectorTemplate = document.querySelector('#theme-selector')
+          const form = themeSelectorTemplate.content.firstElementChild
+          this.attachShadow({ mode: 'open' })
+          this.shadowRoot.appendChild(form.cloneNode(true))
+        }
+
+        connectedCallback() {
+          const form = this.shadowRoot.querySelector('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 colorsLayer = undefined
+        let hasDarkRules = false
+        for (const styleSheet of Array.from(document.styleSheets)) {
+          let mediaRules = []
+          for (const layerRule of styleSheet.cssRules) {
+            if (!(layerRule instanceof CSSLayerBlockRule)) {
+              continue
+            }
+            if (layerRule.name === 'colors') {
+              colorsLayer = layerRule
+            }
+            for (const cssRule of layerRule.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) {
+            // Safari requires the `0` second parameter (even if default).
+            colorsLayer.insertRule(mediaRule.cssText, 0)
+            hasDarkRules = true
+          }
+        }
+
+        if (hasDarkRules) {
+          if ('customElements' in window && !customElements.get('theme-toggle')) {
+            customElements.define('theme-toggle', ThemeToggle)
+          }
+        }
+      })
+    </script>
+    
+  </body>
+</html>

david/2024/opensource/index.html

@@ -266,7 +266,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap&nbsp;2</a> <time datetime="2024-02-16">16 février 2024</time>
+      <a href="/david/2024/02/16/" title="Lien permanent vers cet article">uMap 2</a> <time datetime="2024-02-16">16 février 2024</time>
     </h2>
     
 

david/2024/parentalite/index.html

@@ -314,7 +314,7 @@
     
   
     <h2>
-      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-01-28">28 janvier 2024</time>
+      <a href="/david/2024/01/28/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-01-28">28 janvier 2024</time>
     </h2>
     
 <p>Même avec la nourriture suspendue, les souris on fait un sacré raffut. Elles devaient elles aussi avoir trop chaud. Après avoir dormi avec 2&nbsp;fenêtres ouvertes, il fait tout de même 18°C au réveil. Parfait pour notre gruau de camping (seconde tradition avec les nouilles instantanées), cette fois à la neige&nbsp;fondue.</p>
@@ -374,7 +374,7 @@
     
   
     <h2>
-      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-01-27">27 janvier 2024</time>
+      <a href="/david/2024/01/27/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-01-27">27 janvier 2024</time>
     </h2>
     
 <p>De la pluie verglaçante depuis 2&nbsp;jours. Une cheville pas encore opérationnelle. Mais de l’envie et une réservation depuis deux mois pour une première sortie hivernale en refuge. Ensemble. La route pour y aller est déjà épique et des flocons gros comme des pastèques s’écrasent sur le pare-brise. Il est rare au Québec de suivre un <em>pickup</em> qui ne dépasse pas les 70&#8239;km/h sur&nbsp;l’autoroute.</p>

david/2024/partage/index.html

@@ -134,6 +134,232 @@
     </p>
   </nav>
   
+    <h2>
+      <a href="/david/2024/03/13/" title="Lien permanent vers cet article">Sérendipité</a> <time datetime="2024-03-13">13 mars 2024</time>
+    </h2>
+    
+
+<blockquote lang="en">
+<p>Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble&nbsp;opinion.</p>
+<p>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. <mark>Can you really say you visited the location if you never left the&nbsp;hotel?</mark></p>
+<p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/following-links/" hreflang="en"
+            title="Consultation de l’article (anglais)">Following Links - Jim Nielsen’s Blog</a>
+            <a href="/david/cache/2024/c26881e908632b460cfd93fe61cc0466/" hreflang="en"
+                data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
+                data-source="https://blog.jim-nielsen.com/2024/following-links/"
+                data-date="2024-03-12"
+                data-favicon="https://blog.jim-nielsen.com/favicon.ico"
+                data-domain="blog.jim-nielsen.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>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.</p>
+
+<blockquote lang="en">
+<p>A surprising number of other features can be expressed in terms of&nbsp;links.</p>
+<p><cite><em><a data-link-domain="subconscious.substack.com" href="https://subconscious.substack.com/p/all-you-need-is-links" hreflang="en"
+            title="Consultation de l’article (anglais)">All you need is links</a>
+            <a href="/david/cache/2024/a801772c901c3e5cfad33f637d00151e/" hreflang="en"
+                data-tippy data-description="Before reaching for features, my goal is to explore, to the fullest extent, the creative potential of plain old links."
+                data-source="https://subconscious.substack.com/p/all-you-need-is-links"
+                data-date="2024-03-12"
+                data-favicon="https://substackcdn.com/image/fetch/f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%2Fpublic%2Fimages%2F4d01c24b-d99d-497e-9e60-1a2427581cad%2Ffavicon-16x16.png"
+                data-domain="subconscious.substack.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<a href="#hr-112" title="Lien vers cette section de la page"><hr id="hr-112" /></a>
+
+<blockquote lang="en">
+<p><code>printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'</code></p>
+<p><cite><em><a data-link-domain="notes.billmill.org" href="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html" hreflang="en"
+            title="Consultation de l’article (anglais)">Hyperlink escape codes</a>
+            <a href="/david/cache/2024/f68e9507784b5baf1584085908d60f58/" hreflang="en"
+                data-tippy data-description="To print out a clickable hyperlink in a terminal"
+                data-source="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html"
+                data-date="2024-03-13"
+                data-favicon="https://notes.billmill.org/favicon.ico"
+                data-domain="notes.billmill.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Qui me fait découvre <a data-link-domain="github.com" href="https://github.com/nedbat/watchgha">watchgha</a>, bien pratique pour avoir un accès rapide aux résultats de l’intégration&nbsp;continue.</p>
+<figure>
+    <a href="/static/david/2024/2024-03-13-watchgha.png"
+        title="Cliquer pour une version haute résolution">
+        <img
+            src="/static/david/2024/2024-03-13-watchgha.png"
+            width="2422" height="192"
+            srcset="/static/david/2024/2024-03-13-watchgha.png 2422w, /static/david/2024/2024-03-13-watchgha.png 660w, /static/david/2024/2024-03-13-watchgha.png 990w, /static/david/2024/2024-03-13-watchgha.png 1320w"
+            sizes="min(100vw, calc(100vh * 2422 / 192))"
+            loading="lazy"
+            decoding="async"
+            alt="Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.">
+    </a>
+    <figcaption>Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un&nbsp;moment).</figcaption>
+</figure>
+<a href="#hr-113" title="Lien vers cette section de la page"><hr id="hr-113" /></a>
+
+<blockquote>
+<p>Le constat est simple&nbsp;: je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu&nbsp;l’exemple.</p>
+<p><cite><em><a data-link-domain="vincent-valentin.name" href="https://vincent-valentin.name/articles/motivation-s" hreflang="fr"
+            title="Consultation de l’article">Motivation(s) chez Vincent Valentin.</a>
+            <a href="/david/cache/2024/c6e0fe933581c74380fa8eaa7f229353/" hreflang="fr"
+                data-tippy data-description="Site personnel de Vincent Valentin, habitant à Nantes, quarante-quatre ans et intégrateur web depuis plus de quinze ans."
+                data-source="https://vincent-valentin.name/articles/motivation-s"
+                data-date="2024-03-13"
+                data-favicon="https://vincent-valentin.name/favicon-32x32.png"
+                data-domain="vincent-valentin.name"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Très chouettes publications cette dernière semaine en tout cas&nbsp;&lt;3.</p>
+<a href="#hr-114" title="Lien vers cette section de la page"><hr id="hr-114" /></a>
+<p>Rétropédalage sur <a href="/david/2024/03/12/" title="Surligner">le surlignage</a>. 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 <em>opt-in</em> à un&nbsp;moment.</p>
+<a href="#hr-115" title="Lien vers cette section de la page"><hr id="hr-115" /></a>
+
+<blockquote>
+<p>Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. <mark>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.</mark> 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&nbsp;nuit.</p>
+<p>Au total j’ai passé plus de 230&nbsp;heures sur ce&nbsp;projet</p>
+<p><cite><em><a data-link-domain="hypothermia.fr" href="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/" hreflang="fr"
+            title="Consultation de l’article">Chiroto T. Datoca</a>
+            <a href="/david/cache/2024/f5294ac20ea593cce56caf2379813a4a/" hreflang="fr"
+                data-tippy data-description="Il y a quinze ans, j'ai entamé un projet de calligraphie que je n'ai jamais terminé, un cadeau que je n'ai jamais offert."
+                data-source="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/"
+                data-date="2024-03-13"
+                data-favicon="https://www.hypothermia.fr/wp-content/uploads/fbrfg/favicon-32x32.png"
+                data-domain="hypothermia.fr"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas&nbsp;l’artiste.</p>
+<a href="#hr-116" title="Lien vers cette section de la page"><hr id="hr-116" /></a>
+
+<blockquote lang="en">
+<p>Rust-like error handling in Python, with type-safety in&nbsp;mind.</p>
+<p><cite><em><a data-link-domain="github.com" href="https://github.com/alexandermalyga/poltergeist">poltergeist</a></em></cite></p>
+</blockquote>
+<p>J’ai très souvent retrouvé le besoin de ce <em>pattern</em> dans mes&nbsp;projets.</p>
+<a href="#hr-117" title="Lien vers cette section de la page"><hr id="hr-117" /></a>
+<p>Sortie de la <a data-link-domain="pypi.org" href="https://pypi.org/project/pressoir-cli/2.0.0/">version 2.0&nbsp;de pressoir-cli</a> (oui, <a href="/david/2024/02/16/" title="uMap 2">c’est ma période</a>). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop <em>meta</em> pour ne pas le&nbsp;faire&nbsp;😇.</p>
+<a href="#hr-118" title="Lien vers cette section de la page"><hr id="hr-118" /></a>
+
+<blockquote>
+<p>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&nbsp;puissante&#8239;!</p>
+<p><cite><em><a data-link-domain="buzut.net" href="https://buzut.net/optimiser-nginx/" hreflang="fr"
+            title="Consultation de l’article">Optimisez Nginx pour de meilleurs performances</a>
+            <a href="/david/cache/2024/b33059055c307477e43390a51f9a104a/" hreflang="fr"
+                data-tippy data-description="Nginx est réputé pour sa rapidité, mais quand votre serveur fait face à un trafic énorme, il est possible d'en tirer encore plus. Voyons comment !"
+                data-source="https://buzut.net/optimiser-nginx/"
+                data-date="2024-03-13"
+                data-favicon="https://buzut.net/img/favicon.png"
+                data-domain="buzut.net"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Pour lecture&nbsp;ultérieure.</p>
+<a href="#hr-119" title="Lien vers cette section de la page"><hr id="hr-119" /></a>
+
+<blockquote>
+<p><code>font-size: calc(1rem + 0.25vw);</code></p>
+<p><cite><em><a data-link-domain="jameshfisher.com" href="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/" hreflang="en"
+            title="Consultation de l’article (anglais)">A formula for responsive font-size</a>
+            <a href="/david/cache/2024/08b2b2735f74ebf856d8a850cc9e41cc/" hreflang="en"
+                data-tippy data-description="This CSS is now part of most websites I make:"
+                data-source="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/"
+                data-date="2024-03-13"
+                data-favicon="https://jameshfisher.com/assets/jim_128.png"
+                data-domain="jameshfisher.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Moins poussé que le <a data-link-domain="utopia.fyi" href="https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&amp;s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&amp;g=s,l,xl,12">Fluid type scale calculator</a> mais dans un contexte plus minimaliste / simple ça fait déjà le&nbsp;taf.</p>
+<a href="#hr-120" title="Lien vers cette section de la page"><hr id="hr-120" /></a>
+
+<blockquote lang="en">
+<p>To enable such progress, <strong>the Web Consortium too has evolved, always taking a people-first approach:</strong> the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003&nbsp;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&nbsp;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 <mark>re-launching the Consortium in 2023&nbsp;as a public-interest non-profit organization</mark> to work for the good of the&nbsp;public.</p>
+<p><cite><em><a data-link-domain="w3.org" href="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/" hreflang="en"
+            title="Consultation de l’article (anglais)">From a humble beginning 35&nbsp;years ago, the Web is now central to the daily lives of billions</a>
+            <a href="/david/cache/2024/c684ecb41e8e4ea04c6dac1e1d87f776/" hreflang="en"
+                data-tippy data-description="In this blog post, W3C CEO Seth Dobbs depicts how from a humble beginning 35 years ago, the Web is now central to the daily lives of billions of people."
+                data-source="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/"
+                data-date="2024-03-13"
+                data-favicon="https://www.w3.org/favicon.ico"
+                data-domain="w3.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>35&nbsp;ans de liens. Merci Tim <em>et al.</em> d’avoir permis&nbsp;cela.</p>
+
+    
+      <nav>
+        <p>
+          
+            <a href="/david/2024/liens/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#liens</a>
+          
+            <a href="/david/2024/partage/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#partage</a>
+          
+            <a href="/david/2024/web/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#web</a>
+          
+          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
+        </p>
+      </nav>
+    
+  
     <h2>
       <a href="/david/2024/03/12/" title="Lien permanent vers cet article">Surligner</a> <time datetime="2024-03-12">12 mars 2024</time>
     </h2>
@@ -179,6 +405,7 @@
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
                 <span class="sr-only">[archive]</span></a> <a data-link-domain="caniuse.com" href="https://caniuse.com/mdn-css_properties_animation-range">prochainement</a>.</p>
+<p><mark>Le lendemain</mark>, <a href="/david/2024/03/13/#hr-114">j’ai désactivé l’animation</a> suite à plusieurs retours de&nbsp;lecteur·ices.</p>
 <a href="#hr-110" title="Lien vers cette section de la page"><hr id="hr-110" /></a>
 
 <blockquote>

david/2024/psychologie/index.html

@@ -210,7 +210,7 @@
     
   
     <h2>
-      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
+      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-03-05">5 mars 2024</time>
     </h2>
     
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>

david/2024/solastalgia/index.html

@@ -135,7 +135,7 @@
   </nav>
   
     <h2>
-      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
+      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-03-04">4 mars 2024</time>
     </h2>
     
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>

david/2024/sport/index.html

@@ -153,7 +153,7 @@
                     <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
-                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
+                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
 <figure>
     <a href="/static/david/2024/2024-03-02-coros-apex-2-temperatures.png"
         title="Cliquer pour une version haute résolution">
@@ -169,7 +169,7 @@
     <figcaption>Même Kiki a du mal par -20°C&nbsp;!</figcaption>
 </figure>
 <p><em>Détail marrant&nbsp;: Kilian Jornet était déjà sur les photos de promotion de la Suunto Ambit Black et on le retrouve sur la Coros Apex 2&nbsp;Pro&nbsp;d’aujourd’hui.</em></p>
-<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
+<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
 <p>Je cherche en priorité une montre qui affiche un fond de carte, ce n’est pas tant ma trace programmée que ce qu’il y a autour qui m’intéresse dans d’autres contextes exploratoires. Sur ma montre actuelle, je ne pouvais qu’enregistrer une trace à suivre qui m’indiquait les déviations mais <em>pour ma pratique</em> ce n’était pas très intéressant. Savoir qu’il y a un lac / chemin forestier à proximité peut changer ma sortie. Difficile de savoir <em>a priori</em> si les données pour mes lieux de balade seront à jour ou suffisamment&nbsp;détaillées.</p>
 <p>J’ai regardé l’Apple Watch Ultra 2, la Suunto Vertical Titanium Solar, des Garmin d’«&nbsp;aventure&nbsp;» et finalement la Coros Apex 2 (Pro). Dans tous les cas, ce sont de grosses montres et j’ai un poignet fin. Dans tous les cas, le <em>marketing</em> est complètement délirant&nbsp;🙃. Sans compter le prix. La Coros semble être la moins chère (!) qui réponde à l’ensemble de mes attentes, la version Pro ayant une meilleure précision GPS et autonomie, ce qui m’importe&nbsp;beaucoup.</p>
 <p>Ah, <a href="/david/2024/02/07/#hr-69">aussi</a>. Difficile à justifier, même amortie sur la prochaine décennie… et c’est d’ailleurs là où j’ai de sérieux doutes en terme d’obsolescence programmée, ce qui a duré 10&nbsp;ans ne durera probablement plus 10&nbsp;ans. Triste réalité. J’essaye de ne pas trop me demande si <em>je</em> vais être capable de passer encore une décennie à arpenter la&nbsp;forêt.</p>
@@ -198,7 +198,7 @@
     
   
     <h2>
-      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-02-24">24 février 2024</time>
+      <a href="/david/2024/02/24/" title="Lien permanent vers cet article">Jour 1</a> <time datetime="2024-02-24">24 février 2024</time>
     </h2>
     
 <p>Arrivée en fin de matinée. La voiture affiche -12°C et je sais que je ne vais probablement pas avoir plus ces 30&nbsp;prochaines heures dans la forêt. Depuis que j’ai appris la connaissance de la Grande Boucle de la forêt de Ouareau, j’ai eu envie de la faire, à mon rythme, avec une nuit à l’autre bout du parc. Ma pulka est énorme, ils annoncent une nuit fraîche et avec du vent. Je me lance dans la première descente alors que la neige est dure comme de la roche. J’apprends à mes dépens que les écailles des skis ne sont pas adaptées lorsque je repars en arrière à la première montée. Première chute, ça commence&nbsp;bien.</p>

david/2024/technique/index.html

@@ -179,6 +179,7 @@
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
                 <span class="sr-only">[archive]</span></a> <a data-link-domain="caniuse.com" href="https://caniuse.com/mdn-css_properties_animation-range">prochainement</a>.</p>
+<p><mark>Le lendemain</mark>, <a href="/david/2024/03/13/#hr-114">j’ai désactivé l’animation</a> suite à plusieurs retours de&nbsp;lecteur·ices.</p>
 <a href="#hr-110" title="Lien vers cette section de la page"><hr id="hr-110" /></a>
 
 <blockquote>
@@ -359,7 +360,7 @@
                     <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
-                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
+                <span class="sr-only">[archive]</span></a> achetée il y a une douzaine d’années. (Merci à Suunto de garder une page avec les caractéristiques d’un produit qui n’est plus construit / vendu&#8239;! C’est notamment utile pour comparer les spécifications de taille et poids.) Je me demandais si les montres actuelles allaient pouvoir résister à une <a href="/david/2024/02/24/" title="Jour 1">température inférieure à -20°C</a> et il semblerait que ce ne soit pas le cas, tous les modèles que j’ai consulté spécifient clairement que c’est la limite&nbsp;basse.</p>
 <figure>
     <a href="/static/david/2024/2024-03-02-coros-apex-2-temperatures.png"
         title="Cliquer pour une version haute résolution">
@@ -375,7 +376,7 @@
     <figcaption>Même Kiki a du mal par -20°C&nbsp;!</figcaption>
 </figure>
 <p><em>Détail marrant&nbsp;: Kilian Jornet était déjà sur les photos de promotion de la Suunto Ambit Black et on le retrouve sur la Coros Apex 2&nbsp;Pro&nbsp;d’aujourd’hui.</em></p>
-<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
+<p>Au-delà de l’aspect scientifique d’envisager une montre qui résiste aux températures locales, il y a une <a href="/david/2024/01/27/" title="Jour 1">situation récente</a> qui me reste en tête aussi (ce n’est <a href="/david/2020/12/18/">pas la première fois</a>, et ce ne sera certainement pas la dernière). Une position GPS précise aurait certainement pu m’aider dans ce cas là, si je n’avais pas été trop entêté pour ne pas la consulter. J’envisage aussi des <a href="/david/2024/01/06/" title="Objectif">objectifs</a> sur lesquels j’ai besoin de me rassurer / entraîner spécifiquement en ayant une idée des distances que je pourrais parcourir dans un contexte donné que j’envisage plus rapide que ce que j’ai l’habitude de&nbsp;faire.</p>
 <p>Je cherche en priorité une montre qui affiche un fond de carte, ce n’est pas tant ma trace programmée que ce qu’il y a autour qui m’intéresse dans d’autres contextes exploratoires. Sur ma montre actuelle, je ne pouvais qu’enregistrer une trace à suivre qui m’indiquait les déviations mais <em>pour ma pratique</em> ce n’était pas très intéressant. Savoir qu’il y a un lac / chemin forestier à proximité peut changer ma sortie. Difficile de savoir <em>a priori</em> si les données pour mes lieux de balade seront à jour ou suffisamment&nbsp;détaillées.</p>
 <p>J’ai regardé l’Apple Watch Ultra 2, la Suunto Vertical Titanium Solar, des Garmin d’«&nbsp;aventure&nbsp;» et finalement la Coros Apex 2 (Pro). Dans tous les cas, ce sont de grosses montres et j’ai un poignet fin. Dans tous les cas, le <em>marketing</em> est complètement délirant&nbsp;🙃. Sans compter le prix. La Coros semble être la moins chère (!) qui réponde à l’ensemble de mes attentes, la version Pro ayant une meilleure précision GPS et autonomie, ce qui m’importe&nbsp;beaucoup.</p>
 <p>Ah, <a href="/david/2024/02/07/#hr-69">aussi</a>. Difficile à justifier, même amortie sur la prochaine décennie… et c’est d’ailleurs là où j’ai de sérieux doutes en terme d’obsolescence programmée, ce qui a duré 10&nbsp;ans ne durera probablement plus 10&nbsp;ans. Triste réalité. J’essaye de ne pas trop me demande si <em>je</em> vais être capable de passer encore une décennie à arpenter la&nbsp;forêt.</p>

david/2024/web/index.html

@@ -134,6 +134,232 @@
     </p>
   </nav>
   
+    <h2>
+      <a href="/david/2024/03/13/" title="Lien permanent vers cet article">Sérendipité</a> <time datetime="2024-03-13">13 mars 2024</time>
+    </h2>
+    
+
+<blockquote lang="en">
+<p>Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble&nbsp;opinion.</p>
+<p>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. <mark>Can you really say you visited the location if you never left the&nbsp;hotel?</mark></p>
+<p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/following-links/" hreflang="en"
+            title="Consultation de l’article (anglais)">Following Links - Jim Nielsen’s Blog</a>
+            <a href="/david/cache/2024/c26881e908632b460cfd93fe61cc0466/" hreflang="en"
+                data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
+                data-source="https://blog.jim-nielsen.com/2024/following-links/"
+                data-date="2024-03-12"
+                data-favicon="https://blog.jim-nielsen.com/favicon.ico"
+                data-domain="blog.jim-nielsen.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>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.</p>
+
+<blockquote lang="en">
+<p>A surprising number of other features can be expressed in terms of&nbsp;links.</p>
+<p><cite><em><a data-link-domain="subconscious.substack.com" href="https://subconscious.substack.com/p/all-you-need-is-links" hreflang="en"
+            title="Consultation de l’article (anglais)">All you need is links</a>
+            <a href="/david/cache/2024/a801772c901c3e5cfad33f637d00151e/" hreflang="en"
+                data-tippy data-description="Before reaching for features, my goal is to explore, to the fullest extent, the creative potential of plain old links."
+                data-source="https://subconscious.substack.com/p/all-you-need-is-links"
+                data-date="2024-03-12"
+                data-favicon="https://substackcdn.com/image/fetch/f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%2Fpublic%2Fimages%2F4d01c24b-d99d-497e-9e60-1a2427581cad%2Ffavicon-16x16.png"
+                data-domain="subconscious.substack.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<a href="#hr-112" title="Lien vers cette section de la page"><hr id="hr-112" /></a>
+
+<blockquote lang="en">
+<p><code>printf '\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n'</code></p>
+<p><cite><em><a data-link-domain="notes.billmill.org" href="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html" hreflang="en"
+            title="Consultation de l’article (anglais)">Hyperlink escape codes</a>
+            <a href="/david/cache/2024/f68e9507784b5baf1584085908d60f58/" hreflang="en"
+                data-tippy data-description="To print out a clickable hyperlink in a terminal"
+                data-source="https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html"
+                data-date="2024-03-13"
+                data-favicon="https://notes.billmill.org/favicon.ico"
+                data-domain="notes.billmill.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Qui me fait découvre <a data-link-domain="github.com" href="https://github.com/nedbat/watchgha">watchgha</a>, bien pratique pour avoir un accès rapide aux résultats de l’intégration&nbsp;continue.</p>
+<figure>
+    <a href="/static/david/2024/2024-03-13-watchgha.png"
+        title="Cliquer pour une version haute résolution">
+        <img
+            src="/static/david/2024/2024-03-13-watchgha.png"
+            width="2422" height="192"
+            srcset="/static/david/2024/2024-03-13-watchgha.png 2422w, /static/david/2024/2024-03-13-watchgha.png 660w, /static/david/2024/2024-03-13-watchgha.png 990w, /static/david/2024/2024-03-13-watchgha.png 1320w"
+            sizes="min(100vw, calc(100vh * 2422 / 192))"
+            loading="lazy"
+            decoding="async"
+            alt="Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.">
+    </a>
+    <figcaption>Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un&nbsp;moment).</figcaption>
+</figure>
+<a href="#hr-113" title="Lien vers cette section de la page"><hr id="hr-113" /></a>
+
+<blockquote>
+<p>Le constat est simple&nbsp;: je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu&nbsp;l’exemple.</p>
+<p><cite><em><a data-link-domain="vincent-valentin.name" href="https://vincent-valentin.name/articles/motivation-s" hreflang="fr"
+            title="Consultation de l’article">Motivation(s) chez Vincent Valentin.</a>
+            <a href="/david/cache/2024/c6e0fe933581c74380fa8eaa7f229353/" hreflang="fr"
+                data-tippy data-description="Site personnel de Vincent Valentin, habitant à Nantes, quarante-quatre ans et intégrateur web depuis plus de quinze ans."
+                data-source="https://vincent-valentin.name/articles/motivation-s"
+                data-date="2024-03-13"
+                data-favicon="https://vincent-valentin.name/favicon-32x32.png"
+                data-domain="vincent-valentin.name"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Très chouettes publications cette dernière semaine en tout cas&nbsp;&lt;3.</p>
+<a href="#hr-114" title="Lien vers cette section de la page"><hr id="hr-114" /></a>
+<p>Rétropédalage sur <a href="/david/2024/03/12/" title="Surligner">le surlignage</a>. 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 <em>opt-in</em> à un&nbsp;moment.</p>
+<a href="#hr-115" title="Lien vers cette section de la page"><hr id="hr-115" /></a>
+
+<blockquote>
+<p>Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. <mark>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.</mark> 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&nbsp;nuit.</p>
+<p>Au total j’ai passé plus de 230&nbsp;heures sur ce&nbsp;projet</p>
+<p><cite><em><a data-link-domain="hypothermia.fr" href="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/" hreflang="fr"
+            title="Consultation de l’article">Chiroto T. Datoca</a>
+            <a href="/david/cache/2024/f5294ac20ea593cce56caf2379813a4a/" hreflang="fr"
+                data-tippy data-description="Il y a quinze ans, j'ai entamé un projet de calligraphie que je n'ai jamais terminé, un cadeau que je n'ai jamais offert."
+                data-source="https://www.hypothermia.fr/2024/03/chiroto-t-datoca/"
+                data-date="2024-03-13"
+                data-favicon="https://www.hypothermia.fr/wp-content/uploads/fbrfg/favicon-32x32.png"
+                data-domain="hypothermia.fr"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas&nbsp;l’artiste.</p>
+<a href="#hr-116" title="Lien vers cette section de la page"><hr id="hr-116" /></a>
+
+<blockquote lang="en">
+<p>Rust-like error handling in Python, with type-safety in&nbsp;mind.</p>
+<p><cite><em><a data-link-domain="github.com" href="https://github.com/alexandermalyga/poltergeist">poltergeist</a></em></cite></p>
+</blockquote>
+<p>J’ai très souvent retrouvé le besoin de ce <em>pattern</em> dans mes&nbsp;projets.</p>
+<a href="#hr-117" title="Lien vers cette section de la page"><hr id="hr-117" /></a>
+<p>Sortie de la <a data-link-domain="pypi.org" href="https://pypi.org/project/pressoir-cli/2.0.0/">version 2.0&nbsp;de pressoir-cli</a> (oui, <a href="/david/2024/02/16/" title="uMap 2">c’est ma période</a>). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop <em>meta</em> pour ne pas le&nbsp;faire&nbsp;😇.</p>
+<a href="#hr-118" title="Lien vers cette section de la page"><hr id="hr-118" /></a>
+
+<blockquote>
+<p>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&nbsp;puissante&#8239;!</p>
+<p><cite><em><a data-link-domain="buzut.net" href="https://buzut.net/optimiser-nginx/" hreflang="fr"
+            title="Consultation de l’article">Optimisez Nginx pour de meilleurs performances</a>
+            <a href="/david/cache/2024/b33059055c307477e43390a51f9a104a/" hreflang="fr"
+                data-tippy data-description="Nginx est réputé pour sa rapidité, mais quand votre serveur fait face à un trafic énorme, il est possible d'en tirer encore plus. Voyons comment !"
+                data-source="https://buzut.net/optimiser-nginx/"
+                data-date="2024-03-13"
+                data-favicon="https://buzut.net/img/favicon.png"
+                data-domain="buzut.net"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Pour lecture&nbsp;ultérieure.</p>
+<a href="#hr-119" title="Lien vers cette section de la page"><hr id="hr-119" /></a>
+
+<blockquote>
+<p><code>font-size: calc(1rem + 0.25vw);</code></p>
+<p><cite><em><a data-link-domain="jameshfisher.com" href="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/" hreflang="en"
+            title="Consultation de l’article (anglais)">A formula for responsive font-size</a>
+            <a href="/david/cache/2024/08b2b2735f74ebf856d8a850cc9e41cc/" hreflang="en"
+                data-tippy data-description="This CSS is now part of most websites I make:"
+                data-source="https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/"
+                data-date="2024-03-13"
+                data-favicon="https://jameshfisher.com/assets/jim_128.png"
+                data-domain="jameshfisher.com"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>Moins poussé que le <a data-link-domain="utopia.fyi" href="https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&amp;s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&amp;g=s,l,xl,12">Fluid type scale calculator</a> mais dans un contexte plus minimaliste / simple ça fait déjà le&nbsp;taf.</p>
+<a href="#hr-120" title="Lien vers cette section de la page"><hr id="hr-120" /></a>
+
+<blockquote lang="en">
+<p>To enable such progress, <strong>the Web Consortium too has evolved, always taking a people-first approach:</strong> the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003&nbsp;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&nbsp;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 <mark>re-launching the Consortium in 2023&nbsp;as a public-interest non-profit organization</mark> to work for the good of the&nbsp;public.</p>
+<p><cite><em><a data-link-domain="w3.org" href="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/" hreflang="en"
+            title="Consultation de l’article (anglais)">From a humble beginning 35&nbsp;years ago, the Web is now central to the daily lives of billions</a>
+            <a href="/david/cache/2024/c684ecb41e8e4ea04c6dac1e1d87f776/" hreflang="en"
+                data-tippy data-description="In this blog post, W3C CEO Seth Dobbs depicts how from a humble beginning 35 years ago, the Web is now central to the daily lives of billions of people."
+                data-source="https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/"
+                data-date="2024-03-13"
+                data-favicon="https://www.w3.org/favicon.ico"
+                data-domain="w3.org"
+                ><svg xmlns="http://www.w3.org/2000/svg"
+                    width="24" height="24" viewBox="0 0 24 24" fill="none"
+                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
+                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
+                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
+                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
+                </svg>
+                <span class="sr-only">[archive]</span></a></em></cite></p>
+</blockquote>
+<p>35&nbsp;ans de liens. Merci Tim <em>et al.</em> d’avoir permis&nbsp;cela.</p>
+
+    
+      <nav>
+        <p>
+          
+            <a href="/david/2024/liens/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#liens</a>
+          
+            <a href="/david/2024/partage/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#partage</a>
+          
+            <a href="/david/2024/web/"
+               title="Liste de tous les articles 2024 associés à cette étiquette"
+               rel="tag">#web</a>
+          
+          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
+        </p>
+      </nav>
+    
+  
     <h2>
       <a href="/david/2024/03/12/" title="Lien permanent vers cet article">Surligner</a> <time datetime="2024-03-12">12 mars 2024</time>
     </h2>
@@ -179,6 +405,7 @@
                     <line x1="12" y1="17" x2="12.01" y2="17"></line>
                 </svg>
                 <span class="sr-only">[archive]</span></a> <a data-link-domain="caniuse.com" href="https://caniuse.com/mdn-css_properties_animation-range">prochainement</a>.</p>
+<p><mark>Le lendemain</mark>, <a href="/david/2024/03/13/#hr-114">j’ai désactivé l’animation</a> suite à plusieurs retours de&nbsp;lecteur·ices.</p>
 <a href="#hr-110" title="Lien vers cette section de la page"><hr id="hr-110" /></a>
 
 <blockquote>

david/index.html

@@ -332,6 +332,13 @@
         background-color: var(--hover-tag-color);
       }
     
+      body [data-tag="liens"]:hover,
+      body [data-liens]:hover,
+      body:has([data-tag="liens"]:hover) [data-liens],
+      body:has([data-liens]:hover) [data-tag="liens"] {
+        background-color: var(--hover-tag-color);
+      }
+    
       body [data-tag="opendata"]:hover,
       body [data-opendata]:hover,
       body:has([data-tag="opendata"]:hover) [data-opendata],
@@ -447,6 +454,7 @@
   </style>
   <p>Liste des publications récentes en ordre anté-chronologique :</p>
   <p>
+    <a href="/david/2024/03/13/" data-liens data-partage data-web  title="Étiquettes : liens, partage, web.">Sérendipité</a>,
     <a href="/david/2024/03/12/" data-partage data-technique data-web  title="Étiquettes : partage, technique, web.">Surligner</a>,
     <a href="/david/2024/03/11/" data-decentralisation data-dependance data-web  title="Étiquettes : décentralisation, dépendance, web.">LoginWall</a>,
     <a href="/david/2024/03/10/" data-adaptation data-cinema data-lecture  title="Étiquettes : adaptation, cinéma, lecture.">Dune</a>,
@@ -454,8 +462,8 @@
     <a href="/david/2024/03/08/" data-experience data-psychologie data-technique  title="Étiquettes : expérience, psychologie, technique.">Flow</a>,
     <a href="/david/2024/03/07/" data-commun data-deception data-web  title="Étiquettes : commun, déception, web.">Sondages</a>,
     <a href="/david/2024/03/06/" data-apprentissage data-parentalite data-protopie  title="Étiquettes : apprentissage, parentalité, protopie.">Vannerie</a>,
-    <a href="/david/2024/03/05/" data-adaptation data-aventure data-psychologie  title="Étiquettes : adaptation, aventure, psychologie.">Jour&nbsp;2</a>,
-    <a href="/david/2024/03/04/" data-dystopie data-foret data-solastalgia  title="Étiquettes : dystopie, forêt, solastalgia.">Jour&nbsp;1</a>,
+    <a href="/david/2024/03/05/" data-adaptation data-aventure data-psychologie  title="Étiquettes : adaptation, aventure, psychologie.">Jour 2</a>,
+    <a href="/david/2024/03/04/" data-dystopie data-foret data-solastalgia  title="Étiquettes : dystopie, forêt, solastalgia.">Jour 1</a>,
     <a href="/david/2024/03/03/" data-dependance data-opensource data-parvenir  title="Étiquettes : dépendance, opensource, parvenir.">Permanence</a>,
     <a href="/david/2024/03/02/" data-dependance data-sport data-technique  title="Étiquettes : dépendance, sport, technique.">Montre</a>,
     <a href="/david/2024/03/01/" data-evolution data-laboratoire data-web  title="Étiquettes : évolution, laboratoire, web.">Simple</a>,
@@ -463,8 +471,8 @@
     <a href="/david/2024/02/28/" data-documentation data-partage data-solastalgia  title="Étiquettes : documentation, partage, solastalgia.">Dérèglement</a>,
     <a href="/david/2024/02/27/" data-ecriture data-processus data-psychologie  title="Étiquettes : écriture, processus, psychologie.">Rédaction</a>,
     <a href="/david/2024/02/26/" data-parentalite data-poesie data-solastalgia  title="Étiquettes : parentalité, poésie, solastalgia.">Galaxie</a>,
-    <a href="/david/2024/02/25/" data-aventure data-foret data-gratitude  title="Étiquettes : aventure, forêt, gratitude.">Jour&nbsp;2</a>,
-    <a href="/david/2024/02/24/" data-aventure data-foret data-sport  title="Étiquettes : aventure, forêt, sport.">Jour&nbsp;1</a>,
+    <a href="/david/2024/02/25/" data-aventure data-foret data-gratitude  title="Étiquettes : aventure, forêt, gratitude.">Jour 2</a>,
+    <a href="/david/2024/02/24/" data-aventure data-foret data-sport  title="Étiquettes : aventure, forêt, sport.">Jour 1</a>,
     <a href="/david/2024/02/23/" data-apprentissage data-processus data-web  title="Étiquettes : apprentissage, processus, web.">Préparatifs</a>,
     <a href="/david/2024/02/22/" data-decision data-experience data-partage  title="Étiquettes : décision, expérience, partage.">Responsabilité</a>,
     <a href="/david/2024/02/21/" data-dystopie data-ia data-psychologie  title="Étiquettes : dystopie, IA, psychologie.">Cinéma</a>,
@@ -472,7 +480,7 @@
     <a href="/david/2024/02/19/" data-apprentissage data-laboratoire data-web  title="Étiquettes : apprentissage, laboratoire, web.">Injection</a>,
     <a href="/david/2024/02/18/" data-commun data-dependance data-technique  title="Étiquettes : commun, dépendance, technique.">In·directions</a>,
     <a href="/david/2024/02/17/" data-ecriture data-lecture data-solastalgia  title="Étiquettes : écriture, lecture, solastalgia.">Quotidien</a>,
-    <a href="/david/2024/02/16/" data-commun data-decision data-opensource  title="Étiquettes : commun, décision, opensource.">uMap&nbsp;2</a>,
+    <a href="/david/2024/02/16/" data-commun data-decision data-opensource  title="Étiquettes : commun, décision, opensource.">uMap 2</a>,
     <a href="/david/2024/02/15/" data-commun data-decision data-opensource  title="Étiquettes : commun, décision, opensource.">Licence</a>,
     <a href="/david/2024/02/14/" data-commun data-opendata data-technique  title="Étiquettes : commun, opendata, technique.">GéoCodage</a>,
     <a href="/david/2024/02/13/" data-apprentissage data-processus data-protopie  title="Étiquettes : apprentissage, processus, protopie.">Feutrage</a>,
@@ -491,8 +499,8 @@
     <a href="/david/2024/01/31/" data-commun data-documentation data-partage  title="Étiquettes : commun, documentation, partage.">Mécénat</a>,
     <a href="/david/2024/01/30/" data-apprentissage data-equipe data-processus  title="Étiquettes : apprentissage, équipe, processus.">Équipe</a>,
     <a href="/david/2024/01/29/" data-echanges data-technique data-web  title="Étiquettes : échanges, technique, web.">Déploiement</a>,
-    <a href="/david/2024/01/28/" data-experience data-foret data-parentalite  title="Étiquettes : expérience, forêt, parentalité.">Jour&nbsp;2</a>,
-    <a href="/david/2024/01/27/" data-experience data-foret data-parentalite  title="Étiquettes : expérience, forêt, parentalité.">Jour&nbsp;1</a>,
+    <a href="/david/2024/01/28/" data-experience data-foret data-parentalite  title="Étiquettes : expérience, forêt, parentalité.">Jour 2</a>,
+    <a href="/david/2024/01/27/" data-experience data-foret data-parentalite  title="Étiquettes : expérience, forêt, parentalité.">Jour 1</a>,
     <a href="/david/2024/01/26/" data-gratitude data-partage data-psychologie  title="Étiquettes : gratitude, partage, psychologie.">Cargo</a>,
     <a href="/david/2024/01/25/" data-apprentissage data-equipe data-velo  title="Étiquettes : apprentissage, équipe, vélo.">Stratégie</a>,
     <a href="/david/2024/01/24/" data-communaute data-equipe data-processus  title="Étiquettes : communauté, équipe, processus.">Taille</a>,
@@ -551,10 +559,11 @@
     <a href="/david/2024/identite/" data-tag="identite" rel="tag">#identité (1)</a>,
     <a href="/david/2024/laboratoire/" data-tag="laboratoire" rel="tag">#laboratoire (3)</a>,
     <a href="/david/2024/lecture/" data-tag="lecture" rel="tag">#lecture (3)</a>,
+    <a href="/david/2024/liens/" data-tag="liens" rel="tag">#liens (1)</a>,
     <a href="/david/2024/opendata/" data-tag="opendata" rel="tag">#opendata (1)</a>,
     <a href="/david/2024/opensource/" data-tag="opensource" rel="tag">#opensource (7)</a>,
     <a href="/david/2024/parentalite/" data-tag="parentalite" rel="tag">#parentalité (5)</a>,
-    <a href="/david/2024/partage/" data-tag="partage" rel="tag">#partage (5)</a>,
+    <a href="/david/2024/partage/" data-tag="partage" rel="tag">#partage (6)</a>,
     <a href="/david/2024/parvenir/" data-tag="parvenir" rel="tag">#parvenir (3)</a>,
     <a href="/david/2024/photographie/" data-tag="photographie" rel="tag">#photographie (2)</a>,
     <a href="/david/2024/poesie/" data-tag="poesie" rel="tag">#poésie (2)</a>,
@@ -566,7 +575,7 @@
     <a href="/david/2024/sport/" data-tag="sport" rel="tag">#sport (5)</a>,
     <a href="/david/2024/technique/" data-tag="technique" rel="tag">#technique (15)</a>,
     <a href="/david/2024/velo/" data-tag="velo" rel="tag">#vélo (1)</a>,
-    <a href="/david/2024/web/" data-tag="web" rel="tag">#web (12)</a>.
+    <a href="/david/2024/web/" data-tag="web" rel="tag">#web (13)</a>.
       
     
   </p>

david/log/index.xml

@@ -6,13 +6,102 @@
     <link href="https://larlet.fr/david/" rel="alternate" type="text/html" />
     <link href="https://larlet.fr/david/log/" rel="self" />
     <id>https://larlet.fr/david/</id>
-    <updated>2024-03-13T12:00:00+01:00</updated>
+    <updated>2024-03-14T12:00:00+01:00</updated>
     <author>
         <name>David Larlet</name>
         <uri>https://larlet.fr/david/</uri>
     </author>
     <rights>Copyright (c) 2004-2024, David Larlet</rights>
     
+        <entry xml:lang="fr">
+            <title type="html">Sérendipité</title>
+            <link href="https://larlet.fr/david/2024/03/13/" rel="alternate" type="text/html" />
+            <updated>2024-03-13T12:00:00+01:00</updated>
+            <id>https://larlet.fr/david/2024/03/13/</id>
+            <summary type="html">
+
+&lt;blockquote lang=&quot;en&quot;&gt;
+&lt;p&gt;Discovering things via links is way more fun than most algorithmically-driven discovery — in my humble&amp;nbsp;opinion.&lt;/p&gt;
+&lt;p&gt;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. &lt;mark&gt;Can you really say you visited the location if you never left the&amp;nbsp;hotel?&lt;/mark&gt;&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://blog.jim-nielsen.com/2024/following-links/&quot;&gt;Following Links - Jim Nielsen’s&amp;nbsp;Blog&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;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.&lt;/p&gt;
+
+&lt;blockquote lang=&quot;en&quot;&gt;
+&lt;p&gt;A surprising number of other features can be expressed in terms of&amp;nbsp;links.&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://subconscious.substack.com/p/all-you-need-is-links&quot;&gt;All you need is&amp;nbsp;links&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;hr /&gt;
+
+&lt;blockquote lang=&quot;en&quot;&gt;
+&lt;p&gt;&lt;code&gt;printf &#x27;\e]8;;http://example.com\e\\This is a link\e]8;;\e\\\n&#x27;&lt;/code&gt;&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://notes.billmill.org/programming/bash/Hyperlink_escape_codes.html&quot;&gt;Hyperlink escape&amp;nbsp;codes&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Qui me fait découvre &lt;a href=&quot;https://github.com/nedbat/watchgha&quot;&gt;watchgha&lt;/a&gt;, bien pratique pour avoir un accès rapide aux résultats de l’intégration&amp;nbsp;continue.&lt;/p&gt;
+&lt;figure&gt;
+    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-13-watchgha.png&quot;
+        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
+        &lt;img
+            src=&quot;https://larlet.fr/static/david/2024/2024-03-13-watchgha.png&quot;
+            width=&quot;2422&quot; height=&quot;192&quot;
+            srcset=&quot;/static/david/2024/2024-03-13-watchgha.png 2422w, /static/david/2024/2024-03-13-watchgha.png 660w, /static/david/2024/2024-03-13-watchgha.png 990w, /static/david/2024/2024-03-13-watchgha.png 1320w&quot;
+            sizes=&quot;min(100vw, calc(100vh * 2422 / 192))&quot;
+            loading=&quot;lazy&quot;
+            decoding=&quot;async&quot;
+            alt=&quot;Capture d’écran du résultat de la commande git runs avec l’alias git qui pointe vers watchgha.&quot;&gt;
+    &lt;/a&gt;
+    &lt;figcaption&gt;Ça passe 🎉 (je vais essayer de faire une démo d’oEmbed par ici à un&amp;nbsp;moment).&lt;/figcaption&gt;
+&lt;/figure&gt;
+&lt;hr /&gt;
+
+&lt;blockquote&gt;
+&lt;p&gt;Le constat est simple&amp;nbsp;: je trouve que le Web ne va pas fort en ce moment, et je voulais à ma petite échelle montrer un peu&amp;nbsp;l’exemple.&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://vincent-valentin.name/articles/motivation-s&quot;&gt;Motivation(s) chez Vincent&amp;nbsp;Valentin.&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Très chouettes publications cette dernière semaine en tout cas&amp;nbsp;&amp;lt;3.&lt;/p&gt;
+&lt;hr /&gt;
+&lt;p&gt;Rétropédalage sur &lt;a href=&quot;https://larlet.fr/david/2024/03/12/&quot;&gt;le surlignage&lt;/a&gt;. 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 &lt;em&gt;opt-in&lt;/em&gt; à un&amp;nbsp;moment.&lt;/p&gt;
+&lt;hr /&gt;
+
+&lt;blockquote&gt;
+&lt;p&gt;Puisque la demi-mesure ne fait pas partie de mon vocabulaire, j’ai tenu à travailler au plus proche des techniques médiévales. &lt;mark&gt;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.&lt;/mark&gt; 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&amp;nbsp;nuit.&lt;/p&gt;
+&lt;p&gt;Au total j’ai passé plus de 230&amp;nbsp;heures sur ce&amp;nbsp;projet&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://www.hypothermia.fr/2024/03/chiroto-t-datoca/&quot;&gt;Chiroto T. Datoca&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Ce moment où tu te rends compte que tu n’es pas perfectionniste en fait 🤯. Chapeau bas&amp;nbsp;l’artiste.&lt;/p&gt;
+&lt;hr /&gt;
+
+&lt;blockquote lang=&quot;en&quot;&gt;
+&lt;p&gt;Rust-like error handling in Python, with type-safety in&amp;nbsp;mind.&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://github.com/alexandermalyga/poltergeist&quot;&gt;poltergeist&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;J’ai très souvent retrouvé le besoin de ce &lt;em&gt;pattern&lt;/em&gt; dans mes&amp;nbsp;projets.&lt;/p&gt;
+&lt;hr /&gt;
+&lt;p&gt;Sortie de la &lt;a href=&quot;https://pypi.org/project/pressoir-cli/2.0.0/&quot;&gt;version 2.0&amp;nbsp;de pressoir-cli&lt;/a&gt; (oui, &lt;a href=&quot;https://larlet.fr/david/2024/02/16/&quot;&gt;c’est ma période&lt;/a&gt;). L’une des prochaines étapes sera de générer sa propre documentation en l’utilisant. Ça peut paraitre stupide mais c’est trop &lt;em&gt;meta&lt;/em&gt; pour ne pas le&amp;nbsp;faire&amp;nbsp;😇.&lt;/p&gt;
+&lt;hr /&gt;
+
+&lt;blockquote&gt;
+&lt;p&gt;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&amp;nbsp;puissante&amp;#8239;!&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://buzut.net/optimiser-nginx/&quot;&gt;Optimisez Nginx pour de meilleurs&amp;nbsp;performances&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Pour lecture&amp;nbsp;ultérieure.&lt;/p&gt;
+&lt;hr /&gt;
+
+&lt;blockquote&gt;
+&lt;p&gt;&lt;code&gt;font-size: calc(1rem + 0.25vw);&lt;/code&gt;&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/&quot;&gt;A formula for responsive&amp;nbsp;font-size&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Moins poussé que le &lt;a href=&quot;https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&amp;amp;s=0.75%7C0.5%7C0.25,1.5%7C2%7C3%7C4%7C6,s-l&amp;amp;g=s,l,xl,12&quot;&gt;Fluid type scale calculator&lt;/a&gt; mais dans un contexte plus minimaliste / simple ça fait déjà le&amp;nbsp;taf.&lt;/p&gt;
+&lt;hr /&gt;
+
+&lt;blockquote lang=&quot;en&quot;&gt;
+&lt;p&gt;To enable such progress, &lt;strong&gt;the Web Consortium too has evolved, always taking a people-first approach:&lt;/strong&gt; the Web must continue to serve humanity. The first such inflection point was the creation of the patent policy in 2003&amp;nbsp;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&amp;nbsp;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 &lt;mark&gt;re-launching the Consortium in 2023&amp;nbsp;as a public-interest non-profit organization&lt;/mark&gt; to work for the good of the&amp;nbsp;public.&lt;/p&gt;
+&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://www.w3.org/blog/2024/from-a-humble-beginning-35-years-ago-the-web-is-now-central-to-the-daily-lives-of-billions/&quot;&gt;From a humble beginning 35&amp;nbsp;years ago, the Web is now central to the daily lives of&amp;nbsp;billions&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;35&amp;nbsp;ans de liens. Merci Tim &lt;em&gt;et al.&lt;/em&gt; d’avoir permis&amp;nbsp;cela.&lt;/p&gt;
+&lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/liens/&quot;&gt;#liens&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/partage/&quot;&gt;#partage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/web/&quot;&gt;#web&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
+        </entry>
+    
         <entry xml:lang="fr">
             <title type="html">Surligner</title>
             <link href="https://larlet.fr/david/2024/03/12/" rel="alternate" type="text/html" />
@@ -30,6 +119,7 @@
 &lt;p&gt;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 &lt;a href=&quot;https://larlet.fr/david/2024/03/09/#hr-106&quot;&gt;vers un peu plus de fantaisie&lt;/a&gt;.&lt;/p&gt;
 &lt;p&gt;N’hésitez pas à me faire des&amp;nbsp;retours.&lt;/p&gt;
 &lt;p&gt;&lt;mark&gt;Plus tard dans la journée&lt;/mark&gt;, Nicolas Hoizey m’indique qu’il sera possible d’avoir un &lt;a href=&quot;https://frontendmasters.com/blog/highlight-text-when-a-user-scrolls-down-to-that-piece-of-text/&quot;&gt;comportement approchant en CSS&lt;/a&gt; &lt;a href=&quot;https://caniuse.com/mdn-css_properties_animation-range&quot;&gt;prochainement&lt;/a&gt;.&lt;/p&gt;
+&lt;p&gt;&lt;mark&gt;Le lendemain&lt;/mark&gt;, &lt;a href=&quot;https://larlet.fr/david/2024/03/13/#hr-114&quot;&gt;j’ai désactivé l’animation&lt;/a&gt; suite à plusieurs retours de&amp;nbsp;lecteur·ices.&lt;/p&gt;
 &lt;hr /&gt;
 
 &lt;blockquote&gt;
@@ -310,7 +400,7 @@ Lovée dans mes&amp;nbsp;bras&lt;/p&gt;
         </entry>
     
         <entry xml:lang="fr">
-            <title type="html">Jour&amp;nbsp;2</title>
+            <title type="html">Jour 2</title>
             <link href="https://larlet.fr/david/2024/03/05/" rel="alternate" type="text/html" />
             <updated>2024-03-05T12:00:00+01:00</updated>
             <id>https://larlet.fr/david/2024/03/05/</id>
@@ -352,7 +442,7 @@ Lovée dans mes&amp;nbsp;bras&lt;/p&gt;
         </entry>
     
         <entry xml:lang="fr">
-            <title type="html">Jour&amp;nbsp;1</title>
+            <title type="html">Jour 1</title>
             <link href="https://larlet.fr/david/2024/03/04/" rel="alternate" type="text/html" />
             <updated>2024-03-04T12:00:00+01:00</updated>
             <id>https://larlet.fr/david/2024/03/04/</id>
@@ -625,7 +715,7 @@ Et je sais enfin qui je&amp;nbsp;suis…&lt;/p&gt;
         </entry>
     
         <entry xml:lang="fr">
-            <title type="html">Jour&amp;nbsp;2</title>
+            <title type="html">Jour 2</title>
             <link href="https://larlet.fr/david/2024/02/25/" rel="alternate" type="text/html" />
             <updated>2024-02-25T12:00:00+01:00</updated>
             <id>https://larlet.fr/david/2024/02/25/</id>
@@ -682,7 +772,7 @@ Et je sais enfin qui je&amp;nbsp;suis…&lt;/p&gt;
         </entry>
     
         <entry xml:lang="fr">
-            <title type="html">Jour&amp;nbsp;1</title>
+            <title type="html">Jour 1</title>
             <link href="https://larlet.fr/david/2024/02/24/" rel="alternate" type="text/html" />
             <updated>2024-02-24T12:00:00+01:00</updated>
             <id>https://larlet.fr/david/2024/02/24/</id>
@@ -978,7 +1068,7 @@ button.primary {
         </entry>
     
         <entry xml:lang="fr">
-            <title type="html">uMap&amp;nbsp;2</title>
+            <title type="html">uMap 2</title>
             <link href="https://larlet.fr/david/2024/02/16/" rel="alternate" type="text/html" />
             <updated>2024-02-16T12:00:00+01:00</updated>
             <id>https://larlet.fr/david/2024/02/16/</id>
@@ -1132,96 +1222,4 @@ button.primary {
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/apprentissage/&quot;&gt;#apprentissage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/processus/&quot;&gt;#processus&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/protopie/&quot;&gt;#protopie&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
         </entry>
     
-        <entry xml:lang="fr">
-            <title type="html">Renards</title>
-            <link href="https://larlet.fr/david/2024/02/12/" rel="alternate" type="text/html" />
-            <updated>2024-02-12T12:00:00+01:00</updated>
-            <id>https://larlet.fr/david/2024/02/12/</id>
-            <summary type="html">
-&lt;p&gt;Entre chien et loup, le renard pointe le bout de son nez pointu. Après avoir attendu patiemment attendu que mon appareil photo arrive à ses limites, le voilà avançant vers moi d’un pas&amp;nbsp;décidé.&lt;/p&gt;
-&lt;figure&gt;
-    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-1.jpg&quot;
-        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
-        &lt;img
-            src=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-1.jpg&quot;
-            width=&quot;3456&quot; height=&quot;2304&quot;
-            srcset=&quot;/static/david/2024/2024-02-12-renards-1.jpg 3456w, /static/david/2024/2024-02-12-renards-1_660x440.jpg 660w, /static/david/2024/2024-02-12-renards-1_990x660.jpg 990w, /static/david/2024/2024-02-12-renards-1_1320x880.jpg 1320w&quot;
-            sizes=&quot;min(100vw, calc(100vh * 3456 / 2304))&quot;
-            loading=&quot;lazy&quot;
-            decoding=&quot;async&quot;
-            alt=&quot;Un renard trottinant sur la rivière gelée.&quot;&gt;
-    &lt;/a&gt;
-    &lt;figcaption&gt;Un renard trottinant sur la rivière&amp;nbsp;gelée.&lt;/figcaption&gt;
-&lt;/figure&gt;
-&lt;p&gt;Même en poussant les réglages au maximum lors du développement, je me rends bien compte que je suis dans la nuit bientôt noire. Alors je tente d’utiliser l’éclairage de la ville, la pollution lumineuse se reflétant sur la neige m’offre de précieux &lt;em&gt;stops&lt;/em&gt;&amp;nbsp;photographiques.&lt;/p&gt;
-&lt;figure&gt;
-    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-2.jpg&quot;
-        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
-        &lt;img
-            src=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-2.jpg&quot;
-            width=&quot;2560&quot; height=&quot;3840&quot;
-            srcset=&quot;/static/david/2024/2024-02-12-renards-2.jpg 2560w, /static/david/2024/2024-02-12-renards-2_660x440.jpg 660w, /static/david/2024/2024-02-12-renards-2_990x660.jpg 990w, /static/david/2024/2024-02-12-renards-2_1320x880.jpg 1320w&quot;
-            sizes=&quot;min(100vw, calc(100vh * 2560 / 3840))&quot;
-            loading=&quot;lazy&quot;
-            decoding=&quot;async&quot;
-            alt=&quot;Un renard sur la rivière gelée avec un pont en fond.&quot;&gt;
-    &lt;/a&gt;
-    &lt;figcaption&gt;Un renard sur la rivière gelée avec un pont en&amp;nbsp;fond.&lt;/figcaption&gt;
-&lt;/figure&gt;
-&lt;p&gt;L’équivalent 800mm que je tiens à bout de bras n’aide pas à faire baisser les ISO, tant pis, je compte trop sur ma mobilité pour être capable de tenter une approche. La neige est bien trop gelée et bruyante pour que j’ai la moindre chance. Un skieur nocturne détourne leur&amp;nbsp;attention.&lt;/p&gt;
-&lt;figure&gt;
-    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-3.jpg&quot;
-        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
-        &lt;img
-            src=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-3.jpg&quot;
-            width=&quot;3840&quot; height=&quot;2560&quot;
-            srcset=&quot;/static/david/2024/2024-02-12-renards-3.jpg 3840w, /static/david/2024/2024-02-12-renards-3_660x440.jpg 660w, /static/david/2024/2024-02-12-renards-3_990x660.jpg 990w, /static/david/2024/2024-02-12-renards-3_1320x880.jpg 1320w&quot;
-            sizes=&quot;min(100vw, calc(100vh * 3840 / 2560))&quot;
-            loading=&quot;lazy&quot;
-            decoding=&quot;async&quot;
-            alt=&quot;Deux renards&amp;nbsp;: l’un sur la rivière, l’autre sur un ponton abandonné.&quot;&gt;
-    &lt;/a&gt;
-    &lt;figcaption&gt;Deux renards : l’un sur la rivière, l’autre sur un ponton&amp;nbsp;abandonné.&lt;/figcaption&gt;
-&lt;/figure&gt;
-&lt;p&gt;La luminosité est telle que je vois la lumière de mon autofocus qui se reflète, bien rouge, au fond de ses yeux à une cinquantaine de mètres. Iel m’attend. Je ne saurais jamais jusqu’à quelle distance est-ce que l’on se seraient acceptés car une coureuse met fin à ce tête-à-tête nocturne. Si nous sommes tous le deux routiniers, nous aurons certainement d’autres occasions de nous&amp;nbsp;croiser.&lt;/p&gt;
-&lt;figure&gt;
-    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-4.jpg&quot;
-        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
-        &lt;img
-            src=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-4.jpg&quot;
-            width=&quot;3840&quot; height=&quot;2560&quot;
-            srcset=&quot;/static/david/2024/2024-02-12-renards-4.jpg 3840w, /static/david/2024/2024-02-12-renards-4_660x440.jpg 660w, /static/david/2024/2024-02-12-renards-4_990x660.jpg 990w, /static/david/2024/2024-02-12-renards-4_1320x880.jpg 1320w&quot;
-            sizes=&quot;min(100vw, calc(100vh * 3840 / 2560))&quot;
-            loading=&quot;lazy&quot;
-            decoding=&quot;async&quot;
-            alt=&quot;Un renard qui me regarde depuis le chemin.&quot;&gt;
-    &lt;/a&gt;
-    &lt;figcaption&gt;Un renard qui me regarde depuis le&amp;nbsp;chemin.&lt;/figcaption&gt;
-&lt;/figure&gt;
-&lt;p&gt;Photographiquement parlant, je crois que je préfère la prise floue de la veille. Une forme d’acceptation qu’il puisse encore y avoir des animaux libres d’une capture trop&amp;nbsp;nette.&lt;/p&gt;
-&lt;figure&gt;
-    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-5.jpg&quot;
-        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
-        &lt;img
-            src=&quot;https://larlet.fr/static/david/2024/2024-02-12-renards-5.jpg&quot;
-            width=&quot;3840&quot; height=&quot;2560&quot;
-            srcset=&quot;/static/david/2024/2024-02-12-renards-5.jpg 3840w, /static/david/2024/2024-02-12-renards-5_660x440.jpg 660w, /static/david/2024/2024-02-12-renards-5_990x660.jpg 990w, /static/david/2024/2024-02-12-renards-5_1320x880.jpg 1320w&quot;
-            sizes=&quot;min(100vw, calc(100vh * 3840 / 2560))&quot;
-            loading=&quot;lazy&quot;
-            decoding=&quot;async&quot;
-            alt=&quot;Un renard flou qui se reflète dans l’eau de la rivière qui fond.&quot;&gt;
-    &lt;/a&gt;
-    &lt;figcaption&gt;Vais-je passer à travers ? Je ne suis pas le seul à me poser ces&amp;nbsp;questions…&lt;/figcaption&gt;
-&lt;/figure&gt;
-&lt;p&gt;Merci au parent devant l’école qui m’a dit qu’il n’y avait pas de renards dans le parc cette année. Mon esprit de con·tradiction a fait le&amp;nbsp;reste.&lt;/p&gt;
-&lt;hr /&gt;
-
-&lt;blockquote&gt;
-&lt;p&gt;Les carnets Web servent également à faire rêver les autres de façon inattendue et la plupart du temps silencieusement. N’hésitez pas à publier. Vous toucherez le cœur et l’imagination d’une personne quelque part dans le&amp;nbsp;monde.&lt;/p&gt;
-&lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://www.la-grange.net/2024/02/04/enfant&quot;&gt;D’un enfant à&amp;nbsp;l’autre&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
-&lt;/blockquote&gt;
-&lt;p&gt;🧡&lt;/p&gt;
-&lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/apprentissage/&quot;&gt;#apprentissage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/echanges/&quot;&gt;#échanges&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/photographie/&quot;&gt;#photographie&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
-        </entry>
-    
 </feed>

david/templates/article_2024.html

@@ -118,12 +118,14 @@
       for (const entry of entries) {
         if (entry.intersectionRatio === 0) continue
         const markElement = entry.target
+        markElement.style.backgroundColor = 'inherit'
         const annotation = annotate(
           markElement, {
             type: 'highlight',
             multiline: true,
             color: markBackground,
-            animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+            animate: false
           }
         )
         annotation.show()
@@ -132,7 +134,6 @@
     }, {threshold: 1.0})
 
     for (const markElement of document.querySelectorAll('mark')) {
-      markElement.style.backgroundColor = 'inherit'
       markObserver.observe(markElement)
     }
   </script>

site.py

@@ -411,11 +411,16 @@ class Page:
         md = markdown_with_anchors if with_anchors else markdown_with_img_sizes
         for file_path in sorted(each_file_from(source, pattern="*.md")):
             result, state = md.read(file_path)
-            result = widont(result, html=True)
             # Extract (and remove) the title from the generated page.
             title, content = result.split("</h1>", 1)
             h1_opening_size = len("<h1>")
             title = title[h1_opening_size:]
+            extra_file = file_path.with_suffix(".html")
+            content = widont(content, html=True)
+            if extra_file.exists():
+                content = content.replace(
+                    "<p>{{ extra&nbsp;}}</p>", extra_file.read_text()
+                )
             tags = {}
             if "<nav><p>" in content:
                 # Extract the tags from the generated page.