davidbgk
/
larlet-fr-david

<!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>
  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,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
<!-- Required to make a valid HTML5 document. -->
<title>Agilité — David Larlet</title>
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/static/david/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="David Larlet">
<meta name="application-name" content="David Larlet">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- That good ol' feed, subscribe :p. -->
<link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://larlet.fr/david/stream/2019/01/18/">

<style>
/* http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* http://practicaltypography.com/equity.html */
/* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
/* https://www.filamentgroup.com/lab/js-web-fonts.html */
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ConcourseT3';
  src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
       url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


/* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
body {
  /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  font-family: "EquityTextB", Palatino, serif;
  background-color: #f0f0ea;
  color: #07486c;
  font-kerning: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
pre, code, kbd, samp, var, tt {
  font-family: 'TriplicateT4c', monospace;
}
em {
  font-style: italic;
  color: #323a45;
}
strong {
  font-weight: bold;
  color: black;
}
nav {
  background-color: #323a45;
  color: #f0f0ea;
  display: flex;
  justify-content: space-around;
  padding: 1rem .5rem;
}
  nav:last-child {
    border-bottom: 1vh solid #2d7474;
  }
  nav a {
    color: #f0f0ea;
  }
  nav abbr {
    border-bottom: 1px dotted white;
  }

h1 {
  border-top: 1vh solid #2d7474;
  border-bottom: .2vh dotted #2d7474;
  background-color: #e3e1e1;
  color: #323a45;
  text-align: center;
  padding: 5rem 0 4rem 0;
  width: 100%;
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
}
  h1.single {
    padding-bottom: 10rem;
  }
  h1 span {
    position: absolute;
    top: 1vh;
    left: 20%;
    line-height: 0;
  }
    h1 span a {
      line-height: 1.7;
      padding: 1rem 1.2rem .6rem 1.2rem;
      border-radius: 0 0 6% 6%;
      background: #2d7474;
      font-size: 1.3rem;
      color: white;
      text-decoration: none;
    }
h2 {
  margin: 4rem 0 1rem;
  border-top: .2vh solid #2d7474;
  padding-top: 1vh;
}
h3 {
  text-align: center;
  margin: 3rem 0 .75em;
}
hr {
  height: .4rem;
  width: .4rem;
  border-radius: .4rem;
  background: #07486c;
  margin: 2.5rem auto;
}
time {
  display: bloc;
  margin-left: 0 !important;
}
ul, ol {
  margin: 2rem;
}
ul {
  list-style-type: square;
}
a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.09em;
}
article {
  max-width: 50rem;
  display: flex;
  flex-direction: column;
  margin: 2rem auto;
}
  article.single {
    border-top: .2vh dotted #2d7474;
    margin: -6rem auto 1rem auto;
    background: #f0f0ea;
    padding: 2rem;
  }
  article p:last-child {
    margin-bottom: 1rem;
  }
p {
  padding: 0 .5rem;
  margin-left: 3rem;
}
  p + p,
  figure + p {
    margin-top: 2rem;
  }

blockquote {
  background-color: #e3e1e1;
  border-left: .5vw solid #2d7474;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  margin: 1.5rem;
}
  blockquote cite {
    font-style: italic;
  }
  blockquote p {
    margin-left: 0;
  }

figure {
  border-top: .2vh solid #2d7474;
  background-color: #e3e1e1;
  text-align: center;
  padding: 1.5rem 0;
  margin: 1rem 0 0;
  font-size: 1.5rem;
  width: 100%;
}
  figure img {
    max-width: 250px;
    max-height: 250px;
    border: .5vw solid #323a45;
    padding: 1px;
  }
figcaption {
  padding: 1rem;
  line-height: 1.4;
}
aside {
  display: flex;
  flex-direction: column;
  background-color: #e3e1e1;
  padding: 1rem 0;
  border-bottom: .2vh solid #07486c;
}
  aside p {
    max-width: 50rem;
    margin: 0 auto;
  }

/* https://fvsch.com/code/css-locks/ */
p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  font-size: 1rem;
  line-height: calc( 1.5em + 0.2 * 1rem );
}
h1 {
  font-size: 1.9rem;
  line-height: calc( 1.2em + 0.2 * 1rem );
}
h2 {
  font-size: 1.6rem;
  line-height: calc( 1.3em + 0.2 * 1rem );
}
h3 {
  font-size: 1.35rem;
  line-height: calc( 1.4em + 0.2 * 1rem );
}
@media (min-width: 20em) {
  /* The (100vw - 20rem) / (50 - 20) part
     resolves to 0-1rem, depending on the
     viewport width (between 20em and 50em). */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
    margin-left: 0;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
}
@media (min-width: 50em) {
  /* The right part of the addition *must* be a
     rem value. In this example we *could* change
     the whole declaration to font-size:2.5rem,
     but if our baseline value was not expressed
     in rem we would have to use calc. */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * 1rem );
    line-height: 1.5em;
  }
  p, li, pre, details {
    margin-left: 3rem;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * 1rem );
    line-height: 1.2em;
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * 1rem );
    line-height: 1.3em;
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * 1rem );
    line-height: 1.4em;
  }
  figure img {
    max-width: 500px;
    max-height: 500px;
  }
}

