2 months ago · b3878affc0
--- a/david/2024/02/06/index.html
+++ b/david/2024/02/06/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/02/07/"
            title="Publication suivante : Écureuil">Suivant →</a>
      
    </p>
  </nav>
  
@@ -246,6 +250,10 @@
      
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
      
        • <a rel="next"
            href="/david/2024/02/07/"
            title="Publication suivante : Écureuil">Suivant →</a>
      
    </p>
  </nav>

--- a/david/2024/02/07/index.html
+++ b/david/2024/02/07/index.html
@@ -0,0 +1,385 @@
 <!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>
    Écureuil
  — David Larlet</title>
  <meta name="description" content="De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà reparti.">
  <!-- 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">
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.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>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  
 <style type="text/css">
  .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>Écureuil</h1>
      <p>Le <time datetime="2024-02-07">7 février 2024</time></p>
    </hgroup>
  </header>
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/02/06/"
           title="Publication précédente : Anneau">← 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>
  
 <p>De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà&nbsp;reparti.</p>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
            width="3456" height="2304"
            srcset="/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3456 / 2304))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil endormi sur une branche.">
    </a>
    <figcaption>Un écureuil endormi sur une&nbsp;branche.</figcaption>
 </figure>
 <a href="#hr-69" title="Lien vers cette section de la page"><hr id="hr-69" /></a>
 <p>Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une <em>seconde</em> fois à la&nbsp;banque.</p>
 <p>C’est stupide. Mais ça motive. Mais c’est&nbsp;stupide.</p>
 <a href="#hr-70" title="Lien vers cette section de la page"><hr id="hr-70" /></a>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
            width="3840" height="2560"
            srcset="/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3840 / 2560))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil en posture de super-héros·ïne.">
    </a>
    <figcaption>Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux&nbsp;pattes.)</figcaption>
 </figure>

  
    <nav>
      <p>
        
          <a href="/david/2024/decision/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#décision</a>
        
          <a href="/david/2024/foret/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#forêt</a>
        
          <a href="/david/2024/photographie/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#photographie</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/02/06/"
           title="Publication précédente : Anneau">← 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>

  </body>
 </html>
--- a/david/2024/_sources/2024-02-07
+++ b/david/2024/_sources/2024-02-07
@@ -0,0 +1,17 @@
 # Écureuil

 De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà reparti.

 ![Un écureuil endormi sur une branche.](/static/david/2024/2024-02-05-ecureuil-soleil.jpg "Un écureuil endormi sur une branche.")

 ---

 Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une *seconde* fois à la banque.

 C’est stupide. Mais ça motive. Mais c’est stupide.

 ---

 ![Un écureuil en posture de super-héros·ïne.](/static/david/2024/2024-02-05-ecureuil-superhero.jpg "Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux pattes.)")

 #décision #forêt #photographie
--- a/david/2024/decision/index.html
+++ b/david/2024/decision/index.html
@@ -134,6 +134,65 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/02/07/" title="Lien permanent vers cet article">Écureuil</a> <time datetime="2024-02-07">7 février 2024</time>
    </h2>
    
 <p>De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà&nbsp;reparti.</p>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
            width="3456" height="2304"
            srcset="/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3456 / 2304))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil endormi sur une branche.">
    </a>
    <figcaption>Un écureuil endormi sur une&nbsp;branche.</figcaption>
 </figure>
 <a href="#hr-69" title="Lien vers cette section de la page"><hr id="hr-69" /></a>
 <p>Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une <em>seconde</em> fois à la&nbsp;banque.</p>
 <p>C’est stupide. Mais ça motive. Mais c’est&nbsp;stupide.</p>
 <a href="#hr-70" title="Lien vers cette section de la page"><hr id="hr-70" /></a>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
            width="3840" height="2560"
            srcset="/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3840 / 2560))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil en posture de super-héros·ïne.">
    </a>
    <figcaption>Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux&nbsp;pattes.)</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/decision/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#décision</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/photographie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#photographie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/01/18/" title="Lien permanent vers cet article">Open-source</a> <time datetime="2024-01-18">18 janvier 2024</time>
    </h2>
