Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 16KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the <title>
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Patience — David Larlet</title>
  13. <!-- That good ol' feed, subscribe :). -->
  14. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  15. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  16. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  17. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  18. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  19. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  20. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  21. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  22. <meta name="msapplication-TileColor" content="#f0f0ea">
  23. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- Documented, feel free to shoot an email. -->
  26. <link rel="stylesheet" href="/static/david/css/style_2020-06-19.css">
  27. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  28. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  29. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <script type="text/javascript">
  35. function toggleTheme(themeName) {
  36. document.documentElement.classList.toggle(
  37. 'forced-dark',
  38. themeName === 'dark'
  39. )
  40. document.documentElement.classList.toggle(
  41. 'forced-light',
  42. themeName === 'light'
  43. )
  44. }
  45. const selectedTheme = localStorage.getItem('theme')
  46. if (selectedTheme !== 'undefined') {
  47. toggleTheme(selectedTheme)
  48. }
  49. </script>
  50. <body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  51. <article>
  52. <h1>Patience</h1>
  53. <nav>
  54. <p class="center">
  55. <a rel="prev" href="/david/2020/03/27/" title="Publication précédente : Exutoire">←</a> •
  56. <a href="/david/" title="Aller à l’accueil" tabindex="1">🏠</a>
  57. • <a rel="next" href="/david/2020/04/10/" title="Publication suivante : Résistance">→</a>
  58. </p>
  59. </nav>
  60. <hr>
  61. <p><em>Quand tout va trop vite, ralentir.</em></p>
  62. <h2 id="croire">Croire <a href="#croire" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  63. <blockquote lang="en">
  64. <p>I can’t do much to change the situation on a large scale. But this is what I will do. I will limit my internet intake and pay attention when it starts making me irritable or depressed. I will be deliberate in the messages I put out on the internet. When I write my email newsletters, I’ll mean them. I’ll post my own thoughts on my own website, whether or not anyone takes the time to read them. And I’ll keep believing in this imperfect tool as a way to connect with other people, open their communication and expand their world. <mark>Sometimes, I will have to take breaks.</mark> But it’s not because I hate the internet. It’s because that’s the only way to keep believing in it.</p>
  65. <p><cite><em><a href="https://jenmyers.net/daily/how-to-keep-believing-in-the-internet.html">How To Keep Believing in the Internet</a></em> (<a href="/david/cache/2020/10a0e890ada0487e0adf4548960f056f/">cache</a>)</cite></p>
  66. </blockquote>
  67. <p>Après une période de <a href="/david/2020/03/27/">boulimie d’information</a>, un moment de repos s’impose. Penser à autre chose pour être en mesure de trouver de nouveaux angles d’approche plus enthousiasmants. Faire un pas de côté, à la fois pour esquiver <em>et</em> pour se pencher sur le travail du voisin inspirant.</p>
  68. <h2 id="remote">Remote <a href="#remote" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  69. <blockquote lang="en">
  70. <p>This also isn’t a time to try to simulate the office. Working from home is not working from the office. Working remotely is not working locally. Don’t try to make one the other. If you have meetings all day at the office, don’t simply simulate those meetings via video. This is an opportunity <em>not</em> to have those meetings. Write it up instead, disseminate the information that way. Let people absorb it on their own time. Protect their time and attention. <a href="https://basecamp.com/guides/how-we-communicate">Improve the way you communicate.</a></p>
  71. <p>Ultimately this major upheaval is an <em>opportunity</em>. This is a chance for your company, your teams, and individuals to learn a new skill. <mark>Working remotely is a skill.</mark> When this is all over, everyone should have a new skill.</p>
  72. <p><cite><em><a href="https://m.signalvnoise.com/working-remotely-builds-organizational-resiliency/">Working remotely builds organizational resiliency</a></em> (<a href="/david/cache/2020/5c374b4df521b1ef44c86cd9a3cc022f/">cache</a>)</cite></p>
  73. </blockquote>
  74. <p>J’aimerais pouvoir parfois donner davantage de conseils sur le sujet mais je sais que l’expérience est nécessaire pour éprouver le <em>besoin</em> d’évoluer. C’est terriblement frustrant car cela prend du temps, mais le résultat est probablement plus efficace à moyen terme.</p>
  75. <p>Avec la vieillesse vient le besoin de se rassurer sur la pertinence de son inaction.</p>
  76. <h2 id="dessin">Dessin <a href="#dessin" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  77. <blockquote>
  78. <p>Les carnets se suivent, se multiplient. Dessiner n’est pas vital, dessiner était une contrainte et devient une obligation. Peut-être par nécessité de produire, quel que soit le résultat et sa qualité. Un dessin raté c’est mieux que pas de dessin.</p>
  79. <p><cite><em><a href="https://www.quaternum.net/2020/02/29/epuiser-la-pratique/">Épuiser la pratique</a></em> (<a href="/david/cache/2020/fd776407232cd6fd7627bac7dba39755/">cache</a>)</cite></p>
  80. </blockquote>
  81. <p>Superbe texte d’Antoine. En copier le code source m’a permis d’en apprécier pleinement le rythme. Peut-être qu’il mériterait un enregistrement audio de sa lecture ?</p>
  82. <h2 id="minimum">Minimum <a href="#minimum" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  83. <blockquote>
  84. <p>Le Minimum <del>pourrait être défini comme la perfection atteinte par un artefact lorsqu’il ne peut plus être amélioré par soustraction. C’est la qualité que possède un objet lorsque chaque composante, chaque détail, et chaque jointure a été réduit ou condensé à l’essentiel. Il</del> résulte de l’omission de l’inessentiel.</p>
  85. <p>— <cite>John Pawson</cite></p>
  86. <p><cite><em><a href="https://journal.loupbrun.ca/n/021/">Minimum</a></em> (<a href="/david/cache/2020/7f74e315811927454830814bcb659896/">cache</a>)</cite></p>
  87. </blockquote>
  88. <p>Merci Louis-Olivier Brassard. Cela me donne envie de jouer avec ce concept et des citations célèbres :</p>
  89. <blockquote lang="en">
  90. <p><del>In anything at all,</del> perfection is <del>finally attained not when there is no longer anything to add, but when there is no longer anything to take away, when a body has been stripped down to its</del> nakedness.</p>
  91. <p>— <cite>Antoine de Saint-Exupéry</cite></p>
  92. </blockquote>
  93. <blockquote lang="en">
  94. <p>Tell me <del>and I forget. Teach me and I remember. Involve me and</del> I learn.</p>
  95. <p>— <cite>Benjamin Franklin</cite></p>
  96. </blockquote>
  97. <blockquote lang="en">
  98. <p>Do not <del>go where the path may lead, go instead where there is no path and</del> leave a trail.</p>
  99. <p>— <cite>Ralph Waldo Emerson</cite></p>
  100. </blockquote>
  101. <blockquote lang="en">
  102. <p>Life is <del>made of ever so many partings welded</del> together.</p>
  103. <p>— <cite>Charles Dickens</cite></p>
  104. </blockquote>
  105. <h2 id="jusquau-declin">Jusqu’au déclin <a href="#jusquau-declin" title="Ancre vers cette partie" aria-hidden="true">#</a></h2><p>J’avais besoin de me changer les idées alors pourquoi pas un film sur le survivalisme qui allait forcément être caricatural ?</p>
  106. <p>Et puis finalement, pas pire. J’ai apprécié le contexte vu que je vois peu de films québécois. Le <em>scenario</em> comporte des rebondissements assez inattendus ce qui rend le truc difficilement crédible mais c’est ce dont j’avais besoin.</p>
  107. <p>Cerise sur le gâteau, je me rends compte que j’étais sur le pont de la dernière scène il y a un mois (4 mars).</p>
  108. <p><em>La <a href="/david/bushcraft/">forêt</a> me manque.</em></p>
  109. <figure>
  110. <img src="/static/david/2020/pont_ouareau.jpg"
  111. alt="Vue depuis le pont qui enjambe la rivière Ouareau."
  112. loading="lazy" width="1024" height="1024" />
  113. <figcaption>Photo prise depuis le pont.</figcaption>
  114. </figure>
  115. <h2 id="good-intent">Good intent <a href="#good-intent" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  116. <blockquote lang="en">
  117. <p>In that context, people telling you to ‘assume good intent’ sounds like <mark>they’re really telling you to shut up</mark>. That your feelings about getting stomped on all the time don’t matter. That no matter how sore your foot is, how much money you’ve spent replacing ruined shoes, how many times you’ve limped on broken toes, you still have a responsibility to worry about the feelings of the people who are hurting you. Because they don’t <em>mean</em> it. As if that makes a difference.</p>
  118. <p><cite><em><a href="https://thebias.com/2017/09/26/how-good-intent-undermines-diversity-and-inclusion/">How “Good Intent” Undermines Diversity and Inclusion</a></em> (<a href="/david/cache/2020/618f913d970fee8feadadd15cf282e5a/">cache</a>)</cite></p>
  119. </blockquote>
  120. <p>Même avec la meilleure intention du monde, on passe parfois complètement à côté de la souffrance. J’ai toujours ce tiraillement entre l’écoute (plus ou mois active) et l’action (plus ou moins délétère). La solution facile serait d’aller s’isoler mais je ne me sens pas encore assez fatigué de jongler avec des émotions pour cela.</p>
  121. <h2 id="maitre">Maître <a href="#maitre" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
  122. <blockquote>
  123. <p>Il y a quelques minutes, tu as affirmé que j’étais un maître. Mais qu’est-ce qu’un maître ? Je vais te le dire : ce n’est pas celui qui enseigne quelque chose, c’est celui qui incite le disciple à donner le meilleur de lui-même pour qu’il découvre une connaissance déjà présente en lui, au creux se son âme.</p>
  124. <p><cite><em>La Voie de l’Archer</em>, Paulo Coelho</cite></p>
  125. </blockquote>
  126. <p>J’ai parfois l’impression d’asséner <em>mes</em> vérités à longueur d’articles. D’avoir une position haute (hautaine ?) qui ne me convient pas et que j’ai du mal à assumer. Et d’un autre côté, sans cela, je n’aurais probablement pas la prétention de publier des pensées.</p>
  127. <p><em>Mais serait-ce vraiment une mauvaise chose ?</em></p>
  128. <nav>
  129. <p class="center">
  130. <a rel="prev" href="/david/2020/03/27/" title="Publication précédente : Exutoire">←</a> •
  131. <a href="/david/2020/" title="Liste des publications récentes">↑</a>
  132. • <a rel="next" href="/david/2020/04/10/" title="Publication suivante : Résistance">→</a>
  133. </p>
  134. </nav>
  135. </article>
  136. <hr>
  137. <footer>
  138. <p>
  139. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  140. <a href="/david/log/" title="Accès au flux RSS">🤖</a> •
  141. <a href="http://larlet.com" title="Go to my English profile" data-instant>🇨🇦</a> •
  142. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">📮</a> •
  143. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">🧚</abbr>
  144. </p>
  145. <template id="theme-selector">
  146. <form>
  147. <fieldset>
  148. <legend>Thème</legend>
  149. <label>
  150. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  151. </label>
  152. <label>
  153. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  154. </label>
  155. <label>
  156. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  157. </label>
  158. </fieldset>
  159. </form>
  160. </template>
  161. </footer>
  162. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module" defer></script>
  163. <script type="text/javascript">
  164. function loadThemeForm(templateName) {
  165. const themeSelectorTemplate = document.querySelector(templateName)
  166. const form = themeSelectorTemplate.content.firstElementChild
  167. themeSelectorTemplate.replaceWith(form)
  168. form.addEventListener('change', (e) => {
  169. const chosenColorScheme = e.target.value
  170. localStorage.setItem('theme', chosenColorScheme)
  171. toggleTheme(chosenColorScheme)
  172. })
  173. const selectedTheme = localStorage.getItem('theme')
  174. if (selectedTheme && selectedTheme !== 'undefined') {
  175. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  176. }
  177. }
  178. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  179. window.addEventListener('load', () => {
  180. let hasDarkRules = false
  181. for (const styleSheet of Array.from(document.styleSheets)) {
  182. let mediaRules = []
  183. for (const cssRule of styleSheet.cssRules) {
  184. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  185. continue
  186. }
  187. // WARNING: Safari does not have/supports `conditionText`.
  188. if (cssRule.conditionText) {
  189. if (cssRule.conditionText !== prefersColorSchemeDark) {
  190. continue
  191. }
  192. } else {
  193. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  194. continue
  195. }
  196. }
  197. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  198. }
  199. // WARNING: do not try to insert a Rule to a styleSheet you are
  200. // currently iterating on, otherwise the browser will be stuck
  201. // in a infinite loop…
  202. for (const mediaRule of mediaRules) {
  203. styleSheet.insertRule(mediaRule.cssText)
  204. hasDarkRules = true
  205. }
  206. }
  207. if (hasDarkRules) {
  208. loadThemeForm('#theme-selector')
  209. }
  210. })
  211. </script>
  212. </body>
  213. </html>