figure.unsquared {
  margin-bottom: 1.5rem;
}
  figure.unsquared img {
    height: inherit;
  }


@media print {
  body { font-size: 100%; }
  a:after { content: " (" attr(href) ")"; }
  a, a:link, a:visited, a:after {
    text-decoration: underline;
    text-shadow: none !important;
    background-image: none !important;
    background: white;
    color: black;
  }
  abbr[title] { border-bottom: 0; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  img { page-break-inside: avoid; }
  @page { margin: 2cm .5cm; }
  h1, h2, h3 { page-break-after: avoid; }
  p3 { orphans: 3; widows: 3; }
  img {
    max-width: 250px !important;
    max-height: 250px !important;
  }
  nav, aside { display: none; }
}

ul.with_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_columns {
    column-count: 2;
  }
}
@media (min-width: 50em) {
  ul.with_columns {
    column-count: 3;
  }
}
ul.with_two_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_two_columns {
    column-count: 1;
  }
}
@media (min-width: 50em) {
  ul.with_two_columns {
    column-count: 2;
  }
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
  .gallery figure img {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .gallery figure figcaption {
    font-family: 'ConcourseT3'
  }

footer {
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
  border-top: 3px solid white;
  padding: 4rem 0;
  background-color: #07486c;
  color: white;
}
  footer > * {
    max-width: 50rem;
    margin: 0 auto;
  }
  footer a {
    color: #f1c40f;
  }
  footer .avatar {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    float: left;
    -webkit-shape-outside: circle();
    shape-outside: circle();
    margin-right: 2rem;
    padding: 2px 5px 5px 2px;
    background: white;
    border-left: 1px solid #f1c40f;
    border-top: 1px solid #f1c40f;
    border-right: 5px solid #f1c40f;
    border-bottom: 5px solid #f1c40f;
  }
</style>

<h1 class="single">
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  Agilité
  <time>Publié le 18 janvier</time>
</h1>
<article class="single">
 <p><em>Cette semaine a débutée par deux journée dans les bois avec des températures qui n’ont pas dépassées les -18°C. C’était « frète » comme on dit par ici. Heureusement, j’ai passé une nuit dans un refuge que j’ai fait passer de -9°C à 32°C (!) en 3 heures grâce au poêle, le contraste était assez saisissant. Cela m’a permis d’avancer sur mon projet de couture avec un sprint de… 5 heures non-stop, vive l’hiver ! Aussi, j’ai vu le premier <strike>arc-en-ciel circulaire</strike><a href="https://fr.wikipedia.org/wiki/Halo_(ph%C3%A9nom%C3%A8ne_optique)">halo</a> de ma vie &lt;3</em></p>
<figure>
  <img src="/static/david/stream/couture.jpg" alt="Mon atelier de couture portable" loading="lazy" width="500" height="500" />
  <figcaption>
    Atelier de couture portable, ça manque un peu de lumière malgré le réflecteur/pare-vent du réchaud à bois.
  </figcaption>
</figure>

<p>C’était aussi l’occasion de réfléchir à l’agilité et à ce que ça voulait dire de promouvoir certaines pratiques dans l’objectif de <a href="/david/stream/2018/12/12/">me diversifier</a> (plus à venir là-dessus). J’en suis ressorti avec la définition suivante :</p>
<blockquote>
<p><strong>Agilité (n.f.) : prendre le temps de communiquer.</strong></p>
</blockquote>
<p>Tout est là, ce qui a pour conséquence possible de comprendre son équipe, d’avoir de l’empathie pour ses utilisateur·ice·s, de partager avec ses pair·e·s dans le but de proposer des trucs pertinents. La communication c’est l’inefficacité qui permet l’horizontalité.</p>
<p><em>Sans communication on a besoin de hiérarchie.</em></p>
<figure class="unsquared">
    <a href="/static/david/media/2019/20190111-canada-tronc-enneige.jpg">
      <img src="/static/david/media/2019/thumbnails/20190111-canada-tronc-enneige.jpg" alt="Tronc enneigé" />
    </a>
  <figcaption>
    Un développeur <em>full-stack</em> bien chargé.
  </figcaption>
</figure>

<p>Et en parlant de ce qui pousse sur les arbres :</p>
<blockquote>
<p>In other words, the ethical alternatives will not grow on trees. They must be funded. And given that they cannot and will not be funded by the same interests that created the problem to begin with (venture capital), we need alternative, ethical funding to create alternative, ethical infrastructure. The technological infrastructure of our societies must be funded from the commons, for the common good. And that requires political will and a system that’s not institutionally corrupt. Neither of which we have today.</p>
<p><cite><em><a href="https://ar.al/2018/12/07/baby-steps/">Baby steps</a></em> (<a href="/david/cache/242a36faf1d181fb8cafd0869e95e034/">cache</a>)</cite></p>
</blockquote>
<p>Aral Balkan essaye beaucoup de choses, à petits pas, et les partage sur <a href="https://ar.al/">son espace</a>. J’aime ça. Il y a une super cagnotte à laquelle on participe (presque) tous et qui nous permet (presque) tous d’en profiter aussi. Indice : ce n’est pas le loto. Quels outils (et données) pour rendre transparente son attribution ? Quels algorithmes politiques (pléonasme) pour influer sur cette répartition ?</p>
<blockquote>
<p>I wish there were a clever marketing name for no-cookies/no-JavaScript sites. It should be a trend.</p>
<p>While the industry is focused on SSL everywhere, we’re not looking at the other half of surveillance tech.</p>
<p><cite><em><a href="http://inessential.com/2019/01/14/netnewswire_privacy_policy">NetNewsWire Privacy Policy</a></em> (<a href="/david/cache/98fa0ca9f540e32f20ef7784b6fef3ec/">cache</a>)</cite></p>
</blockquote>
<p>Brent Simmons nous rappelle que de sécuriser une connexion pour cacher ce que l’on fait et que ça ne soit consigné que par le destinataire… pour être ensuite revendu en arrière plan est complètement incohérent. De là à dire que HTTPS encourage les monopoles, la centralisation et les inégalités, il n’y a qu’un troll. J’assume.</p>
<p>Via <a href="https://keybase.io/">keybase</a> je découvre <a href="https://learn.stellar.org/">stellar</a> qui revendique <cite>« No forks, no energy-wasting, and no unfair staking »</cite> pour des transactions monétaires. Je n’ai pas les compétences pour lire le <a href="https://www.stellar.org/papers/stellar-consensus-protocol.pdf">papier blanc</a> (<a href="/static/david/stream/stellar-consensus-protocol.pdf">cache</a>, PDF 200Ko) mais ça semble prometteur.  Enfin des micro-paiements en 2019 ?</p>
<figure class="unsquared">
    <a href="/static/david/media/2019/20190112-canada-arbre-givre.jpg">
      <img src="/static/david/media/2019/thumbnails/20190112-canada-arbre-givre.jpg" alt="Arbre givré" />
    </a>
  <figcaption>
    Quand on me demande si j’ai eu froid.
  </figcaption>
</figure>

<p>J’ai pas mal de conseils pour le grand froid. Ce qui est capital c’est la gestion de l’eau. On a beau être littéralement entouré d’eau (neige), on peut en arriver très vite à être déshydraté sans pouvoir remédier à cela rapidement. Ma stratégie actuelle, c’est d’avoir un petit thermos <em>sur moi</em> (effet bouillotte + ça aussi ça gèle au bout d’un moment !) d’eau ou infusion brûlante. Je rempli le capuchon/verre de neige et je complète avec l’eau chaude, ça me double la quantité de liquide ingérable avec la possibilité de boire une boisson chaude en cas de besoin. Aussi, c’est la saison où il faut piétiner sa barre énergétique <em>avant</em> de l’ouvrir au risque de se casser les dents…</p>
<blockquote>
<p>Nous gagnerions à mieux maîtriser la quantité produite et à mieux comprendre ce qui est fait de nos déchets, ainsi que l’énergie dépensée à les trier, les enfouir, les incinérer. Nous gagnerions à connaître le coût environnemental de toute l’affaire, depuis la fabrication des sacs en plastique immonde jusqu’à l’incinération d’une matière qui a en tout et pour tout servi quelques heures, au mieux quelques jours. Nous gagnerions à retrouver le pouvoir de prendre du recul sur ce que nous produisons.</p>
<p><cite><em><a href="http://resilience.mcpaccard.com/notes/la-ville-et-ses-dechets">La ville et ses déchets</a></em> (<a href="/david/cache/f48428bd52e750dd7cdb1d2efb15a5ba/">cache</a>)</cite></p>
</blockquote>
<p>Marie-Cécile Paccard partage son chemin de résilience à travers des <a href="http://resilience.mcpaccard.com/">notes</a>. À Montréal la ville offre à chaque résident deux bacs : un petit à mettre dans sa cuisine et un plus gros pour stocker en attendant que le camion dédié passe une fois par semaine. Au printemps, il y a une distribution publique de compost pour boucler le cycle et enrichir les jardins locaux. Je ne sais pas quel coût cela représente, j’ai l’intuition que le retour sur investissement global est positif.</p>
<blockquote>
<p>You probably had several great things you wanted to do, but had to pick just a few of them. If so, then consider thinking of it from a place of celebration.</p>
<p>Instead of feeling regret over what you didn’t do, celebrate what you did do.</p>
<p><cite><em><a href="https://shawnblanc.net/2019/01/regret-vs-celebration/">Regret vs Celebration</a></em> (<a href="/david/cache/cabff60e2f12405860c7269dc56debe8/">cache</a>)</cite></p>
</blockquote>
<p><em>This.</em> Tiens, et si je rédigeais mes intentions annuelles ?</p>
<figure class="unsquared">
    <a href="/static/david/media/2019/20190112-canada-arbre-soleil.jpg">
      <img src="/static/david/media/2019/thumbnails/20190112-canada-arbre-soleil.jpg" alt="Soleil à travers les arbres" />
    </a>
  <figcaption>
    Au bout du tunnel neigeux, la lumière.
  </figcaption>
</figure>

<blockquote>
<p>Fermer de temps en temps les portes et les fenêtres de la conscience ; demeurer insensibles au bruit et à la lutte que le monde souterrain des organes à notre service livre pour s’entraider ou s’entre-détruire ; faire silence, un peu, faire table rase dans notre conscience pour qu’il y ait de nouveau de la place pour les choses nouvelles, et en particulier pour les fonctions et les fonctionnaires plus nobles, pour gouverner, pour prévoir, pour pressentir (car notre organisme est une véritable oligarchie) voilà, je le répète, le rôle de la faculté active d’oubli, une sorte de gardienne, de surveillante chargée de maintenir l’ordre psychique, la tranquillité, l’étiquette. On en conclura immédiatement que nul bonheur, nulle sérénité, nulle espérance, nulle fierté, nulle jouissance de l’instant présent ne pourrait exister sans faculté d’oubli.</p>
<p><cite><em>Généalogie de la morale</em>, Nietzsche</cite></p>
</blockquote>
</article>


<nav id="jumpto">
  <p>
    <a rel=prev href="/david/stream/2019/01/11/">← Métaphores</a> | <a href="/david/stream/2019/" title="Retour à la liste complète">↑ Liste complète</a> | <a  rel=next href="/david/stream/2019/01/25/">Auto-diagnostic →</a>
  </p>
</nav>

<footer>
  <div>
    <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
    <p>
      Bonjour/Hi!
      Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
      Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
    </p>
    <p>
      Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
    </p>
    
      <p>
        Les dernières publications hebdomadaires sont :
      </p>
      <ul class="with_columns">
        
          <li>
            <a href="/david/stream/2019/12/31/">Merci</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/12/27/">Intemporels</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/12/24/">Outils</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/12/17/">Origines</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/12/10/">Publier</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/12/03/">En forêt</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/11/26/">Ecocentric</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/11/19/">Se livrer</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/11/12/">Dépendances</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/11/05/">Positif</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/10/29/">Dettes</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/10/22/">Privilèges</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/10/15/">Discrétion</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/10/08/">Désespérance</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/10/01/">Présent</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/09/24/">Manifester</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/09/17/">Arpenter</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/09/10/">Nostalgie</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/09/03/">Déconstruire</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/08/27/">Documenter</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/08/20/">Frustration</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/08/13/">Holisme</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/08/06/">1%</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/07/30/">Exemplarité</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/07/23/">Timelines</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/07/16/">Écoute</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/07/02/">Anxiété</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/06/21/">À lier</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/06/14/">Pauvreté</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/06/07/">Amateur</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/05/31/">Pollution</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/05/24/">Apaisement</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/05/10/">Folie</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/05/03/">Sympathie</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/04/12/">Péremption</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/04/05/">Définitions</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/03/29/">Acceptation</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/03/22/">Dissonance</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/03/15/">Reconnaissance</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/03/08/">Lecture</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/03/01/">Journaux</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/02/22/">Écriture</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/02/15/">Kyriarchie</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/02/08/">Mots-serrures</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/02/01/">Sans voie</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/01/18/">Agilité</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/01/11/">Métaphores</a>
          </li>
        
          <li>
            <a href="/david/stream/2019/01/04/">Balbutiements</a>
          </li>
        
      </ul>
    
    <p>
      Voici quelques articles choisis :
      <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
      <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
      <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
      <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
      <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
      <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
      <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
      <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
      <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
      <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
      <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
      <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
      <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
      <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
      <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
      et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
    </p>
    <p>
      On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
    </p>
    <p>
      Je ne traque pas ta navigation mais mon
      <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
      conserve des logs d’accès.
    </p>
  </div>
</footer>
<script type="text/javascript">
  ;(_ => {
    const jumper = document.getElementById('jumper')
    jumper.addEventListener('click', e => {
      e.preventDefault()
      const anchor = e.target.getAttribute('href')
      const targetEl = document.getElementById(anchor.substring(1))
      targetEl.scrollIntoView({behavior: 'smooth'})
    })
  })()
</script>

  <script>
  /* Service workers */
  if (navigator.serviceWorker) {
    window.addEventListener('load', function () {
      var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'
      function sendLinks (selector) {
        var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {
          return link.getAttribute('href')
        })
        links.push(location.pathname)  // Put the current page in cache too.
        navigator.serviceWorker.controller.postMessage({ links: links })
      }
      navigator.serviceWorker.getRegistration()
        .then(function (registration) {
          if (!registration || !navigator.serviceWorker.controller) {
            return navigator.serviceWorker.register('/serviceworker.js')
              .then(navigator.serviceWorker.ready)
              .then(function () {
                console.log('[ServiceWorker] Ready to go!')
              })
              .catch(console.error.bind(console))
          } else {
            console.log('[ServiceWorker] Send links via registration')
            sendLinks(selector)
          }
        })
      navigator.serviceWorker.addEventListener('controllerchange', function () {
        console.log('[ServiceWorker] Send links via controller change')
        sendLinks(selector)
      })
      navigator.serviceWorker.addEventListener('message', function (event) {
        var link = document.querySelector('a[href="' + event.data.link + '"]')
        if (event.data.status && link) {
          link.style.backgroundColor = '#2d7474'
          link.style.color = '#f0f0ea'
          
            link.setAttribute('title', 'En cache pour consultation sans connexion')
          
        }
      })
    })
  } else {
    console.warn('[ServiceWorker] No cache for old browsers.')
  }
</script>