--- a/david/2024/foret/index.html
+++ b/david/2024/foret/index.html
@@ -134,6 +134,65 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/02/07/" title="Lien permanent vers cet article">Écureuil</a> <time datetime="2024-02-07">7 février 2024</time>
    </h2>
    
 <p>De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà&nbsp;reparti.</p>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
            width="3456" height="2304"
            srcset="/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3456 / 2304))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil endormi sur une branche.">
    </a>
    <figcaption>Un écureuil endormi sur une&nbsp;branche.</figcaption>
 </figure>
 <a href="#hr-69" title="Lien vers cette section de la page"><hr id="hr-69" /></a>
 <p>Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une <em>seconde</em> fois à la&nbsp;banque.</p>
 <p>C’est stupide. Mais ça motive. Mais c’est&nbsp;stupide.</p>
 <a href="#hr-70" title="Lien vers cette section de la page"><hr id="hr-70" /></a>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
            width="3840" height="2560"
            srcset="/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3840 / 2560))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil en posture de super-héros·ïne.">
    </a>
    <figcaption>Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux&nbsp;pattes.)</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/decision/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#décision</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/photographie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#photographie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <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>
    </h2>
--- a/david/2024/index.html
+++ b/david/2024/index.html
@@ -170,7 +170,8 @@
      <a href="/david/2024/02/03/">Archives</a>, 
      <a href="/david/2024/02/04/">Tooltipopover</a>, 
      <a href="/david/2024/02/05/">Jeu</a>, 
      <a href="/david/2024/02/06/">Anneau</a>.
      <a href="/david/2024/02/06/">Anneau</a>, 
      <a href="/david/2024/02/07/">Écureuil</a>.
      
    </p>
  
@@ -183,7 +184,7 @@
      <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (7)</a>, 
      <a href="/david/2024/commun/" rel="tag">#commun (3)</a>, 
      <a href="/david/2024/communaute/" rel="tag">#communauté (4)</a>, 
      <a href="/david/2024/decision/" rel="tag">#décision (2)</a>, 
      <a href="/david/2024/decision/" rel="tag">#décision (3)</a>, 
      <a href="/david/2024/dependance/" rel="tag">#dépendance (2)</a>, 
      <a href="/david/2024/documentation/" rel="tag">#documentation (1)</a>, 
      <a href="/david/2024/dystopie/" rel="tag">#dystopie (1)</a>, 
@@ -193,7 +194,7 @@
      <a href="/david/2024/evolution/" rel="tag">#évolution (5)</a>, 
      <a href="/david/2024/experience/" rel="tag">#expérience (9)</a>, 
      <a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>, 
      <a href="/david/2024/foret/" rel="tag">#forêt (3)</a>, 
      <a href="/david/2024/foret/" rel="tag">#forêt (4)</a>, 
      <a href="/david/2024/gratitude/" rel="tag">#gratitude (2)</a>, 
      <a href="/david/2024/ia/" rel="tag">#IA (2)</a>, 
      <a href="/david/2024/lecture/" rel="tag">#lecture (1)</a>, 
@@ -201,6 +202,7 @@
      <a href="/david/2024/parentalite/" rel="tag">#parentalité (3)</a>, 
      <a href="/david/2024/partage/" rel="tag">#partage (2)</a>, 
      <a href="/david/2024/parvenir/" rel="tag">#parvenir (1)</a>, 
      <a href="/david/2024/photographie/" rel="tag">#photographie (1)</a>, 
      <a href="/david/2024/processus/" rel="tag">#processus (7)</a>, 
      <a href="/david/2024/protopie/" rel="tag">#protopie (4)</a>, 
      <a href="/david/2024/psychologie/" rel="tag">#psychologie (3)</a>, 
