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 34KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830
  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,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Arpenter — David Larlet</title>
  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
  17. <link rel="manifest" href="/manifest.json">
  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">
  20. <meta name="apple-mobile-web-app-title" content="David Larlet">
  21. <meta name="application-name" content="David Larlet">
  22. <meta name="msapplication-TileColor" content="#da532c">
  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- That good ol' feed, subscribe :p. -->
  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">
  27. <!-- Canonical URL for SEO purposes -->
  28. <link rel="canonical" href="https://larlet.fr/david/stream/2019/09/17/">
  29. <style>
  30. /* http://meyerweb.com/eric/tools/css/reset/ */
  31. html, body, div, span,
  32. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  33. a, abbr, address, big, cite, code,
  34. del, dfn, em, img, ins,
  35. small, strike, strong, tt, var,
  36. dl, dt, dd, ol, ul, li,
  37. fieldset, form, label, legend,
  38. table, caption, tbody, tfoot, thead, tr, th, td,
  39. article, aside, canvas, details, embed,
  40. figure, figcaption, footer, header, hgroup,
  41. menu, nav, output, ruby, section, summary,
  42. time, mark, audio, video {
  43. margin: 0;
  44. padding: 0;
  45. border: 0;
  46. font-size: 100%;
  47. font: inherit;
  48. vertical-align: baseline;
  49. }
  50. /* HTML5 display-role reset for older browsers */
  51. article, aside, details, figcaption, figure,
  52. footer, header, hgroup, menu, nav, section { display: block; }
  53. body { line-height: 1; }
  54. blockquote, q { quotes: none; }
  55. blockquote:before, blockquote:after,
  56. q:before, q:after {
  57. content: '';
  58. content: none;
  59. }
  60. table {
  61. border-collapse: collapse;
  62. border-spacing: 0;
  63. }
  64. /* http://practicaltypography.com/equity.html */
  65. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  66. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  67. @font-face {
  68. font-family: 'EquityTextB';
  69. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  70. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  71. font-weight: 300;
  72. font-style: normal;
  73. font-display: swap;
  74. }
  75. @font-face {
  76. font-family: 'EquityTextB';
  77. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  78. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  79. font-weight: 300;
  80. font-style: italic;
  81. font-display: swap;
  82. }
  83. @font-face {
  84. font-family: 'EquityTextB';
  85. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  86. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  87. font-weight: 700;
  88. font-style: normal;
  89. font-display: swap;
  90. }
  91. @font-face {
  92. font-family: 'ConcourseT3';
  93. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  94. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  95. font-weight: 300;
  96. font-style: normal;
  97. font-display: swap;
  98. }
  99. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  100. body {
  101. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  102. font-family: "EquityTextB", Palatino, serif;
  103. background-color: #f0f0ea;
  104. color: #07486c;
  105. font-kerning: normal;
  106. -moz-osx-font-smoothing: grayscale;
  107. -webkit-font-smoothing: subpixel-antialiased;
  108. text-rendering: optimizeLegibility;
  109. font-variant-ligatures: common-ligatures contextual;
  110. font-feature-settings: "kern", "liga", "clig", "calt";
  111. }
  112. pre, code, kbd, samp, var, tt {
  113. font-family: 'TriplicateT4c', monospace;
  114. }
  115. em {
  116. font-style: italic;
  117. color: #323a45;
  118. }
  119. strong {
  120. font-weight: bold;
  121. color: black;
  122. }
  123. nav {
  124. background-color: #323a45;
  125. color: #f0f0ea;
  126. display: flex;
  127. justify-content: space-around;
  128. padding: 1rem .5rem;
  129. }
  130. nav:last-child {
  131. border-bottom: 1vh solid #2d7474;
  132. }
  133. nav a {
  134. color: #f0f0ea;
  135. }
  136. nav abbr {
  137. border-bottom: 1px dotted white;
  138. }
  139. h1 {
  140. border-top: 1vh solid #2d7474;
  141. border-bottom: .2vh dotted #2d7474;
  142. background-color: #e3e1e1;
  143. color: #323a45;
  144. text-align: center;
  145. padding: 5rem 0 4rem 0;
  146. width: 100%;
  147. font-family: 'ConcourseT3';
  148. display: flex;
  149. flex-direction: column;
  150. }
  151. h1.single {
  152. padding-bottom: 10rem;
  153. }
  154. h1 span {
  155. position: absolute;
  156. top: 1vh;
  157. left: 20%;
  158. line-height: 0;
  159. }
  160. h1 span a {
  161. line-height: 1.7;
  162. padding: 1rem 1.2rem .6rem 1.2rem;
  163. border-radius: 0 0 6% 6%;
  164. background: #2d7474;
  165. font-size: 1.3rem;
  166. color: white;
  167. text-decoration: none;
  168. }
  169. h2 {
  170. margin: 4rem 0 1rem;
  171. border-top: .2vh solid #2d7474;
  172. padding-top: 1vh;
  173. }
  174. h3 {
  175. text-align: center;
  176. margin: 3rem 0 .75em;
  177. }
  178. hr {
  179. height: .4rem;
  180. width: .4rem;
  181. border-radius: .4rem;
  182. background: #07486c;
  183. margin: 2.5rem auto;
  184. }
  185. time {
  186. display: bloc;
  187. margin-left: 0 !important;
  188. }
  189. ul, ol {
  190. margin: 2rem;
  191. }
  192. ul {
  193. list-style-type: square;
  194. }
  195. a {
  196. text-decoration-skip-ink: auto;
  197. text-decoration-thickness: 0.05em;
  198. text-underline-offset: 0.09em;
  199. }
  200. article {
  201. max-width: 50rem;
  202. display: flex;
  203. flex-direction: column;
  204. margin: 2rem auto;
  205. }
  206. article.single {
  207. border-top: .2vh dotted #2d7474;
  208. margin: -6rem auto 1rem auto;
  209. background: #f0f0ea;
  210. padding: 2rem;
  211. }
  212. article p:last-child {
  213. margin-bottom: 1rem;
  214. }
  215. p {
  216. padding: 0 .5rem;
  217. margin-left: 3rem;
  218. }
  219. p + p,
  220. figure + p {
  221. margin-top: 2rem;
  222. }
  223. blockquote {
  224. background-color: #e3e1e1;
  225. border-left: .5vw solid #2d7474;
  226. display: flex;
  227. flex-direction: column;
  228. align-items: center;
  229. padding: 1rem;
  230. margin: 1.5rem;
  231. }
  232. blockquote cite {
  233. font-style: italic;
  234. }
  235. blockquote p {
  236. margin-left: 0;
  237. }
  238. figure {
  239. border-top: .2vh solid #2d7474;
  240. background-color: #e3e1e1;
  241. text-align: center;
  242. padding: 1.5rem 0;
  243. margin: 1rem 0 0;
  244. font-size: 1.5rem;
  245. width: 100%;
  246. }
  247. figure img {
  248. max-width: 250px;
  249. max-height: 250px;
  250. border: .5vw solid #323a45;
  251. padding: 1px;
  252. }
  253. figcaption {
  254. padding: 1rem;
  255. line-height: 1.4;
  256. }
  257. aside {
  258. display: flex;
  259. flex-direction: column;
  260. background-color: #e3e1e1;
  261. padding: 1rem 0;
  262. border-bottom: .2vh solid #07486c;
  263. }
  264. aside p {
  265. max-width: 50rem;
  266. margin: 0 auto;
  267. }
  268. /* https://fvsch.com/code/css-locks/ */
  269. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  270. font-size: 1rem;
  271. line-height: calc( 1.5em + 0.2 * 1rem );
  272. }
  273. h1 {
  274. font-size: 1.9rem;
  275. line-height: calc( 1.2em + 0.2 * 1rem );
  276. }
  277. h2 {
  278. font-size: 1.6rem;
  279. line-height: calc( 1.3em + 0.2 * 1rem );
  280. }
  281. h3 {
  282. font-size: 1.35rem;
  283. line-height: calc( 1.4em + 0.2 * 1rem );
  284. }
  285. @media (min-width: 20em) {
  286. /* The (100vw - 20rem) / (50 - 20) part
  287. resolves to 0-1rem, depending on the
  288. viewport width (between 20em and 50em). */
  289. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  290. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  291. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  292. margin-left: 0;
  293. }
  294. h1 {
  295. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  296. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  297. }
  298. h2 {
  299. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  300. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  301. }
  302. h3 {
  303. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  304. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  305. }
  306. }
  307. @media (min-width: 50em) {
  308. /* The right part of the addition *must* be a
  309. rem value. In this example we *could* change
  310. the whole declaration to font-size:2.5rem,
  311. but if our baseline value was not expressed
  312. in rem we would have to use calc. */
  313. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  314. font-size: calc( 1rem + .6 * 1rem );
  315. line-height: 1.5em;
  316. }
  317. p, li, pre, details {
  318. margin-left: 3rem;
  319. }
  320. h1 {
  321. font-size: calc( 1.9rem + 1.5 * 1rem );
  322. line-height: 1.2em;
  323. }
  324. h2 {
  325. font-size: calc( 1.5rem + 1.5 * 1rem );
  326. line-height: 1.3em;
  327. }
  328. h3 {
  329. font-size: calc( 1.35rem + 1.5 * 1rem );
  330. line-height: 1.4em;
  331. }
  332. figure img {
  333. max-width: 500px;
  334. max-height: 500px;
  335. }
  336. }
  337. figure.unsquared {
  338. margin-bottom: 1.5rem;
  339. }
  340. figure.unsquared img {
  341. height: inherit;
  342. }
  343. @media print {
  344. body { font-size: 100%; }
  345. a:after { content: " (" attr(href) ")"; }
  346. a, a:link, a:visited, a:after {
  347. text-decoration: underline;
  348. text-shadow: none !important;
  349. background-image: none !important;
  350. background: white;
  351. color: black;
  352. }
  353. abbr[title] { border-bottom: 0; }
  354. abbr[title]:after { content: " (" attr(title) ")"; }
  355. img { page-break-inside: avoid; }
  356. @page { margin: 2cm .5cm; }
  357. h1, h2, h3 { page-break-after: avoid; }
  358. p3 { orphans: 3; widows: 3; }
  359. img {
  360. max-width: 250px !important;
  361. max-height: 250px !important;
  362. }
  363. nav, aside { display: none; }
  364. }
  365. ul.with_columns {
  366. column-count: 1;
  367. }
  368. @media (min-width: 20em) {
  369. ul.with_columns {
  370. column-count: 2;
  371. }
  372. }
  373. @media (min-width: 50em) {
  374. ul.with_columns {
  375. column-count: 3;
  376. }
  377. }
  378. ul.with_two_columns {
  379. column-count: 1;
  380. }
  381. @media (min-width: 20em) {
  382. ul.with_two_columns {
  383. column-count: 1;
  384. }
  385. }
  386. @media (min-width: 50em) {
  387. ul.with_two_columns {
  388. column-count: 2;
  389. }
  390. }
  391. .gallery {
  392. display: flex;
  393. flex-wrap: wrap;
  394. justify-content: space-around;
  395. }
  396. .gallery figure img {
  397. margin-left: 1rem;
  398. margin-right: 1rem;
  399. }
  400. .gallery figure figcaption {
  401. font-family: 'ConcourseT3'
  402. }
  403. footer {
  404. font-family: 'ConcourseT3';
  405. display: flex;
  406. flex-direction: column;
  407. border-top: 3px solid white;
  408. padding: 4rem 0;
  409. background-color: #07486c;
  410. color: white;
  411. }
  412. footer > * {
  413. max-width: 50rem;
  414. margin: 0 auto;
  415. }
  416. footer a {
  417. color: #f1c40f;
  418. }
  419. footer .avatar {
  420. width: 200px;
  421. height: 200px;
  422. border-radius: 50%;
  423. float: left;
  424. -webkit-shape-outside: circle();
  425. shape-outside: circle();
  426. margin-right: 2rem;
  427. padding: 2px 5px 5px 2px;
  428. background: white;
  429. border-left: 1px solid #f1c40f;
  430. border-top: 1px solid #f1c40f;
  431. border-right: 5px solid #f1c40f;
  432. border-bottom: 5px solid #f1c40f;
  433. }
  434. </style>
  435. <h1 class="single">
  436. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  437. Arpenter
  438. <time>Publié le 17 septembre</time>
  439. </h1>
  440. <article class="single">
  441. <p><em>Vingt-quatre heures dans la forêt. Un marathon de marche afin d’épuiser le corps et l’esprit. Pour penser, dé-penser, repenser. Panser des blessures profondes, faire le vide, faire le plein. Habiter la forêt comme un lieu accueillant, un refuge aux bruits de ce monde.</em></p>
  442. <hr />
  443. <blockquote>
  444. <p>La particularité de l’anarchisme réside plutôt dans sa conception radicale des principes de liberté et d’égalité, qui favorise un processus de prise de décision autonome, horizontal, participatif, délibératif et consensuel. L’anarchisme offre ou se présente alors comme une « boussole éthique », comme l’ont suggéré plusieurs anarchistes, puisqu’il offre quelques critères pour évaluer la meilleure direction à prendre, en terme d’organisation collective, de processus de prise de décision, d’action individuelle et collective.</p>
  445. <p>[…]</p>
  446. <p>Or, la dynamique des groupes d’affinité est influencée de façon particulière par l’amitié entre ses membres. En formant ou en joignant un groupe d’affinité, les individus deviennent ce qu’il convient de nommer des <em>amilitantes</em> et <em>amilitants</em>. Ce nouveau concept évoque à la fois un amalgame entre le rôle d’<em>ami</em> et de <em>militant</em>, ainsi qu’une certaine négation du militantisme traditionnel (le préfixe <em>a-</em> pouvant indiquer une négation). C’est ici l’amitié qui influence avant tout le comportement politique, plutôt qu’une doctrine idéologique ou un patriotisme organisationnel, comme dans le cas du militantisme traditionnel ; et cette politique de l’amitié favorise une diffusion — conscience ou non — des principes anarchistes au sein du mouvement altermondialiste. Amilitantes et amilitants sentent que la primauté du lien affinitaire et amical au sein de leur groupe implique presque naturellement un désir et une volonté de rechercher le consensus.</p>
  447. <p><cite><em>Les nouveaux anarchistes</em>, Francis Dupuis-Déri</cite></p>
  448. </blockquote>
  449. <p>Yannick évoquait l’anarchisme il y a quelques temps au sein de <a href="http://scopyleft.fr/">scopyleft</a>, je creuse un peu.</p>
  450. <hr />
  451. <blockquote>
  452. <p>Ne faites pas non plus des restrictions personnelles pour sauver la planète : c’est inutile. Pour chaque lumière que vous éteignez, y a un gratte-ciel de bureaux qui laisse sa lumière, son chauffage/sa clim et ses PC, téléphones et photocopieurs allumés toute la nuit et chaque week-end (et pour chaque robinet que vous fermez, il y a une commune qui arrose ses routes pour laver la poussière — riez pas, c’est arrivé pas loin d’ici durant la canicule).</p>
  453. <p>Faites ça pour votre porte-monnaie, et uniquement pour ça. Car au final, c’est vous qui consommez, c’est vous qui payez. Et tout ce que vous ne payez pas en électricité, vous pourrez le dépenser dans ce que vous voulez réellement : un bon restau, une sortie, un cadeau, ou n’importe quoi.</p>
  454. <p><cite><em><a href="https://lehollandaisvolant.net/?id=20190908174757">L’électricité verte, c’est quoi ?</a></em> (<a href="/david/cache/edacd94bc13105e85ebd12492c12046f/">cache</a>)</cite></p>
  455. </blockquote>
  456. <p>Et si ce que l’on veut réellement c’est justement ne pas dépenser ? Comment rendre montrable — et donc enviable — le fait de <em>ne pas</em> faire quelque chose ? Non pas une vie d’ascète mais une vie décente, en accord avec l’énergie disponible pour tous et pour longtemps.</p>
  457. <p>Au passage, je consultais les <a href="https://donneesclimatiques.ca/explorer/emplacement/?loc=EHHUN">données climatiques pour Montréal</a> et il n’y pas grand chose qui ne serait pas relativement enviable pour un autochtone si ce n’est <a href="/david/stream/2019/08/27/">la montée des eaux</a>. Bon soit, l’approvisionnement en nourriture aussi…</p>
  458. <hr />
  459. <blockquote>
  460. <p>Il faut rendre la propriété temporaire : les mêmes personnes ne doivent pas concentrer le capital éternellement. Je propose qu’au-delà d’un certain seuil, chacun redonne à la collectivité une partie de ce qu’il détient. J’imagine un impôt très progressif sur la propriété : il serait très faible (mettons 0,1 %) pour les personnes qui possèdent 100 000 ou 200 000 euros (trois fois moins que l’actuelle taxe foncière), mais pourrait monter jusqu’à 90 % pour ceux ayant au-delà de 10 000 fois le patrimoine moyen, c’est-à-dire plus de 2 milliards d’euros. Dans un tel système, les milliardaires disparaîtraient, de fait. Mais la petite propriété privée, elle, aurait toute sa place, tout comme l’entreprenariat. Car l’idée qu’il est tout à fait naturel que les entrepreneurs soient milliardaires est un mythe absurde, sur lequel repose en partie notre culte de la propriété privée : en réalité, les entrepreneurs qui ont des idées ne gagnent bien souvent pas des fortunes, et le dynamisme économique se nourrit justement de ces petits succès, de ces petites entreprises. L’hyperconcentration du capital entre les mains de quelques personnes n’est pas un modèle efficace ni indépassable.</p>
  461. <p><cite><em><a href="https://www.liberation.fr/debats/2019/09/11/thomas-piketty-chaque-societe-invente-un-recit-ideologique-pour-justifier-ses-inegalites_1750740">Thomas Piketty : « Chaque société invente un récit idéologique pour justifier ses inégalités »</a></em> (<a href="/david/cache/3afe6664d065b202fb9fc90a027685d0/">cache</a>)</cite></p>
  462. </blockquote>
  463. <p>Si vous avez lu <a href="/david/stream/2018/05/04/">mon programme politique</a>, vous savez à quel point j’aime l’<a href="/david/blog/2013/proprieterre/">héritage</a> (surtout <a href="/david/blog/2014/heritage-immobilier/">immobilier</a>). Aussi quand je lis une personne, qui me semble être médiatique (en tout cas j’ai déjà entendu son nom), s’exprimer en ces termes je me dis que les propositions finiront bien par germer ici et là. Que proposer comme transition ? Quel est le premier pas acceptable ?</p>
  464. <hr />
  465. <blockquote>
  466. <p>This year I wanted to reduce the volume of races (less traveling and resting) to be able to train more / better and try to give the best in the races I was competing, changing quantity to quality.</p>
  467. <p><cite><em><a href="https://mtnath.com/2019/08/31/training-and-racing-summer-2019/">Training and Racing Summer 2019</a></em> (<a href="/david/cache/9ba6caced01816723166a1e72fb6cc53/">cache</a>)</cite></p>
  468. </blockquote>
  469. <p>Kilian <a href="https://docs.google.com/spreadsheets/d/1_t4NwKrsAKbqotxi8T4RDgsMQzI2iNA3IYMZaPf-ArU/edit#gid=226609592">partage ses capacités</a>, entrainements, etc. C’est assez impressionnant. Je lisais par ailleurs qu’il disait récupérer un peu moins bien. <em><a href="https://www.youtube-nocookie.com/embed/kH7gpcdRb8s">Jajaja</a>.</em></p>
  470. <hr />
  471. <blockquote>
  472. <p>When a society helps people through its shared democratic institutions, it does on behalf of all, and in a context of equality. Those institutions, representing those free and equal citizens, are making a collective choice of whom to help and how. Those who receive help are not only objects of the transaction, but also subjects of it — citizens with agency. When help is moved into a private sphere, no matter how efficient we are told it is, the context of the helping is a relationship of inequality: the giver and the taker, the helper and the helped, the donor and the recipient.</p>
  473. <p><cite><em>Winners take all</em>, Anand Giridharadas</cite></p>
  474. </blockquote>
  475. <p>À rapprocher de :</p>
  476. <blockquote>
  477. <p>In this respect, any movement toward a more just and civil society can now be considered a meaningful climate action. Securing fair elections is a climate action. Combatting extreme wealth inequality is a climate action. Shutting down the hate machines on social media is a climate action. Instituting humane immigration policy, advocating for racial and gender equality, promoting respect for laws and their enforcement, supporting a free and independent press, ridding the country of assault weapons—these are all meaningful climate actions. To survive rising temperatures, every system, whether of the natural world or of the human world, will need to be as strong and healthy as we can make it.</p>
  478. <p><cite><em><a href="https://www.newyorker.com/culture/cultural-comment/what-if-we-stopped-pretending">What if We Stopped Pretending the Climate Apocalypse Can Be Stopped?</a></em> (<a href="/david/cache/d43d8c1d77e23c2fe5631be145e3bbb9/">cache</a>)</cite></p>
  479. </blockquote>
  480. <p>Lorsque je chemine sur l’arbre des possibles,
  481. je vois un retour à l’État et à la religion. Mutualiser d’un côté, faire groupe de l’autre. Comment réussir à morceler cela en minimisant la violence ? Se redéfinir sans avoir besoin d’un bouc-émissaire. Partager sans passer par un système pyramidal.</p>
  482. <blockquote>
  483. <p>La protection de la nature, de la variété et de la liberté humaines ne sera assurée que si l’on dissocie l’économie nationale ou multinationale en petites unités autarciques et autogérées</p>
  484. <p><cite><em>Bernard Charbonneau cité dans « <a href="https://www.partage-le.com/2019/09/greta-thunberg-extinction-rebellion-et-le-mouvement-pour-le-climat-developpement-durable-par-nicolas-casaux/">Greta Thunberg, Extinction Rebellion et le mouvement pour le développement durable</a> (<a href="/david/cache/334af5ba9ff5ce3e3f1975eca4b2fc85/">cache</a>) »</em></cite></p>
  485. </blockquote>
  486. <hr />
  487. <blockquote>
  488. <p>The pollution caused by an event is part of the hidden costs and we want to ensure that we take responsibility for it. </p>
  489. <p><cite><em><a href="https://wikimania.wikimedia.org/wiki/2019:Carbon_offsetting">2019:Carbon offsetting</a></em> (<a href="/david/cache/0a78b46970f134f319eecd422d09fb01/">cache</a>)</cite></p>
  490. </blockquote>
  491. <p>Combien de tonnes de carbone économisées pour une <a href="https://www.paris-web.fr/actualites/2019/09/suspension-temporaire-des-inscriptions-pour-paris-web-2019.php">annulation de ParisWeb</a> (<a href="/david/cache/3a9a76e4591d6ba25abb3a0932c02e4e/">cache</a>) ?</p>
  492. <p><em>Note : ce n’est plus le cas, ce billet mériterait d’être édité.</em></p>
  493. <hr />
  494. <blockquote>
  495. <p>The amount of time and knowledge that you need to have to setup such tools and services and to keep them up and running is insane.</p>
  496. <p>Yes, they save a lot of time once they are working. If you don’t touch them they are probably stable for a while. But I never learned to love them in all those years. It’s more like a love-hate relationship, slightly tilted to hate.</p>
  497. <p><cite><em><a href="https://bastianallgeier.com/notes/simplicity-part-2">Simplicity (II)</a></em> (<a href="/david/cache/e199025da35cbdb18e2103000dd931a3/">cache</a>)</cite></p>
  498. </blockquote>
  499. <p>Je verse une larme de réalité à chaque paragraphe de cet article. L’intégration continue c’est bien, l’intégration soutenue c’est mieux. Il faudrait que j’écrive un billet là-dessus.</p>
  500. <hr />
  501. <p>Citation de la semaine :</p>
  502. <blockquote>
  503. <p>as a programmer and as a parent, I’m always cleaning up shit created by a younger version of myself</p>
  504. <p><cite><em><a href="https://www.zachleat.com/twitter/905054076408393729/">Zach Leatherman</a></em> (qui prend <a href="https://www.zachleat.com/web/own-my-tweets/">possession de ses archives Twitter</a> (<a href="/david/cache/9c68e7d3dbc776b968571e3c3fcf9d14/">cache</a>))</cite></p>
  505. </blockquote>
  506. <p>J’ai ri.</p>
  507. </article>
  508. <nav id="jumpto">
  509. <p>
  510. <a rel=prev href="/david/stream/2019/09/10/">← Nostalgie</a> | <a href="/david/stream/2019/" title="Retour à la liste complète">↑ Liste complète</a> | <a rel=next href="/david/stream/2019/09/24/">Manifester →</a>
  511. </p>
  512. </nav>
  513. <footer>
  514. <div>
  515. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  516. <p>
  517. Bonjour/Hi!
  518. 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>
  519. 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>).
  520. </p>
  521. <p>
  522. 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>.
  523. </p>
  524. <p>
  525. Les dernières publications hebdomadaires sont :
  526. </p>
  527. <ul class="with_columns">
  528. <li>
  529. <a href="/david/stream/2019/12/27/">Intemporels</a>
  530. </li>
  531. <li>
  532. <a href="/david/stream/2019/12/24/">Outils</a>
  533. </li>
  534. <li>
  535. <a href="/david/stream/2019/12/17/">Origines</a>
  536. </li>
  537. <li>
  538. <a href="/david/stream/2019/12/10/">Publier</a>
  539. </li>
  540. <li>
  541. <a href="/david/stream/2019/12/03/">En forêt</a>
  542. </li>
  543. <li>
  544. <a href="/david/stream/2019/11/26/">Ecocentric</a>
  545. </li>
  546. <li>
  547. <a href="/david/stream/2019/11/19/">Se livrer</a>
  548. </li>
  549. <li>
  550. <a href="/david/stream/2019/11/12/">Dépendances</a>
  551. </li>
  552. <li>
  553. <a href="/david/stream/2019/11/05/">Positif</a>
  554. </li>
  555. <li>
  556. <a href="/david/stream/2019/10/29/">Dettes</a>
  557. </li>
  558. <li>
  559. <a href="/david/stream/2019/10/22/">Privilèges</a>
  560. </li>
  561. <li>
  562. <a href="/david/stream/2019/10/15/">Discrétion</a>
  563. </li>
  564. <li>
  565. <a href="/david/stream/2019/10/08/">Désespérance</a>
  566. </li>
  567. <li>
  568. <a href="/david/stream/2019/10/01/">Présent</a>
  569. </li>
  570. <li>
  571. <a href="/david/stream/2019/09/24/">Manifester</a>
  572. </li>
  573. <li>
  574. <a href="/david/stream/2019/09/17/">Arpenter</a>
  575. </li>
  576. <li>
  577. <a href="/david/stream/2019/09/10/">Nostalgie</a>
  578. </li>
  579. <li>
  580. <a href="/david/stream/2019/09/03/">Déconstruire</a>
  581. </li>
  582. <li>
  583. <a href="/david/stream/2019/08/27/">Documenter</a>
  584. </li>
  585. <li>
  586. <a href="/david/stream/2019/08/20/">Frustration</a>
  587. </li>
  588. <li>
  589. <a href="/david/stream/2019/08/13/">Holisme</a>
  590. </li>
  591. <li>
  592. <a href="/david/stream/2019/08/06/">1%</a>
  593. </li>
  594. <li>
  595. <a href="/david/stream/2019/07/30/">Exemplarité</a>
  596. </li>
  597. <li>
  598. <a href="/david/stream/2019/07/23/">Timelines</a>
  599. </li>
  600. <li>
  601. <a href="/david/stream/2019/07/16/">Écoute</a>
  602. </li>
  603. <li>
  604. <a href="/david/stream/2019/07/02/">Anxiété</a>
  605. </li>
  606. <li>
  607. <a href="/david/stream/2019/06/21/">À lier</a>
  608. </li>
  609. <li>
  610. <a href="/david/stream/2019/06/14/">Pauvreté</a>
  611. </li>
  612. <li>
  613. <a href="/david/stream/2019/06/07/">Amateur</a>
  614. </li>
  615. <li>
  616. <a href="/david/stream/2019/05/31/">Pollution</a>
  617. </li>
  618. <li>
  619. <a href="/david/stream/2019/05/24/">Apaisement</a>
  620. </li>
  621. <li>
  622. <a href="/david/stream/2019/05/10/">Folie</a>
  623. </li>
  624. <li>
  625. <a href="/david/stream/2019/05/03/">Sympathie</a>
  626. </li>
  627. <li>
  628. <a href="/david/stream/2019/04/12/">Péremption</a>
  629. </li>
  630. <li>
  631. <a href="/david/stream/2019/04/05/">Définitions</a>
  632. </li>
  633. <li>
  634. <a href="/david/stream/2019/03/29/">Acceptation</a>
  635. </li>
  636. <li>
  637. <a href="/david/stream/2019/03/22/">Dissonance</a>
  638. </li>
  639. <li>
  640. <a href="/david/stream/2019/03/15/">Reconnaissance</a>
  641. </li>
  642. <li>
  643. <a href="/david/stream/2019/03/08/">Lecture</a>
  644. </li>
  645. <li>
  646. <a href="/david/stream/2019/03/01/">Journaux</a>
  647. </li>
  648. <li>
  649. <a href="/david/stream/2019/02/22/">Écriture</a>
  650. </li>
  651. <li>
  652. <a href="/david/stream/2019/02/15/">Kyriarchie</a>
  653. </li>
  654. <li>
  655. <a href="/david/stream/2019/02/08/">Mots-serrures</a>
  656. </li>
  657. <li>
  658. <a href="/david/stream/2019/02/01/">Sans voie</a>
  659. </li>
  660. <li>
  661. <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>
  662. </li>
  663. <li>
  664. <a href="/david/stream/2019/01/18/">Agilité</a>
  665. </li>
  666. <li>
  667. <a href="/david/stream/2019/01/11/">Métaphores</a>
  668. </li>
  669. <li>
  670. <a href="/david/stream/2019/01/04/">Balbutiements</a>
  671. </li>
  672. </ul>
  673. <p>
  674. Voici quelques articles choisis :
  675. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  676. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  677. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  678. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  679. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  680. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  681. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  682. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  683. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  684. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  685. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  686. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  687. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  688. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  689. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  690. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  691. </p>
  692. <p>
  693. 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>.
  694. </p>
  695. <p>
  696. Je ne traque pas ta navigation mais mon
  697. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  698. conserve des logs d’accès.
  699. </p>
  700. </div>
  701. </footer>
  702. <script type="text/javascript">
  703. ;(_ => {
  704. const jumper = document.getElementById('jumper')
  705. jumper.addEventListener('click', e => {
  706. e.preventDefault()
  707. const anchor = e.target.getAttribute('href')
  708. const targetEl = document.getElementById(anchor.substring(1))
  709. targetEl.scrollIntoView({behavior: 'smooth'})
  710. })
  711. })()
  712. </script>
  713. <script>
  714. /* Service workers */
  715. if (navigator.serviceWorker) {
  716. window.addEventListener('load', function () {
  717. var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'
  718. function sendLinks (selector) {
  719. var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {
  720. return link.getAttribute('href')
  721. })
  722. links.push(location.pathname) // Put the current page in cache too.
  723. navigator.serviceWorker.controller.postMessage({ links: links })
  724. }
  725. navigator.serviceWorker.getRegistration()
  726. .then(function (registration) {
  727. if (!registration || !navigator.serviceWorker.controller) {
  728. return navigator.serviceWorker.register('/serviceworker.js')
  729. .then(navigator.serviceWorker.ready)
  730. .then(function () {
  731. console.log('[ServiceWorker] Ready to go!')
  732. })
  733. .catch(console.error.bind(console))
  734. } else {
  735. console.log('[ServiceWorker] Send links via registration')
  736. sendLinks(selector)
  737. }
  738. })
  739. navigator.serviceWorker.addEventListener('controllerchange', function () {
  740. console.log('[ServiceWorker] Send links via controller change')
  741. sendLinks(selector)
  742. })
  743. navigator.serviceWorker.addEventListener('message', function (event) {
  744. var link = document.querySelector('a[href="' + event.data.link + '"]')
  745. if (event.data.status && link) {
  746. link.style.backgroundColor = '#2d7474'
  747. link.style.color = '#f0f0ea'
  748. link.setAttribute('title', 'En cache pour consultation sans connexion')
  749. }
  750. })
  751. })
  752. } else {
  753. console.warn('[ServiceWorker] No cache for old browsers.')
  754. }
  755. </script>