davidbgk
/
larlet-fr-david
Следить 1
В избранное 0
Форкнуть 0
Код Релизы 0 Активность
Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
235 коммитов
1 ветка
Дерево: 1a85130596
Ветки Теги
${ item.name }
Создать ветку ${ searchTerm }
из '1a85130596'
${ noResults }
larlet-fr-david/david/stream/2019/10/08/index.html

index.html 33KB
Исходник Blame История

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837 
  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>Désespérance — 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. 

  28.   <!-- Canonical URL for SEO purposes -->

  29.   <link rel="canonical" href="https://larlet.fr/david/stream/2019/10/08/">

  30. 

  31. <style>

  32. /* http://meyerweb.com/eric/tools/css/reset/ */

  33. html, body, div, span,

  34. h1, h2, h3, h4, h5, h6, p, blockquote, pre,

  35. a, abbr, address, big, cite, code,

  36. del, dfn, em, img, ins,

  37. small, strike, strong, tt, var,

  38. dl, dt, dd, ol, ul, li,

  39. fieldset, form, label, legend,

  40. table, caption, tbody, tfoot, thead, tr, th, td,

  41. article, aside, canvas, details, embed,

  42. figure, figcaption, footer, header, hgroup,

  43. menu, nav, output, ruby, section, summary,

  44. time, mark, audio, video {

  45.   margin: 0;

  46.   padding: 0;

  47.   border: 0;

  48.   font-size: 100%;

  49.   font: inherit;

  50.   vertical-align: baseline;

  51. }

  52. /* HTML5 display-role reset for older browsers */

  53. article, aside, details, figcaption, figure,

  54. footer, header, hgroup, menu, nav, section { display: block; }

  55. body { line-height: 1; }

  56. blockquote, q { quotes: none; }

  57. blockquote:before, blockquote:after,

  58. q:before, q:after {

  59.   content: '';

  60.   content: none;

  61. }

  62. table {

  63.   border-collapse: collapse;

  64.   border-spacing: 0;

  65. }

  66. 

  67. /* http://practicaltypography.com/equity.html */

  68. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */

  69. /* https://www.filamentgroup.com/lab/js-web-fonts.html */

  70. @font-face {

  71.   font-family: 'EquityTextB';

  72.   src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),

  73.        url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');

  74.   font-weight: 300;

  75.   font-style: normal;

  76.   font-display: swap;

  77. }

  78. @font-face {

  79.   font-family: 'EquityTextB';

  80.   src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),

  81.        url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');

  82.   font-weight: 300;

  83.   font-style: italic;

  84.   font-display: swap;

  85. }

  86. @font-face {

  87.   font-family: 'EquityTextB';

  88.   src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),

  89.        url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');

  90.   font-weight: 700;

  91.   font-style: normal;

  92.   font-display: swap;

  93. }

  94. 

  95. @font-face {

  96.   font-family: 'ConcourseT3';

  97.   src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),

  98.        url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');

  99.   font-weight: 300;

  100.   font-style: normal;

  101.   font-display: swap;

  102. }

  103. 

  104. 

  105. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */

  106. body {

  107.   /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */

  108.   font-family: "EquityTextB", Palatino, serif;

  109.   background-color: #f0f0ea;

  110.   color: #07486c;

  111.   font-kerning: normal;

  112.   -moz-osx-font-smoothing: grayscale;

  113.   -webkit-font-smoothing: subpixel-antialiased;

  114.   text-rendering: optimizeLegibility;

  115.   font-variant-ligatures: common-ligatures contextual;

  116.   font-feature-settings: "kern", "liga", "clig", "calt";

  117. }

  118. pre, code, kbd, samp, var, tt {

  119.   font-family: 'TriplicateT4c', monospace;

  120. }

  121. em {

  122.   font-style: italic;

  123.   color: #323a45;

  124. }

  125. strong {

  126.   font-weight: bold;

  127.   color: black;

  128. }

  129. nav {

  130.   background-color: #323a45;

  131.   color: #f0f0ea;

  132.   display: flex;

  133.   justify-content: space-around;

  134.   padding: 1rem .5rem;

  135. }

  136.   nav:last-child {

  137.     border-bottom: 1vh solid #2d7474;

  138.   }

  139.   nav a {

  140.     color: #f0f0ea;

  141.   }

  142.   nav abbr {

  143.     border-bottom: 1px dotted white;

  144.   }

  145. 

  146. h1 {

  147.   border-top: 1vh solid #2d7474;

  148.   border-bottom: .2vh dotted #2d7474;

  149.   background-color: #e3e1e1;

  150.   color: #323a45;

  151.   text-align: center;

  152.   padding: 5rem 0 4rem 0;

  153.   width: 100%;

  154.   font-family: 'ConcourseT3';

  155.   display: flex;

  156.   flex-direction: column;

  157. }

  158.   h1.single {

  159.     padding-bottom: 10rem;

  160.   }

  161.   h1 span {

  162.     position: absolute;

  163.     top: 1vh;

  164.     left: 20%;

  165.     line-height: 0;

  166.   }

  167.     h1 span a {

  168.       line-height: 1.7;

  169.       padding: 1rem 1.2rem .6rem 1.2rem;

  170.       border-radius: 0 0 6% 6%;

  171.       background: #2d7474;

  172.       font-size: 1.3rem;

  173.       color: white;

  174.       text-decoration: none;

  175.     }

  176. h2 {

  177.   margin: 4rem 0 1rem;

  178.   border-top: .2vh solid #2d7474;

  179.   padding-top: 1vh;

  180. }

  181. h3 {

  182.   text-align: center;

  183.   margin: 3rem 0 .75em;

  184. }

  185. hr {

  186.   height: .4rem;

  187.   width: .4rem;

  188.   border-radius: .4rem;

  189.   background: #07486c;

  190.   margin: 2.5rem auto;

  191. }

  192. time {

  193.   display: bloc;

  194.   margin-left: 0 !important;

  195. }

  196. ul, ol {

  197.   margin: 2rem;

  198. }

  199. ul {

  200.   list-style-type: square;

  201. }

  202. a {

  203.   text-decoration-skip-ink: auto;

  204.   text-decoration-thickness: 0.05em;

  205.   text-underline-offset: 0.09em;

  206. }

  207. article {

  208.   max-width: 50rem;

  209.   display: flex;

  210.   flex-direction: column;

  211.   margin: 2rem auto;

  212. }

  213.   article.single {

  214.     border-top: .2vh dotted #2d7474;

  215.     margin: -6rem auto 1rem auto;

  216.     background: #f0f0ea;

  217.     padding: 2rem;

  218.   }

  219.   article p:last-child {

  220.     margin-bottom: 1rem;

  221.   }

  222. p {

  223.   padding: 0 .5rem;

  224.   margin-left: 3rem;

  225. }

  226.   p + p,

  227.   figure + p {

  228.     margin-top: 2rem;

  229.   }

  230. 

  231. blockquote {

  232.   background-color: #e3e1e1;

  233.   border-left: .5vw solid #2d7474;

  234.   display: flex;

  235.   flex-direction: column;

  236.   align-items: center;

  237.   padding: 1rem;

  238.   margin: 1.5rem;

  239. }

  240.   blockquote cite {

  241.     font-style: italic;

  242.   }

  243.   blockquote p {

  244.     margin-left: 0;

  245.   }

  246. 

  247. figure {

  248.   border-top: .2vh solid #2d7474;

  249.   background-color: #e3e1e1;

  250.   text-align: center;

  251.   padding: 1.5rem 0;

  252.   margin: 1rem 0 0;

  253.   font-size: 1.5rem;

  254.   width: 100%;

  255. }

  256.   figure img {

  257.     max-width: 250px;

  258.     max-height: 250px;

  259.     border: .5vw solid #323a45;

  260.     padding: 1px;

  261.   }

  262. figcaption {

  263.   padding: 1rem;

  264.   line-height: 1.4;

  265. }

  266. aside {

  267.   display: flex;

  268.   flex-direction: column;

  269.   background-color: #e3e1e1;

  270.   padding: 1rem 0;

  271.   border-bottom: .2vh solid #07486c;

  272. }

  273.   aside p {

  274.     max-width: 50rem;

  275.     margin: 0 auto;

  276.   }

  277. 

  278. /* https://fvsch.com/code/css-locks/ */

  279. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  280.   font-size: 1rem;

  281.   line-height: calc( 1.5em + 0.2 * 1rem );

  282. }

  283. h1 {

  284.   font-size: 1.9rem;

  285.   line-height: calc( 1.2em + 0.2 * 1rem );

  286. }

  287. h2 {

  288.   font-size: 1.6rem;

  289.   line-height: calc( 1.3em + 0.2 * 1rem );

  290. }

  291. h3 {

  292.   font-size: 1.35rem;

  293.   line-height: calc( 1.4em + 0.2 * 1rem );

  294. }

  295. @media (min-width: 20em) {

  296.   /* The (100vw - 20rem) / (50 - 20) part

  297.      resolves to 0-1rem, depending on the

  298.      viewport width (between 20em and 50em). */

  299.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  300.     font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );

  301.     line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );

  302.     margin-left: 0;

  303.   }

  304.   h1 {

  305.     font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  306.     line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );

  307.   }

  308.   h2 {

  309.     font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  310.     line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );

  311.   }

  312.   h3 {

  313.     font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  314.     line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );

  315.   }

  316. }

  317. @media (min-width: 50em) {

  318.   /* The right part of the addition *must* be a

  319.      rem value. In this example we *could* change

  320.      the whole declaration to font-size:2.5rem,

  321.      but if our baseline value was not expressed

  322.      in rem we would have to use calc. */

  323.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  324.     font-size: calc( 1rem + .6 * 1rem );

  325.     line-height: 1.5em;

  326.   }

  327.   p, li, pre, details {

  328.     margin-left: 3rem;

  329.   }

  330.   h1 {

  331.     font-size: calc( 1.9rem + 1.5 * 1rem );

  332.     line-height: 1.2em;

  333.   }

  334.   h2 {

  335.     font-size: calc( 1.5rem + 1.5 * 1rem );

  336.     line-height: 1.3em;

  337.   }

  338.   h3 {

  339.     font-size: calc( 1.35rem + 1.5 * 1rem );

  340.     line-height: 1.4em;

  341.   }

  342.   figure img {

  343.     max-width: 500px;

  344.     max-height: 500px;

  345.   }

  346. }

  347. 

  348. figure.unsquared {

  349.   margin-bottom: 1.5rem;

  350. }

  351.   figure.unsquared img {

  352.     height: inherit;

  353.   }

  354. 

  355. 

  356. 

  357. @media print {

  358.   body { font-size: 100%; }

  359.   a:after { content: " (" attr(href) ")"; }

  360.   a, a:link, a:visited, a:after {

  361.     text-decoration: underline;

  362.     text-shadow: none !important;

  363.     background-image: none !important;

  364.     background: white;

  365.     color: black;

  366.   }

  367.   abbr[title] { border-bottom: 0; }

  368.   abbr[title]:after { content: " (" attr(title) ")"; }

  369.   img { page-break-inside: avoid; }

  370.   @page { margin: 2cm .5cm; }

  371.   h1, h2, h3 { page-break-after: avoid; }

  372.   p3 { orphans: 3; widows: 3; }

  373.   img {

  374.     max-width: 250px !important;

  375.     max-height: 250px !important;

  376.   }

  377.   nav, aside { display: none; }

  378. }

  379. 

  380. ul.with_columns {

  381.   column-count: 1;

  382. }

  383. @media (min-width: 20em) {

  384.   ul.with_columns {

  385.     column-count: 2;

  386.   }

  387. }

  388. @media (min-width: 50em) {

  389.   ul.with_columns {

  390.     column-count: 3;

  391.   }

  392. }

  393. ul.with_two_columns {

  394.   column-count: 1;

  395. }

  396. @media (min-width: 20em) {

  397.   ul.with_two_columns {

  398.     column-count: 1;

  399.   }

  400. }

  401. @media (min-width: 50em) {

  402.   ul.with_two_columns {

  403.     column-count: 2;

  404.   }

  405. }

  406. 

  407. .gallery {

  408.   display: flex;

  409.   flex-wrap: wrap;

  410.   justify-content: space-around;

  411. }

  412.   .gallery figure img {

  413.     margin-left: 1rem;

  414.     margin-right: 1rem;

  415.   }

  416.   .gallery figure figcaption {

  417.     font-family: 'ConcourseT3'

  418.   }

  419. 

  420. footer {

  421.   font-family: 'ConcourseT3';

  422.   display: flex;

  423.   flex-direction: column;

  424.   border-top: 3px solid white;

  425.   padding: 4rem 0;

  426.   background-color: #07486c;

  427.   color: white;

  428. }

  429.   footer > * {

  430.     max-width: 50rem;

  431.     margin: 0 auto;

  432.   }

  433.   footer a {

  434.     color: #f1c40f;

  435.   }

  436.   footer .avatar {

  437.     width: 200px;

  438.     height: 200px;

  439.     border-radius: 50%;

  440.     float: left;

  441.     -webkit-shape-outside: circle();

  442.     shape-outside: circle();

  443.     margin-right: 2rem;

  444.     padding: 2px 5px 5px 2px;

  445.     background: white;

  446.     border-left: 1px solid #f1c40f;

  447.     border-top: 1px solid #f1c40f;

  448.     border-right: 5px solid #f1c40f;

  449.     border-bottom: 5px solid #f1c40f;

  450.   }

  451. </style>

  452. 

  453. <h1 class="single">

  454.   <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>

  455.   Désespérance

  456.   <time>Publié le 8 octobre</time>

  457. </h1>

  458. <article class="single">

  459.  <p><em>J’aime le rythme des saisons, je me demande ce que cela fait de vivre proche de l’équateur. L’impression que chaque jour se répète inlassablement. Dans quelle mesure la saisonnalité encourage la prise de recul ?</em></p>

  460. <hr />

  461. <blockquote>

  462. <p>Ernst Bloch avait identifié le « principe espérance » comme cette force dynamique qui fait avancer l’humanité en quête de progrès. Ce n’est alors pas sans raison, peut-être, que Bakhtine indiquait que les carnavals permettent l’expression des « espérances populaires ». Mais y a-t-il aussi, du côté des rebelles d’aujourd’hui, un « principe désespérance » qui pousse à agir même lorsque l’action paraît vaine, lorsque le rapport de force est si défavorablement asymétrique que la révolution est plus que jamais nécessaire, mais parait plus que jamais improbable, pour reprendre les mots du pamphlet <em>L’insurrection qui vient</em>, du Comité Invisible ?</p>

  463. <p>[…]</p>

  464. <p>Aujourd’hui, l’humanité est totalement étatisée, pour reprendre l’expression de Thomas Bernard. Résultat : une bonne partie des forces progressistes est incapable de penser l’« efficacité » politique autrement qu’en des termes étatiques : nombres de sièges au parlement, nouvelles politiques publiques, etc. Quant au capitalisme mondialisé, il s’insinue partout et ne se limite plus à l’exploitation du salariat, à la production de faux besoins et à l’intoxication de la vie intime. Il menace la vie sur terre, avec la complicité des gouvernements qui feignent de s’en émouvoir.</p>

  465. <p>Devant pareille catastrophe, l’espérance n’est plus de mise, mais la désespérance n’est pas nécessairement synonyme d’apathie. D’où l’expression : la rage du désespoir. D’où l’expression, également, de « pessimisme combatif » […]</p>

  466. <p><cite><em>Les nouveaux anarchistes</em>, Francis Dupuis-Déri</cite></p>

  467. </blockquote>

  468. <p>Pessimisme combatif. J’ai l’impression d’avoir le choix d’un peu trop de combats ces jours-ci.</p>

  469. <p><em>Niveau pessimisme ça devrait aller.</em></p>

  470. <hr />

  471. <blockquote>

  472. <p>Although I was intellectually quite well prepared for the birth of my first child, I was stunned by the degree of randomness that this event created in my life. It took me a while to understand that it was pointless to plan my days the way I used to. This did not mean that I didn’t plan or prearrange, but that I needed different schemes to deal with the unplannable.</p>

  473. <p>Women in particular have developed such schemes over the centuries—arrangements that are not a surrender to randomness, but an allotment of time and resources based on situational judgements. … What makes them so different is that holistic strategies are, more often than not, intended to minimize disaster rather than to maximize gain. (80)</p>

  474. <p>A crucial distinction here is the place of context. Attempts to minimize disaster require recognition and a profound understanding of context. Context is not considered as stable and invariant; on the contrary, every response induces a counter-response which changes the situation so that the next steps and decisions are taken within an altered context. Traditional planning, on the other hand, assumes a stable context and predictable responses. (81)</p>

  475. <p><cite><em><a href="https://lucascherkewski.com/study/franklin-production-growth/">Production and growth</a></em> (<a href="/david/cache/626adbe261881628b7e3f6b99e9faa2b/">cache</a>)</cite></p>

  476. </blockquote>

  477. <p>Je ne connaissais <a href="https://en.wikipedia.org/wiki/Ursula_Franklin">Ursula Franklin</a> que de nom et elle a l’avantage d’avoir une page wikipedia bien détaillée. <a href="https://lucascherkewski.com/hit-and-miss/108-models-decisions-action/">Merci Lucas !</a> (<a href="/david/cache/d0f1b7574e318f33044475fc134acc1b/">cache</a>)</p>

  478. <p>Limiter les dégâts plutôt que de gagner davantage que son prochain. Il y aurait un parallèle à faire autour de l’agilité et de ma génération de développeurs et développeuses qui est devenue parent.</p>

  479. <p><em>Coïncidence ?</em></p>

  480. <hr />

  481. <blockquote>

  482. <p>Ensuite que le travail de ces réseaux que l’on dit sociaux est avant tout de produire de la norme et de faire en sorte que ladite norme satisfasse au modèle économique de régie publicitaire qui est le leur. Et que tout le reste n’est que littérature. </p>

  483. <p>Or, à l’échelle d’une société, il existe plein de manières différentes de produire de la norme, de fabriquer des référents légitimes et d’en rendre d’autres illégitimes. La manière dont les réseaux sociaux fonctionnent aujourd’hui dès lors qu’ils ont à traiter de questions liées aux corps et à leur représentation dans l’espace public qu’ils circonscrivent au sein de leurs audiences plus ou moins captives, cette manière repose sur des effets de stigmatisation et de désignation (body shaming) qui hystérisent la visibilité de certains traits. Mais elle repose également de manière bien plus insidieuse, sournoise et, hélas efficace, sur notre besoin d’identification et d’appartenance sociale qui nous rend dociles à des effets d’invisibilisation toujours plus prégnants.</p>

  484. <p><cite><em><a href="https://www.affordance.info/mon_weblog/2019/10/cheveux-longs-et-algos-courts-.html">Cheveux longs et algos courts.</a></em> (<a href="/david/cache/2e11d24bb65486075d08637d8c753862/">cache</a>)</cite></p>

  485. </blockquote>

  486. <p>Produire de la norme, c’était l’objectif de la religion avant d’être celui de l’État. Seule une homogénéité est contrôlable (aujourd’hui on dit « influençable »).</p>

  487. <p><em>Fausses nouvelles, vraies vieilleries.</em></p>

  488. <hr />

  489. <blockquote>

  490. <p>The above quote yields a glimpse into my position on the entire matter: <em>stop focusing on the solution, and start focusing on the problem</em>. You probably know more about your specific problem than the people behind your “found” solutions do. It’s a reasonable approach to give this knowledge precedence over the unknown data that influenced the design decisions of others.</p>

  491. <p><cite><em><a href="https://www.the-haystack.com/2019/09/20/thinking-vs-choosing/">Thinking vs Choosing</a></em> (<a href="/david/cache/656cf1cb60d35d056c844d0364bc715d/">cache</a>)</cite></p>

  492. </blockquote>

  493. <p>Devenir la nouvelle mode sans être radicalement différent. Prendre le risque de perdre l’utilisateur·ice ou de guider une nouvelle tendance. L’arête est escarpée.</p>

  494. <p><em>Designer c’est douter.</em></p>

  495. <hr />

  496. <blockquote>

  497. <p>Some years ago I contacted them because a flaw had been found in TLS encryption that might be dangerous for them, and to my surprise no one there cared. They had been assuming their Internet traffic was being spied upon anyhow, and it turns they were right.</p>

  498. <p>Later they told me “we all use VPNs” and was impressed how privacy conscious they were. But no they told me, everyone does that, because without a VPN the internet here is too slow, they suspected the spying machinery was generally overloaded. The VPN was for speed. It was not assumed to deliver privacy, on which point they were also proven right (most VPN providers are pretty shady).</p>

  499. <p>I mention these two stories to show that our assumptions on oppressive regimes may be wildly off, and not represent the reality on the ground in China, Russia, Iran, Indonesia and Turkey. It is a lot of fun being an armchair imaginary political activist, but things are remarkably different if you actually live there.</p>

  500. <p><cite><em><a href="https://blog.powerdns.com/2019/09/25/centralised-doh-is-bad-for-privacy-in-2019-and-beyond/">Centralised DoH is bad for privacy, in 2019 and beyond</a></em> (<a href="/david/cache/f14ac41ec597f2a6af377eabaf6cc66b/">cache</a>)</cite></p>

  501. </blockquote>

  502. <p>Lorsque la réalité est fantasmée.</p>

  503. <hr />

  504. <blockquote>

  505. <p>L’engagement c’est comme le thé : quand il est trop fort, le veilleur perd sommeil ; et quand il est trop faible, il s’endort.</p>

  506. <p><cite><em>L’apprenti sage II</em>, Gilles Vigneault</cite></p>

  507. </blockquote>

  508. <p>J’aimerais parfois pouvoir m’arrêter de veiller. Est-ce qu’il suffit d’arrêter de boire du thé ?</p>

  509. <hr />

  510. <blockquote>

  511. <p>La Nature n’est ni un allié, ni un ennemi… Je me protégerai du vent, de la pluie et de la neige et j’allumerai un feu pour me réchauffer. Je ne laisserai ni la peur, ni la panique conquérir mon esprit car là se trouve le véritable ennemi. — Mors Kochanski</p>

  512. <p><cite><em><a href="https://fr.programmescoyote.com/survie-101/">Survie 101: Initiation au bushcraft et à la survie</a></em> (<a href="/david/cache/65bf25ec0293137659c10f1c75ef5171/">cache</a>)</cite></p>

  513. </blockquote>

  514. <p>J’ai participé à un atelier de (sur)vie en forêt. Avec des personnes qui ont une approche qui m’intéresse. Cela m’a permis de prendre conscience des connaissances/expériences accumulées dans le domaine. Peut-être qu’il serait temps que je tente de transmettre cela ? Je ne sais pas encore quelle forme est-ce que cela pourrait prendre. J’ai l’impression qu’il y a un intérêt croissant pour le domaine, un peu comme l’auto-défense fut un temps.</p>

  515. <p>Emblématique des peurs d’une époque donnée.</p>

  516. <blockquote>

  517. <p>If you have some power, then your job is to empower somebody else.</p>

  518. <p><cite><em>Toni Morrison cité dans « <a href="https://adactio.com/journal/15740">The Weight of the WWWorld is Up to Us by Patty Toland</a> »</em> (<a href="/david/cache/c6e4ebb566c5d74a7e0d340a8771165c/">cache</a>)</cite></p>

  519. </blockquote>

  520. <hr />

  521. <blockquote>

  522. <p>In June 2014, Apple announced that development of Aperture has been discontinued. Since then, Apple has released six major macOS upgrades. For technical reasons, macOS Mojave is the last version of macOS to run Aperture. Starting with macOS Catalina, Aperture is no longer compatible with macOS.</p>

  523. <p><cite><em><a href="https://support.apple.com/en-ca/HT209594">Migrate Aperture libraries to the Photos app or Adobe Lightroom Classic</a></em> (<a href="/david/cache/91c8217bf968020e5c4b17de70c48ffe/">cache</a>)</cite></p>

  524. </blockquote>

  525. <p>Apple m’indique qu’Aperture ne se lancera même plus à la prochaine version de macOS. Je procrastine depuis cinq ans sur le sujet sans trouver d’alternative valable (et je voulais bien sûr faire un tri avant…). Quand je vois les bugs de iCloud + Photos.app par ailleurs je ne peux considérer cette option comme étant (v|f)iable. J’hésite à tout exporter en jpeg dans un coin en attendant mieux, c’est peut-être le format qui sera le plus longtemps supporté.</p>

  526. <p>Il y a déjà deux autres outils que j’utilise qui mentionnent une migration potentiellement difficile. Plus grande sera la friction, plus motivé je serai à aller voir ailleurs.</p>

  527. <p><em>Ravi.</em></p>

  528. </article>

  529. 

  530. 

  531. <nav id="jumpto">

  532.   <p>

  533.     <a rel=prev href="/david/stream/2019/10/01/">← Présent</a> | <a href="/david/stream/2019/" title="Retour à la liste complète">↑ Liste complète</a> | <a  rel=next href="/david/stream/2019/10/15/">Discrétion →</a>

  534.   </p>

  535. </nav>

  536. 

  537. <footer>

  538.   <div>

  539.     <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">

  540.     <p>

  541.       Bonjour/Hi!

  542.       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>

  543.       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>).

  544.     </p>

  545.     <p>

  546.       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>.

  547.     </p>

  548.     

  549.       <p>

  550.         Les dernières publications hebdomadaires sont :

  551.       </p>

  552.       <ul class="with_columns">

  553.         

  554.           <li>

  555.             <a href="/david/stream/2019/12/31/">Merci</a>

  556.           </li>

  557.         

  558.           <li>

  559.             <a href="/david/stream/2019/12/27/">Intemporels</a>

  560.           </li>

  561.         

  562.           <li>

  563.             <a href="/david/stream/2019/12/24/">Outils</a>

  564.           </li>

  565.         

  566.           <li>

  567.             <a href="/david/stream/2019/12/17/">Origines</a>

  568.           </li>

  569.         

  570.           <li>

  571.             <a href="/david/stream/2019/12/10/">Publier</a>

  572.           </li>

  573.         

  574.           <li>

  575.             <a href="/david/stream/2019/12/03/">En forêt</a>

  576.           </li>

  577.         

  578.           <li>

  579.             <a href="/david/stream/2019/11/26/">Ecocentric</a>

  580.           </li>

  581.         

  582.           <li>

  583.             <a href="/david/stream/2019/11/19/">Se livrer</a>

  584.           </li>

  585.         

  586.           <li>

  587.             <a href="/david/stream/2019/11/12/">Dépendances</a>

  588.           </li>

  589.         

  590.           <li>

  591.             <a href="/david/stream/2019/11/05/">Positif</a>

  592.           </li>

  593.         

  594.           <li>

  595.             <a href="/david/stream/2019/10/29/">Dettes</a>

  596.           </li>

  597.         

  598.           <li>

  599.             <a href="/david/stream/2019/10/22/">Privilèges</a>

  600.           </li>

  601.         

  602.           <li>

  603.             <a href="/david/stream/2019/10/15/">Discrétion</a>

  604.           </li>

  605.         

  606.           <li>

  607.             <a href="/david/stream/2019/10/08/">Désespérance</a>

  608.           </li>

  609.         

  610.           <li>

  611.             <a href="/david/stream/2019/10/01/">Présent</a>

  612.           </li>

  613.         

  614.           <li>

  615.             <a href="/david/stream/2019/09/24/">Manifester</a>

  616.           </li>

  617.         

  618.           <li>

  619.             <a href="/david/stream/2019/09/17/">Arpenter</a>

  620.           </li>

  621.         

  622.           <li>

  623.             <a href="/david/stream/2019/09/10/">Nostalgie</a>

  624.           </li>

  625.         

  626.           <li>

  627.             <a href="/david/stream/2019/09/03/">Déconstruire</a>

  628.           </li>

  629.         

  630.           <li>

  631.             <a href="/david/stream/2019/08/27/">Documenter</a>

  632.           </li>

  633.         

  634.           <li>

  635.             <a href="/david/stream/2019/08/20/">Frustration</a>

  636.           </li>

  637.         

  638.           <li>

  639.             <a href="/david/stream/2019/08/13/">Holisme</a>

  640.           </li>

  641.         

  642.           <li>

  643.             <a href="/david/stream/2019/08/06/">1%</a>

  644.           </li>

  645.         

  646.           <li>

  647.             <a href="/david/stream/2019/07/30/">Exemplarité</a>

  648.           </li>

  649.         

  650.           <li>

  651.             <a href="/david/stream/2019/07/23/">Timelines</a>

  652.           </li>

  653.         

  654.           <li>

  655.             <a href="/david/stream/2019/07/16/">Écoute</a>

  656.           </li>

  657.         

  658.           <li>

  659.             <a href="/david/stream/2019/07/02/">Anxiété</a>

  660.           </li>

  661.         

  662.           <li>

  663.             <a href="/david/stream/2019/06/21/">À lier</a>

  664.           </li>

  665.         

  666.           <li>

  667.             <a href="/david/stream/2019/06/14/">Pauvreté</a>

  668.           </li>

  669.         

  670.           <li>

  671.             <a href="/david/stream/2019/06/07/">Amateur</a>

  672.           </li>

  673.         

  674.           <li>

  675.             <a href="/david/stream/2019/05/31/">Pollution</a>

  676.           </li>

  677.         

  678.           <li>

  679.             <a href="/david/stream/2019/05/24/">Apaisement</a>

  680.           </li>

  681.         

  682.           <li>

  683.             <a href="/david/stream/2019/05/10/">Folie</a>

  684.           </li>

  685.         

  686.           <li>

  687.             <a href="/david/stream/2019/05/03/">Sympathie</a>

  688.           </li>

  689.         

  690.           <li>

  691.             <a href="/david/stream/2019/04/12/">Péremption</a>

  692.           </li>

  693.         

  694.           <li>

  695.             <a href="/david/stream/2019/04/05/">Définitions</a>

  696.           </li>

  697.         

  698.           <li>

  699.             <a href="/david/stream/2019/03/29/">Acceptation</a>

  700.           </li>

  701.         

  702.           <li>

  703.             <a href="/david/stream/2019/03/22/">Dissonance</a>

  704.           </li>

  705.         

  706.           <li>

  707.             <a href="/david/stream/2019/03/15/">Reconnaissance</a>

  708.           </li>

  709.         

  710.           <li>

  711.             <a href="/david/stream/2019/03/08/">Lecture</a>

  712.           </li>

  713.         

  714.           <li>

  715.             <a href="/david/stream/2019/03/01/">Journaux</a>

  716.           </li>

  717.         

  718.           <li>

  719.             <a href="/david/stream/2019/02/22/">Écriture</a>

  720.           </li>

  721.         

  722.           <li>

  723.             <a href="/david/stream/2019/02/15/">Kyriarchie</a>

  724.           </li>

  725.         

  726.           <li>

  727.             <a href="/david/stream/2019/02/08/">Mots-serrures</a>

  728.           </li>

  729.         

  730.           <li>

  731.             <a href="/david/stream/2019/02/01/">Sans voie</a>

  732.           </li>

  733.         

  734.           <li>

  735.             <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>

  736.           </li>

  737.         

  738.           <li>

  739.             <a href="/david/stream/2019/01/18/">Agilité</a>

  740.           </li>

  741.         

  742.           <li>

  743.             <a href="/david/stream/2019/01/11/">Métaphores</a>

  744.           </li>

  745.         

  746.           <li>

  747.             <a href="/david/stream/2019/01/04/">Balbutiements</a>

  748.           </li>

  749.         

  750.       </ul>

  751.     

  752.     <p>

  753.       Voici quelques articles choisis :

  754.       <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,

  755.       <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,

  756.       <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,

  757.       <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,

  758.       <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,

  759.       <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,

  760.       <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,

  761.       <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,

  762.       <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,

  763.       <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,

  764.       <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,

  765.       <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,

  766.       <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,

  767.       <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,

  768.       <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,

  769.       et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>

  770.     </p>

  771.     <p>

  772.       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>.

  773.     </p>

  774.     <p>

  775.       Je ne traque pas ta navigation mais mon

  776.       <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>

  777.       conserve des logs d’accès.

  778.     </p>

  779.   </div>

  780. </footer>

  781. <script type="text/javascript">

  782.   ;(_ => {

  783.     const jumper = document.getElementById('jumper')

  784.     jumper.addEventListener('click', e => {

  785.       e.preventDefault()

  786.       const anchor = e.target.getAttribute('href')

  787.       const targetEl = document.getElementById(anchor.substring(1))

  788.       targetEl.scrollIntoView({behavior: 'smooth'})

  789.     })

  790.   })()

  791. </script>

  792. 

  793.   <script>

  794.   /* Service workers */

  795.   if (navigator.serviceWorker) {

  796.     window.addEventListener('load', function () {

  797.       var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'

  798.       function sendLinks (selector) {

  799.         var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {

  800.           return link.getAttribute('href')

  801.         })

  802.         links.push(location.pathname)  // Put the current page in cache too.

  803.         navigator.serviceWorker.controller.postMessage({ links: links })

  804.       }

  805.       navigator.serviceWorker.getRegistration()

  806.         .then(function (registration) {

  807.           if (!registration || !navigator.serviceWorker.controller) {

  808.             return navigator.serviceWorker.register('/serviceworker.js')

  809.               .then(navigator.serviceWorker.ready)

  810.               .then(function () {

  811.                 console.log('[ServiceWorker] Ready to go!')

  812.               })

  813.               .catch(console.error.bind(console))

  814.           } else {

  815.             console.log('[ServiceWorker] Send links via registration')

  816.             sendLinks(selector)

  817.           }

  818.         })

  819.       navigator.serviceWorker.addEventListener('controllerchange', function () {

  820.         console.log('[ServiceWorker] Send links via controller change')

  821.         sendLinks(selector)

  822.       })

  823.       navigator.serviceWorker.addEventListener('message', function (event) {

  824.         var link = document.querySelector('a[href="' + event.data.link + '"]')

  825.         if (event.data.status && link) {

  826.           link.style.backgroundColor = '#2d7474'

  827.           link.style.color = '#f0f0ea'

  828.           

  829.             link.setAttribute('title', 'En cache pour consultation sans connexion')

  830.           

  831.         }

  832.       })

  833.     })

  834.   } else {

  835.     console.warn('[ServiceWorker] No cache for old browsers.')

  836.   }

  837. </script>