--- a/david/2024/photographie/index.html
+++ b/david/2024/photographie/index.html
@@ -0,0 +1,334 @@
 <!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 #photographie
  — David Larlet</title>
  <meta name="description" content="Publications relatives au tag #photographie">
  <!-- 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">
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.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>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  
  <style type="text/css">
    details[open] summary {
      display: none;
    }
  </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>#photographie</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/02/07/" title="Lien permanent vers cet article">Écureuil</a> <time datetime="2024-02-07">7 février 2024</time>
    </h2>
    
 <p>De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà&nbsp;reparti.</p>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-soleil.jpg"
            width="3456" height="2304"
            srcset="/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3456 / 2304))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil endormi sur une branche.">
    </a>
    <figcaption>Un écureuil endormi sur une&nbsp;branche.</figcaption>
 </figure>
 <a href="#hr-69" title="Lien vers cette section de la page"><hr id="hr-69" /></a>
 <p>Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une <em>seconde</em> fois à la&nbsp;banque.</p>
 <p>C’est stupide. Mais ça motive. Mais c’est&nbsp;stupide.</p>
 <a href="#hr-70" title="Lien vers cette section de la page"><hr id="hr-70" /></a>
 <figure>
    <a href="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-02-05-ecureuil-superhero.jpg"
            width="3840" height="2560"
            srcset="/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3840 / 2560))"
            loading="lazy"
            decoding="async"
            alt="Un écureuil en posture de super-héros·ïne.">
    </a>
    <figcaption>Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux&nbsp;pattes.)</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/decision/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#décision</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/photographie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#photographie</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>
--- a/david/blogroll/index.html
+++ b/david/blogroll/index.html
@@ -176,24 +176,34 @@
    <h2>Leurs dernières publications</h2>
    <dl>
        <dt>
          <a href="https://winnielim.org/journal/the-uncomfortable-phase-of-learning/">the uncomfortable phase of learning</a>,
          04-02-2024
          <a href="https://www.arthurperret.fr/veille/2024-02-07-llm-recherche-info-scientifique-valeur-ajoutee-incertaine.html">[Veille] LLM et recherche d’information scientifique : une valeur ajoutée encore incertaine</a>,
          07-02-2024
        </dt>
        <dd>
          I have begun strength training for the first time in october last year. I had three personal training sessions before I traveled to japan, and when I got back there was a...
          — <a href="https://winnielim.org/">Winnie Lim (en)</a>
          http://musingsaboutlibrarianship.blogspot.com/2024/01/things-i-am-still-wondering-about.html Aaron Tay évoque l’usage de grands modèles de langue (la fameuse « intelligence artificielle générative ») pour augmenter les moteurs de recherche scientifique : c’est la Retrieval Augmented Generation (RAG), ou recherche sémantique (semantic search). Pour l’instant, sur le plan technique le processus…
          — <a href="https://www.arthurperret.fr/">Arthur Perret</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://www.arthurperret.fr/blog/2024-02-03-cosma-at-fosdem-24.html">[Blog] Cosma at FOSDEM 24</a>,
          03-02-2024
          <a href="https://www.arthurperret.fr/veille/2024-02-07-signes-marquage-le-cas-des-revisions.html">[Veille] Signes et marquage en édition : le cas des révisions</a>,
          07-02-2024
        </dt>
        <dd>
          Cosma came as part of HyperOtlet, a research programme on Paul Otlet. I’m glad to mention him at FOSDEM 24 in Brussels because he was born here. He was a figure of Belgian intellectual life, a pioneer of knowledge organization, a precursor of information science. He’s the one who popularized the words document and documentation. Otlet’s main idea was to go beyond the book: to extract facts from…
          http://blog.sens-public.org/marcellovitalirosati/revision.html Dans ce billet, Marcello Vitali-Rosati explique comment fonctionnaient les révisions (corrections, rectificatifs…) à l’époque pré-numérique, et surtout comment les logiciels de bureautique ont nivelé par le bas les savoir-faire liés à cette phase essentielle du travail éditorial. En le lisant, j’ai tout de suite pensé à deux de mes…
          — <a href="https://www.arthurperret.fr/">Arthur Perret</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://winnielim.org/journal/the-uncomfortable-phase-of-learning/">the uncomfortable phase of learning</a>,
          04-02-2024
        </dt>
        <dd>
          I have begun strength training for the first time in october last year. I had three personal training sessions before I traveled to japan, and when I got back there was a...
          — <a href="https://winnielim.org/">Winnie Lim (en)</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://winnielim.org/notes/interview-with-people-blogs/">interview with “people & blogs”</a>,
