davidbgk
/
larlet-fr-david
ウォッチ 1
スター 0
フォーク 0
コード リリース 0 アクティビティ
Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
25 コミット
1 ブランチ
ツリー: b3b1e845eb
ブランチ タグ
${ item.name }
ブランチ ${ searchTerm } を作成
'b3b1e845eb' から
${ noResults }
larlet-fr-david/david/stream/2019/02/01/index.html

index.html 33KB
Raw Blame 履歴

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804 
  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>Sans voie — 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/02/01/">

  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.   Sans voie

  456.   <time>Publié le 1 février</time>

  457. </h1>

  458. <article class="single">

  459.  <p><em>Cela m’intéresse d’avoir vos retours sur cette formule hebdomadaire. Notamment si une <a href="/david/stream/2018/12/31/">liste de diffusion</a> vous faciliterait la vie.</em></p>

  460. <blockquote>

  461. <p>We were caught off guard by surveillance capitalism because there was no way that we could have imagined its action, any more than the early peoples of the Caribbean could have foreseen the rivers of blood that would flow from their hospitality toward the sailors who appeared out of thin air waving the banner of the Spanish monarchs. Like the Caribbean people, we faced something truly unprecedented.</p>

  462. <p>Once we searched Google, but now Google searches us. Once we thought of digital services as free, but now surveillance capitalists think of us as free.</p>

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

  464. <p>The result is that these new knowledge territories become the subject of political conflict. The first conflict is over the distribution of knowledge: “Who knows?” The second is about authority: “Who decides who knows?” The third is about power: “Who decides who decides who knows?”</p>

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

  466. <p>Surveillance capitalism moves from a focus on individual users to a focus on populations, like cities, and eventually on society as a whole. Think of the capital that can be attracted to futures markets in which population predictions evolve to approximate certainty.</p>

  467. <p><cite><em><a href="https://www.theguardian.com/technology/2019/jan/20/shoshana-zuboff-age-of-surveillance-capitalism-google-facebook">“The goal is to automate us”: welcome to the age of surveillance capitalism</a></em> (<a href="/david/cache/4a2353c0bf9b33642f6a2badcef58d25/">cache</a>)</cite></p>

  468. </blockquote>

  469. <p>Incroyable interview de Shoshana Zuboff. Alors on va prendre cet article et le mélanger avec cette hypothèse saugrenue :</p>

  470. <blockquote>

  471. <p>Let’s say for a moment that I am a billionaire. I am an intelligent person with a top flight education. I believe that I got to where I am through hard work, and because of my libertarian streak, I espouse that free markets could make anyone like me of course, that is if the competition can outwit my competitive instinct to crush them. I didn’t get to where I am by running a charity. I believe in social darwinism. While I won’t call it white supremacy, there are those among us smarter and more capable than others.</p>

  472. <p>Because I am a billionaire, I have access to all the latest intel, and even though I have my suspicions about academics — with their constant asking for grants — it’s pretty clear that climate change is coming… more importantly, climate change will be good for business.</p>

  473. <p>As a billionaire, I can find the cities that will be least affected and invest heavily in them with massive tax breaks. I can also make sure to build my future homes and enclaves in places that are protected from the worst of it. Given that my intellect and hard-earned wealth will give me shelter from the coming storm, I really only have to worry about the effect it will have on my business.</p>

  474. <p>If I made my fortune in fossil fuels, the answer is simple — I must deny climate change because, as the poorer nations collapse, I will be given leave to drill everywhere in the united states I have been denied — along with fracking — to preserve continuity in our way of life that effort alone will make the US the world’s biggest oil producer in perpetuity. Climate-based social and economic collapse in South America, Africa, and the middle east is good for my business. Not to mention that the increased pressure on the world’s economy will most likely have a dampening effect on the sustainable competition. Fossil fuels are the existing infrastructure and the focus during a global emergency should be to protect what is already there instead of taking chances on new tech.</p>

  475. <p>If I am in any other business, climate change is very good for my bottom line: the dead and displaced were never going to be my customers anyway (how many people have amazon prime in cities like homs, anyway?), those who suffer economic collapse can always come work for me… on my terms of course.</p>

  476. <p>The best part of the coming long emergency is that the worse things get in terms of catastrophic damage, food instability, and economic instability, the more opportunity there will be for my businesses to get valuable reconstruction and infrastructure repair contracts.</p>

  477. <p>Also, the more catastrophic the damage, the more of a blank slate we get to circumvent local, regional, and national regulations on trade, manufacturing, and commerce. Governments in crisis, and regulatory agencies, don’t recover as quickly as my agile, anti-fragile companies. So those places that have not been destroyed will easily become havens for my factories and server farms, and I will have my pick of the desperate labor pool. As Ming the merciless famously said “they will be happy with less.”</p>

  478. <p>The social pressures exerted on the planet will be good for business — as the “haves” feel more encroached upon by the “have nots,” they will back authoritarian regimes that promise to protect their moneys, assets, and entitlements authoritarian governments are far easier to make deals with than heavily regulated democracies; not to mention that the larger military presence necessary for authoritarianism is good for business. Military contracts are especially opaque and lacking oversight. And let’s face it, as a self-made billionaire who never asked for favors and got here through sheer intellect hard work, I may not be — in my more fanciful moments — beyond the thought that a ”natural” culling may not be the worst thing for free markets or the global gene pool.</p>

  479. <p>Which leads me to quietly fund climate change denial conferences and pressure groups, and let the world go its way without using my power and influence for change (the odd philanthropic gesture here and there will always be good to keep the bleeding hearts from catching on). Disaster is good for billionaires and their businesses. Disaster cleanses, purifies, simplifies, and, if your immediate needs and your business infrastructure is protected, it creates something far more valuable… it creates opportunities and removes obstacles.</p>

  480. <p>I dunno, just a thought.</p>

  481. <p><cite><em><a href="https://twitter.com/OKBJGM/status/1088171717845868545">Javi Grillo-Marxuach on Twitter</a></em></cite></p>

  482. </blockquote>

  483. <p>Complotisme ! Lucidité ? En tout cas ça pique… et ça donne une perspective sur la situation actuelle et future. Tout renforcement des inégalités ne fera qu’aggraver notre rapport au climat au devant duquel nous ne sommes pas tous égaux. Où est <a href="https://www.monde-diplomatique.fr/2019/01/BONELLI/59444">l’obligation morale</a> (<a href="/david/cache/190fadf71b05aed7dcc2514935791178/">cache</a>) lorsque les forces deviennent aussi inégales ? Quel intérêt à soutenir une réciprocité lorsque des facteurs externes vont de toute façon déstabiliser l’ordre social ?</p>

  484. <p>La beauté du capitalisme est de mettre un prix <em>et</em> un mot sur chaque chose. Une étiquette qui permette de l’oublier, de passer à autre chose.</p>

  485. <p><em>De vivre avec.</em></p>

  486. <blockquote>

  487. <p>L’écriture fut l’un des mystères originels de la civilisation, elle permit de réduire la complexité de l’expérience au mot écrit. En outre, l’écriture fournit à la classe dirigeante un instrument idéologique d’une puissance considérable. La parole divine devint loi, relayée par les prêtres ; c’est pourquoi, dirent les Iroquois, confrontant les Européens : ‘L’écriture est l’invention du Diable’. Avec l’avènement de l’écriture, les symboles devinrent explicites, et perdirent immédiatement leur profondeur. Dès lors, la parole de l’homme n’était plus une éternelle exploration du réel, mais un signe qui pouvait être utilisé contre lui. […] Car l’écrit sépare la conscience en deux — il devient plus légitime que la parole, détruisant ainsi le sens du discours et érodant la tradition orale ; et il rend possible l’utilisation des mots pour manipuler politiquement et contrôler les autres. L’écrit supplante la mémoire ; une version officielle des événements, fixe et permanente peut être élaborée. Si c’est écrit, dans les civilisations anciennes [et j’ajouterai, aujourd’hui], c’est que ça doit être vrai.</p>

  488. <p><cite>Stanley Diamond cité dans <em><a href="http://partage-le.com/2018/11/endgame-vol-1-civilisation-par-derrick-jensen/">Endgame Vol.1 : Civilisation (par Derrick Jensen)</a></em> (<a href="/david/cache/8692b22578a8044c1a944bf6dc53d5d2/">cache</a>)</cite></p>

  489. </blockquote>

  490. <p>Mais en contrepartie, se retenir d’écrire c’est laisser l’attention à d’autres. C’est perdre cette capacité à se comprendre avec un langage commun. C’est verbaliser nos oppressions pour mieux les comprendre, les partager et les combattre. C’est nommer l’innommable.</p>

  491. <p><em>(D)Écrire est un acte politique.</em></p>

  492. <blockquote>

  493. <p>Voler au sujet sa capacité d’énonciation n’est donc pas suffisant. Ce qu’il faut voler, c’est la condition de possibilité de cette énonciation, sa dynamique de conscientisation. Premier grand processus de la domination : « priver de langage les dominés ». L’opération d’usurpation ne réussissant pas toujours, la prise de conscience émerge. Pour s’assurer la durabilité de la domination, il faut alors provoquer chez le sujet un sentiment de désolation, qui prend l’apparence d’une individuation inversée, dans la mesure où le sujet se sent abandonné, seul de son espèce, sans capacité de faire lient avec d’autres sujets partageant la même expérience. Le sujet ne parvient pas à élaborer cette idée d’une expérience commune d’injustice.</p>

  494. <p><cite><em>Les irremplaçables</em>, Cynthia Fleury</cite></p>

  495. </blockquote>

  496. <p>Comment prendre conscience collectivement lorsque les outils sont contrôlés ? Comment transmettre des messages alors que ceux-ci sont soigneusement sélectionnés ? Comment être le media sans <em>faire</em> le media ?</p>

  497. <p>Collecter pour lier. Brouillonner pour éclaircir. Écrire pour être.</p>

  498. <blockquote>

  499. <p>Écrire, cela permet de tenir, avant de retenir. Tenir la distance. Distance dans la durée : endurer de me taire, d’enfermer les émotions en mon for intérieur. Distance  dans l’espace entre les élèves et moi, pour leur laisser de la place, sans l’occuper d’emblée de ma propre puissance.</p>

  500. <p><cite><em><a href="http://www.lettresvives.org/2019/01/30/enseigner-et-tenir-un-journal-de-bord-2/">Enseigner et tenir un journal de bord (2)</a></em> (<a href="/david/cache/faca46586ac0eee2aad2c23a63e39159/">cache</a>)</cite></p>

  501. </blockquote>

  502. <p><em>Publier pour devenir ?</em></p>

  503. </article>

  504. 

  505. 

  506. <nav id="jumpto">

  507.   <p>

  508.     <a rel=prev href="/david/stream/2019/01/25/">← Auto-diagnostic</a> | <a href="/david/stream/2019/" title="Retour à la liste complète">↑ Liste complète</a> | <a  rel=next href="/david/stream/2019/02/08/">Mots-serrures →</a>

  509.   </p>

  510. </nav>

  511. 

  512. <footer>

  513.   <div>

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

  515.     <p>

  516.       Bonjour/Hi!

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

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

  519.     </p>

  520.     <p>

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

  522.     </p>

  523.     

  524.       <p>

  525.         Les dernières publications hebdomadaires sont :

  526.       </p>

  527.       <ul class="with_columns">

  528.         

  529.           <li>

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

  531.           </li>

  532.         

  533.           <li>

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

  535.           </li>

  536.         

  537.           <li>

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

  539.           </li>

  540.         

  541.           <li>

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

  543.           </li>

  544.         

  545.           <li>

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

  547.           </li>

  548.         

  549.           <li>

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

  551.           </li>

  552.         

  553.           <li>

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

  555.           </li>

  556.         

  557.           <li>

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

  559.           </li>

  560.         

  561.           <li>

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

  563.           </li>

  564.         

  565.           <li>

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

  567.           </li>

  568.         

  569.           <li>

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

  571.           </li>

  572.         

  573.           <li>

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

  575.           </li>

  576.         

  577.           <li>

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

  579.           </li>

  580.         

  581.           <li>

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

  583.           </li>

  584.         

  585.           <li>

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

  587.           </li>

  588.         

  589.           <li>

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

  591.           </li>

  592.         

  593.           <li>

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

  595.           </li>

  596.         

  597.           <li>

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

  599.           </li>

  600.         

  601.           <li>

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

  603.           </li>

  604.         

  605.           <li>

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

  607.           </li>

  608.         

  609.           <li>

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

  611.           </li>

  612.         

  613.           <li>

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

  615.           </li>

  616.         

  617.           <li>

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

  619.           </li>

  620.         

  621.           <li>

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

  623.           </li>

  624.         

  625.           <li>

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

  627.           </li>

  628.         

  629.           <li>

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

  631.           </li>

  632.         

  633.           <li>

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

  635.           </li>

  636.         

  637.           <li>

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

  639.           </li>

  640.         

  641.           <li>

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

  643.           </li>

  644.         

  645.           <li>

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

  647.           </li>

  648.         

  649.           <li>

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

  651.           </li>

  652.         

  653.           <li>

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

  655.           </li>

  656.         

  657.           <li>

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

  659.           </li>

  660.         

  661.           <li>

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

  663.           </li>

  664.         

  665.           <li>

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

  667.           </li>

  668.         

  669.           <li>

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

  671.           </li>

  672.         

  673.           <li>

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

  675.           </li>

  676.         

  677.           <li>

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

  679.           </li>

  680.         

  681.           <li>

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

  683.           </li>

  684.         

  685.           <li>

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

  687.           </li>

  688.         

  689.           <li>

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

  691.           </li>

  692.         

  693.           <li>

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

  695.           </li>

  696.         

  697.           <li>

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

  699.           </li>

  700.         

  701.           <li>

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

  703.           </li>

  704.         

  705.           <li>

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

  707.           </li>

  708.         

  709.           <li>

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

  711.           </li>

  712.         

  713.           <li>

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

  715.           </li>

  716.         

  717.       </ul>

  718.     

  719.     <p>

  720.       Voici quelques articles choisis :

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  737.     </p>

  738.     <p>

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

  740.     </p>

  741.     <p>

  742.       Je ne traque pas ta navigation mais mon

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

  744.       conserve des logs d’accès.

  745.     </p>

  746.   </div>

  747. </footer>

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

  749.   ;(_ => {

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

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

  752.       e.preventDefault()

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

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

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

  756.     })

  757.   })()

  758. </script>

  759. 

  760.   <script>

  761.   /* Service workers */

  762.   if (navigator.serviceWorker) {

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

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

  765.       function sendLinks (selector) {

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

  767.           return link.getAttribute('href')

  768.         })

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

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

  771.       }

  772.       navigator.serviceWorker.getRegistration()

  773.         .then(function (registration) {

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

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

  776.               .then(navigator.serviceWorker.ready)

  777.               .then(function () {

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

  779.               })

  780.               .catch(console.error.bind(console))

  781.           } else {

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

  783.             sendLinks(selector)

  784.           }

  785.         })

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

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

  788.         sendLinks(selector)

  789.       })

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

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

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

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

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

  795.           

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

  797.           

  798.         }

  799.       })

  800.     })

  801.   } else {

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

  803.   }

  804. </script>