@@ -314,16 +324,6 @@
          — <a href="https://brr.fyi/">brr (en)</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://www.arthurperret.fr/veille/2024-01-13-publication-et-independance.html">[Veille] Publication et indépendance</a>,
          13-01-2024
        </dt>
        <dd>
          https://www.youtube.com/watch?v=TR_pK009VR4 « Édition moisie non merci fini » : François Bon dénonce les pratiques de certains éditeurs scientifiques, qui proposent aux auteurs de signer des contrats avec des clauses illégales (cession de tous les droits y compris dans les dispositions prévues par des lois futures !), voire ridicules (« contrepartie » : envois de « tirés à part numériques » en x…
          — <a href="https://www.arthurperret.fr/">Arthur Perret</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://emmaclit.com/2024/01/06/darmaprout/">Darmaprout</a>,
--- a/david/index.html
+++ b/david/index.html
@@ -143,6 +143,7 @@
  <h2>Publications 2024</h2>
  <p>Liste des publications récentes en ordre anté-chronologique :</p>
  <p>
    <a href="/david/2024/02/07/">Écureuil</a>,
    <a href="/david/2024/02/06/">Anneau</a>,
    <a href="/david/2024/02/05/">Jeu</a>,
    <a href="/david/2024/02/04/">Tooltipopover</a>,
@@ -191,7 +192,7 @@
    <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (7)</a>,
    <a href="/david/2024/commun/" rel="tag">#commun (3)</a>,
    <a href="/david/2024/communaute/" rel="tag">#communauté (4)</a>,
    <a href="/david/2024/decision/" rel="tag">#décision (2)</a>,
    <a href="/david/2024/decision/" rel="tag">#décision (3)</a>,
    <a href="/david/2024/dependance/" rel="tag">#dépendance (2)</a>,
    <a href="/david/2024/documentation/" rel="tag">#documentation (1)</a>,
    <a href="/david/2024/dystopie/" rel="tag">#dystopie (1)</a>,
@@ -201,7 +202,7 @@
    <a href="/david/2024/evolution/" rel="tag">#évolution (5)</a>,
    <a href="/david/2024/experience/" rel="tag">#expérience (9)</a>,
    <a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>,
    <a href="/david/2024/foret/" rel="tag">#forêt (3)</a>,
    <a href="/david/2024/foret/" rel="tag">#forêt (4)</a>,
    <a href="/david/2024/gratitude/" rel="tag">#gratitude (2)</a>,
    <a href="/david/2024/ia/" rel="tag">#IA (2)</a>,
    <a href="/david/2024/lecture/" rel="tag">#lecture (1)</a>,
@@ -209,6 +210,7 @@
    <a href="/david/2024/parentalite/" rel="tag">#parentalité (3)</a>,
    <a href="/david/2024/partage/" rel="tag">#partage (2)</a>,
    <a href="/david/2024/parvenir/" rel="tag">#parvenir (1)</a>,
    <a href="/david/2024/photographie/" rel="tag">#photographie (1)</a>,
    <a href="/david/2024/processus/" rel="tag">#processus (7)</a>,
    <a href="/david/2024/protopie/" rel="tag">#protopie (4)</a>,
    <a href="/david/2024/psychologie/" rel="tag">#psychologie (3)</a>,
--- a/david/log/index.xml
+++ b/david/log/index.xml
@@ -6,13 +6,55 @@
    <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-02-06T12:00:00+01:00</updated>
    <updated>2024-02-09T12: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">Écureuil</title>
            <link href="https://larlet.fr/david/2024/02/07/" rel="alternate" type="text/html" />
            <updated>2024-02-07T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/02/07/</id>
            <summary type="html">
 &lt;p&gt;De bon matin, en me brossant les dents, l’écureuil dans un micro-sommeil après une nuit fraîche. Je le regarde avec un peu d’envie, je referme la fenêtre délicatement. Une minute plus tard, alors qu’il commençait à piquer dangereusement du nez, le voilà déjà&amp;nbsp;reparti.&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-05-ecureuil-soleil.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-05-ecureuil-soleil.jpg&quot;
            width=&quot;3456&quot; height=&quot;2304&quot;
            srcset=&quot;/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 3456 / 2304))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Un écureuil endormi sur une branche.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Un écureuil endormi sur une&amp;nbsp;branche.&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;hr /&gt;
 &lt;p&gt;Une motivation importante de l’année est de réussir à économiser. C’est une chose que je n’ai jamais vraiment envisagé de faire jusqu’à présent. Si j’ai bien compris le principe actuel, chaque dollar accumulé est un dollar que je n’aurai pas à payer une &lt;em&gt;seconde&lt;/em&gt; fois à la&amp;nbsp;banque.&lt;/p&gt;
 &lt;p&gt;C’est stupide. Mais ça motive. Mais c’est&amp;nbsp;stupide.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-02-05-ecureuil-superhero.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-05-ecureuil-superhero.jpg&quot;
            width=&quot;3840&quot; height=&quot;2560&quot;
            srcset=&quot;/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 3840 / 2560))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Un écureuil en posture de super-héros·ïne.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Un écureuil en posture de super-héros·ïne. (Iels a juste froid aux&amp;nbsp;pattes.)&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/decision/&quot;&gt;#décision&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/foret/&quot;&gt;#forêt&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>
    
        <entry xml:lang="fr">
            <title type="html">Anneau</title>
            <link href="https://larlet.fr/david/2024/02/06/" rel="alternate" type="text/html" />
@@ -1280,60 +1322,4 @@ quelqu’un nous&amp;nbsp;voit&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/accessibilite/&quot;&gt;#accessibilité&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/sport/&quot;&gt;#sport&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&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">Liens</title>
            <link href="https://larlet.fr/david/2024/01/08/" rel="alternate" type="text/html" />
            <updated>2024-01-08T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/01/08/</id>
            <summary type="html">
 &lt;p&gt;Je décide de tester d’ajouter le domaine du lien après la lien, j’ai souvent besoin de cette information avant de cliquer sur un lien. Pour cela je charge le domaine en Python grâce à la flexibilité de &lt;a href=&quot;https://mistune.lepture.com/en/latest/&quot;&gt;mistune&lt;/a&gt; et je m’en sers ensuite en CSS pour l’afficher&amp;nbsp;dynamiquement&amp;nbsp;:&lt;/p&gt;
 &lt;pre&gt;&lt;code&gt;a[data-link-domain]::after {
  content: &amp;quot; [&amp;quot; attr(data-link-domain) &amp;quot;]&amp;quot;;
  font-size: smaller;
  color: var(--link-color-domain);
 }
 &lt;/code&gt;&lt;/pre&gt;
 &lt;p&gt;Je fais aussi des tests de soulignement avec un gradient qui irait de la couleur du lien principal à celle du&amp;nbsp;domaine&amp;nbsp;:&lt;/p&gt;
 &lt;pre&gt;&lt;code&gt;a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: calc(var(--fluid-0) / 10);
  position: relative;
 }
 a::before {
  content: &#x27;&#x27;;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: -1px;
  height: calc(var(--fluid-0) / 10);
  background: linear-gradient(
    to right, 
    var(--link-color), 
    var(--link-color-domain)
  );
 }
 &lt;/code&gt;&lt;/pre&gt;
 &lt;p&gt;Mais au final je jette car je perds la partie &lt;code&gt;skip-ink&lt;/code&gt; que je trouve chouette comme évolution de rendu possible. Toujours cet équilibre complexité / expérience /&amp;nbsp;accessibilité.&lt;/p&gt;
 &lt;p&gt;Plus tard, je commence l’implémentation de l’archivage des liens distants. J’ai pas mal d’idées mais je sais qu’il ne faut pas que je prenne trop de retard dans la récupération sinon je ne vais pas avoir l’énergie pour reprendre l’historique. Ce sera probablement l’occasion de faire un autre &lt;em&gt;Web Component&lt;/em&gt; dédié. En suivant les recommandations &lt;a href=&quot;https://fedi.larlet.fr/@david/111703611010197838&quot;&gt;sur masto&lt;/a&gt;, je les nomme &lt;code&gt;archive&lt;/code&gt; pour le moment et je conserve la date de récupération de l’article car c’est une information importante. J’adapterai le style plus&amp;nbsp;tard.&lt;/p&gt;
 &lt;p&gt;Il faut que j’améliore cette automatisation car c’est assez fastidieux pour le moment, beaucoup de retouches manuelles pour obtenir un article lisible selon les sources. Je vais aussi réduire le nombre de liens que j’archive, les sources techniques ont probablement moins d’intérêt dans la&amp;nbsp;durée.&lt;/p&gt;
 &lt;p&gt;Chaque lien distant prend une longueur non négligeable suite à ces deux&amp;nbsp;ajouts&amp;nbsp;🤔.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote&gt;
 &lt;p&gt;Ce billet illustre la loi qui dit “Moins un blog est mis à jour, plus il y a de probabilité que ce qui y est publié a pour sujet les aspects techniques dudit&amp;nbsp;blog”.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://blog.professeurjoachim.com/billet/2024-01-05-ma-page-now-ou-plutot-en-ce-moment&quot;&gt;Ma page /now (ou plutôt&amp;nbsp;/en-ce-moment)&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;J’ai ri. Je n’ai jamais fait une telle page car je sais que je n’arriverais pas à la maintenir à jour. Je galère déjà avec mon &lt;a href=&quot;https://larlet.com/&quot;&gt;profil pro&lt;/a&gt;.&lt;/p&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;I also started noticing when people do this subconiously. For example, most software engineers I know hate blogging, but &lt;mark&gt;they like building their own blog engine to make blogging more pleasant&lt;/mark&gt; (I’m very guilty of this&amp;nbsp;too).&lt;/p&gt;
 &lt;p&gt;Kent Beck nailed it: “for each desired change, make the change easy (warning: this may be hard), then make the easy&amp;nbsp;change”.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://frantic.im/opening-mail/&quot;&gt;Opening&amp;nbsp;Mail&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Note&amp;nbsp;: cette année, je ne ferai aucun lien vers 𝕏 (twitter.com) depuis mes&amp;nbsp;articles.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;p&gt;L’hiver commence maintenant le 7&amp;nbsp;janvier à Montréal. Phénomène météorologique exceptionnel &lt;em&gt;et&lt;/em&gt; tendance&amp;nbsp;climatique.&lt;/p&gt;
 &lt;nav&gt;&lt;p&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/solastalgia/&quot;&gt;#solastalgia&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&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>
--- a/david/recherche/index.html
+++ b/david/recherche/index.html
@@ -276,6 +276,12 @@
    </template>
    
    <script id="search-index" type="application/json">[
  {
    "title": "\u00c9cureuil",
    "url": "/david/2024/02/07/",
    "date": "2024-02-07",
    "content": "De bon matin, en me brossant les dents, l\u2019\u00e9cureuil dans un micro-sommeil apr\u00e8s une nuit fra\u00eeche. Je le regarde avec un peu d\u2019envie, je referme la fen\u00eatre d\u00e9licatement. Une minute plus tard, alors qu\u2019il commen\u00e7ait \u00e0 piquer dangereusement du nez, le voil\u00e0 d\u00e9j\u00e0\u00a0reparti. <a href=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg\" width=\"3456\" height=\"2304\" srcset=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3456 / 2304))\" loading=\"lazy\" decoding=\"async\" alt=\"Un \u00e9cureuil endormi sur une branche.\"> Un \u00e9cureuil endormi sur une\u00a0branche. Une motivation importante de l\u2019ann\u00e9e est de r\u00e9ussir \u00e0 \u00e9conomiser. C\u2019est une chose que je n\u2019ai jamais vraiment envisag\u00e9 de faire jusqu\u2019\u00e0 pr\u00e9sent. Si j\u2019ai bien compris le principe actuel, chaque dollar accumul\u00e9 est un dollar que je n\u2019aurai pas \u00e0 payer une seconde fois \u00e0 la\u00a0banque. C\u2019est stupide. Mais \u00e7a motive. Mais c\u2019est\u00a0stupide. <a href=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg\" width=\"3840\" height=\"2560\" srcset=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3840 / 2560))\" loading=\"lazy\" decoding=\"async\" alt=\"Un \u00e9cureuil en posture de super-h\u00e9ros\u00b7\u00efne.\"> Un \u00e9cureuil en posture de super-h\u00e9ros\u00b7\u00efne. (Iels a juste froid aux\u00a0pattes.)"
  },
  {
    "title": "Anneau",
    "url": "/david/2024/02/06/",
@@ -498,6 +504,12 @@
    "date": "2024-01-01",
    "content": "33\u202f% de 44\u00a0millions de consommateurs vont faire le Dry January 22\u202f% des consommateurs ont une conso excessive, c\u2019est-\u00e0-dire 10\u00a0verres/semaine max et plus de deux\u00a0verres/jour. Les seniors sont aussi tr\u00e8s touch\u00e9\u00b7es. L\u2019alcool est une drogue.. On peut faire la f\u00eate sans alcool et\u00a0s\u2019\u00e9clater. Quand on arr\u00eate\u00a0: bienfaits sur le foie, la peau, le coeur, etc\u2026 Pb\u00a0: m\u00e9moire, troubles cognitifs, responsable de cancer, pb sommeil, d\u00e9compensation de maladie psy,\u2026 41000\u00a0d\u00e9c\u00e8s par an en\u00a0France. Les cinq sympt\u00f4mes d\u00e9finissent un probl\u00e8me de\u00a0d\u00e9pendance\u00a0: Perte de\u00a0contr\u00f4le Usage\u00a0compulsif Envie\u00a0r\u00e9pressive Usage\u00a0chronique Cons\u00e9quences psychiques, physiques, sociales,\u2026 Bon Dry J. pour celleux qui le font\u202f! Moi j\u2019en\u00a0suis\u202f! @Air@framapiaf.org Dans mon entourage, de plus en plus de personnes que j\u2019estime ne boivent pas d\u2019alcool, de plus en plus de personnes qui vieillissent en deviennent d\u00e9pendantes. Je suis davantage attir\u00e9 par la premi\u00e8re option\u2026 et pas pour un seul\u00a0mois. Je me sens pr\u00eat, on verra bien o\u00f9 cela me\u00a0m\u00e8ne. Grosse envie de reprendre la CSS par ici en ce d\u00e9but d\u2019ann\u00e9e. Avec le dilemme de faire chuter cette motivation si je publie d\u00e8s maintenant avec l\u2019ancienne (qui restera effective sur les anciens articles). Je vais essayer de me\u00a0retenir."
  },
  {
    "title": "\u00c9cureuil",
    "url": "/david/2024/02/07/",
    "date": "2024-02-07",
    "content": "De bon matin, en me brossant les dents, l\u2019\u00e9cureuil dans un micro-sommeil apr\u00e8s une nuit fra\u00eeche. Je le regarde avec un peu d\u2019envie, je referme la fen\u00eatre d\u00e9licatement. Une minute plus tard, alors qu\u2019il commen\u00e7ait \u00e0 piquer dangereusement du nez, le voil\u00e0 d\u00e9j\u00e0\u00a0reparti. <a href=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg\" width=\"3456\" height=\"2304\" srcset=\"/static/david/2024/2024-02-05-ecureuil-soleil.jpg 3456w, /static/david/2024/2024-02-05-ecureuil-soleil_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-soleil_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-soleil_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3456 / 2304))\" loading=\"lazy\" decoding=\"async\" alt=\"Un \u00e9cureuil endormi sur une branche.\"> Un \u00e9cureuil endormi sur une\u00a0branche. Une motivation importante de l\u2019ann\u00e9e est de r\u00e9ussir \u00e0 \u00e9conomiser. C\u2019est une chose que je n\u2019ai jamais vraiment envisag\u00e9 de faire jusqu\u2019\u00e0 pr\u00e9sent. Si j\u2019ai bien compris le principe actuel, chaque dollar accumul\u00e9 est un dollar que je n\u2019aurai pas \u00e0 payer une seconde fois \u00e0 la\u00a0banque. C\u2019est stupide. Mais \u00e7a motive. Mais c\u2019est\u00a0stupide. <a href=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg\" width=\"3840\" height=\"2560\" srcset=\"/static/david/2024/2024-02-05-ecureuil-superhero.jpg 3840w, /static/david/2024/2024-02-05-ecureuil-superhero_660x440.jpg 660w, /static/david/2024/2024-02-05-ecureuil-superhero_990x660.jpg 990w, /static/david/2024/2024-02-05-ecureuil-superhero_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3840 / 2560))\" loading=\"lazy\" decoding=\"async\" alt=\"Un \u00e9cureuil en posture de super-h\u00e9ros\u00b7\u00efne.\"> Un \u00e9cureuil en posture de super-h\u00e9ros\u00b7\u00efne. (Iels a juste froid aux\u00a0pattes.)"
  },
  {
    "title": "Anneau",
    "url": "/david/2024/02/06/",