A place to cache linked articles (think custom and personal wayback machine)
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 28KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677
  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>C’est pratique (archive) — 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. <meta name="robots" content="noindex, nofollow">
  28. <meta content="origin-when-cross-origin" name="referrer">
  29. <!-- Canonical URL for SEO purposes -->
  30. <link rel="canonical" href="http://blog.ecologie-politique.eu/post/C-est-pratique">
  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. /* http://practicaltypography.com/equity.html */
  67. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  68. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  69. @font-face {
  70. font-family: 'EquityTextB';
  71. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  72. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  73. font-weight: 300;
  74. font-style: normal;
  75. font-display: swap;
  76. }
  77. @font-face {
  78. font-family: 'EquityTextB';
  79. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  80. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  81. font-weight: 300;
  82. font-style: italic;
  83. font-display: swap;
  84. }
  85. @font-face {
  86. font-family: 'EquityTextB';
  87. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  88. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  89. font-weight: 700;
  90. font-style: normal;
  91. font-display: swap;
  92. }
  93. @font-face {
  94. font-family: 'ConcourseT3';
  95. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  96. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  97. font-weight: 300;
  98. font-style: normal;
  99. font-display: swap;
  100. }
  101. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  102. body {
  103. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  104. font-family: "EquityTextB", Palatino, serif;
  105. background-color: #f0f0ea;
  106. color: #07486c;
  107. font-kerning: normal;
  108. -moz-osx-font-smoothing: grayscale;
  109. -webkit-font-smoothing: subpixel-antialiased;
  110. text-rendering: optimizeLegibility;
  111. font-variant-ligatures: common-ligatures contextual;
  112. font-feature-settings: "kern", "liga", "clig", "calt";
  113. }
  114. pre, code, kbd, samp, var, tt {
  115. font-family: 'TriplicateT4c', monospace;
  116. }
  117. em {
  118. font-style: italic;
  119. color: #323a45;
  120. }
  121. strong {
  122. font-weight: bold;
  123. color: black;
  124. }
  125. nav {
  126. background-color: #323a45;
  127. color: #f0f0ea;
  128. display: flex;
  129. justify-content: space-around;
  130. padding: 1rem .5rem;
  131. }
  132. nav:last-child {
  133. border-bottom: 1vh solid #2d7474;
  134. }
  135. nav a {
  136. color: #f0f0ea;
  137. }
  138. nav abbr {
  139. border-bottom: 1px dotted white;
  140. }
  141. h1 {
  142. border-top: 1vh solid #2d7474;
  143. border-bottom: .2vh dotted #2d7474;
  144. background-color: #e3e1e1;
  145. color: #323a45;
  146. text-align: center;
  147. padding: 5rem 0 4rem 0;
  148. width: 100%;
  149. font-family: 'ConcourseT3';
  150. display: flex;
  151. flex-direction: column;
  152. }
  153. h1.single {
  154. padding-bottom: 10rem;
  155. }
  156. h1 span {
  157. position: absolute;
  158. top: 1vh;
  159. left: 20%;
  160. line-height: 0;
  161. }
  162. h1 span a {
  163. line-height: 1.7;
  164. padding: 1rem 1.2rem .6rem 1.2rem;
  165. border-radius: 0 0 6% 6%;
  166. background: #2d7474;
  167. font-size: 1.3rem;
  168. color: white;
  169. text-decoration: none;
  170. }
  171. h2 {
  172. margin: 4rem 0 1rem;
  173. border-top: .2vh solid #2d7474;
  174. padding-top: 1vh;
  175. }
  176. h3 {
  177. text-align: center;
  178. margin: 3rem 0 .75em;
  179. }
  180. hr {
  181. height: .4rem;
  182. width: .4rem;
  183. border-radius: .4rem;
  184. background: #07486c;
  185. margin: 2.5rem auto;
  186. }
  187. time {
  188. display: bloc;
  189. margin-left: 0 !important;
  190. }
  191. ul, ol {
  192. margin: 2rem;
  193. }
  194. ul {
  195. list-style-type: square;
  196. }
  197. a {
  198. text-decoration-skip-ink: auto;
  199. text-decoration-thickness: 0.05em;
  200. text-underline-offset: 0.09em;
  201. }
  202. article {
  203. max-width: 50rem;
  204. display: flex;
  205. flex-direction: column;
  206. margin: 2rem auto;
  207. }
  208. article.single {
  209. border-top: .2vh dotted #2d7474;
  210. margin: -6rem auto 1rem auto;
  211. background: #f0f0ea;
  212. padding: 2rem;
  213. }
  214. article p:last-child {
  215. margin-bottom: 1rem;
  216. }
  217. p {
  218. padding: 0 .5rem;
  219. margin-left: 3rem;
  220. }
  221. p + p,
  222. figure + p {
  223. margin-top: 2rem;
  224. }
  225. blockquote {
  226. background-color: #e3e1e1;
  227. border-left: .5vw solid #2d7474;
  228. display: flex;
  229. flex-direction: column;
  230. align-items: center;
  231. padding: 1rem;
  232. margin: 1.5rem;
  233. }
  234. blockquote cite {
  235. font-style: italic;
  236. }
  237. blockquote p {
  238. margin-left: 0;
  239. }
  240. figure {
  241. border-top: .2vh solid #2d7474;
  242. background-color: #e3e1e1;
  243. text-align: center;
  244. padding: 1.5rem 0;
  245. margin: 1rem 0 0;
  246. font-size: 1.5rem;
  247. width: 100%;
  248. }
  249. figure img {
  250. max-width: 250px;
  251. max-height: 250px;
  252. border: .5vw solid #323a45;
  253. padding: 1px;
  254. }
  255. figcaption {
  256. padding: 1rem;
  257. line-height: 1.4;
  258. }
  259. aside {
  260. display: flex;
  261. flex-direction: column;
  262. background-color: #e3e1e1;
  263. padding: 1rem 0;
  264. border-bottom: .2vh solid #07486c;
  265. }
  266. aside p {
  267. max-width: 50rem;
  268. margin: 0 auto;
  269. }
  270. /* https://fvsch.com/code/css-locks/ */
  271. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  272. font-size: 1rem;
  273. line-height: calc( 1.5em + 0.2 * 1rem );
  274. }
  275. h1 {
  276. font-size: 1.9rem;
  277. line-height: calc( 1.2em + 0.2 * 1rem );
  278. }
  279. h2 {
  280. font-size: 1.6rem;
  281. line-height: calc( 1.3em + 0.2 * 1rem );
  282. }
  283. h3 {
  284. font-size: 1.35rem;
  285. line-height: calc( 1.4em + 0.2 * 1rem );
  286. }
  287. @media (min-width: 20em) {
  288. /* The (100vw - 20rem) / (50 - 20) part
  289. resolves to 0-1rem, depending on the
  290. viewport width (between 20em and 50em). */
  291. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  292. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  293. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  294. margin-left: 0;
  295. }
  296. h1 {
  297. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  298. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  299. }
  300. h2 {
  301. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  302. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  303. }
  304. h3 {
  305. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  306. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  307. }
  308. }
  309. @media (min-width: 50em) {
  310. /* The right part of the addition *must* be a
  311. rem value. In this example we *could* change
  312. the whole declaration to font-size:2.5rem,
  313. but if our baseline value was not expressed
  314. in rem we would have to use calc. */
  315. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  316. font-size: calc( 1rem + .6 * 1rem );
  317. line-height: 1.5em;
  318. }
  319. p, li, pre, details {
  320. margin-left: 3rem;
  321. }
  322. h1 {
  323. font-size: calc( 1.9rem + 1.5 * 1rem );
  324. line-height: 1.2em;
  325. }
  326. h2 {
  327. font-size: calc( 1.5rem + 1.5 * 1rem );
  328. line-height: 1.3em;
  329. }
  330. h3 {
  331. font-size: calc( 1.35rem + 1.5 * 1rem );
  332. line-height: 1.4em;
  333. }
  334. figure img {
  335. max-width: 500px;
  336. max-height: 500px;
  337. }
  338. }
  339. figure.unsquared {
  340. margin-bottom: 1.5rem;
  341. }
  342. figure.unsquared img {
  343. height: inherit;
  344. }
  345. @media print {
  346. body { font-size: 100%; }
  347. a:after { content: " (" attr(href) ")"; }
  348. a, a:link, a:visited, a:after {
  349. text-decoration: underline;
  350. text-shadow: none !important;
  351. background-image: none !important;
  352. background: white;
  353. color: black;
  354. }
  355. abbr[title] { border-bottom: 0; }
  356. abbr[title]:after { content: " (" attr(title) ")"; }
  357. img { page-break-inside: avoid; }
  358. @page { margin: 2cm .5cm; }
  359. h1, h2, h3 { page-break-after: avoid; }
  360. p3 { orphans: 3; widows: 3; }
  361. img {
  362. max-width: 250px !important;
  363. max-height: 250px !important;
  364. }
  365. nav, aside { display: none; }
  366. }
  367. ul.with_columns {
  368. column-count: 1;
  369. }
  370. @media (min-width: 20em) {
  371. ul.with_columns {
  372. column-count: 2;
  373. }
  374. }
  375. @media (min-width: 50em) {
  376. ul.with_columns {
  377. column-count: 3;
  378. }
  379. }
  380. ul.with_two_columns {
  381. column-count: 1;
  382. }
  383. @media (min-width: 20em) {
  384. ul.with_two_columns {
  385. column-count: 1;
  386. }
  387. }
  388. @media (min-width: 50em) {
  389. ul.with_two_columns {
  390. column-count: 2;
  391. }
  392. }
  393. .gallery {
  394. display: flex;
  395. flex-wrap: wrap;
  396. justify-content: space-around;
  397. }
  398. .gallery figure img {
  399. margin-left: 1rem;
  400. margin-right: 1rem;
  401. }
  402. .gallery figure figcaption {
  403. font-family: 'ConcourseT3'
  404. }
  405. footer {
  406. font-family: 'ConcourseT3';
  407. display: flex;
  408. flex-direction: column;
  409. border-top: 3px solid white;
  410. padding: 4rem 0;
  411. background-color: #07486c;
  412. color: white;
  413. }
  414. footer > * {
  415. max-width: 50rem;
  416. margin: 0 auto;
  417. }
  418. footer a {
  419. color: #f1c40f;
  420. }
  421. footer .avatar {
  422. width: 200px;
  423. height: 200px;
  424. border-radius: 50%;
  425. float: left;
  426. -webkit-shape-outside: circle();
  427. shape-outside: circle();
  428. margin-right: 2rem;
  429. padding: 2px 5px 5px 2px;
  430. background: white;
  431. border-left: 1px solid #f1c40f;
  432. border-top: 1px solid #f1c40f;
  433. border-right: 5px solid #f1c40f;
  434. border-bottom: 5px solid #f1c40f;
  435. }
  436. </style>
  437. <h1>
  438. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  439. C’est pratique (archive)
  440. <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
  441. </h1>
  442. <section>
  443. <article>
  444. <h3><a href="http://blog.ecologie-politique.eu/post/C-est-pratique">Source originale du contenu</a></h3>
  445. <p>Tous ces services se déploient dans une société de plus en plus
  446. inégalitaire : d'un côté des gens qui méritent de bien bouffer après leur
  447. journée de boulot ou une réunion exigeante (voir les pubs qui mettent en scène
  448. le réconfort après l'effort), de l'autre des galériens qui sont payés une
  449. misère pour leur livrer un <em>pad thai</em> ou un kit apéro (ici le témoignage
  450. d'un livreur chez <a href="https://www.franceculture.fr/emissions/les-pieds-sur-terre/livreurs-le-droit-du-travail-en-roue-libre">
  451. Frichti</a>). C'est surtout parce que le chômage reste massif et l'armée de
  452. réserve importante, parce que les emplois ont été délibérément déqualifiés en
  453. auto-entreprise que ces entreprises prolifèrent. Si les galériens en ont marre
  454. de risquer leur vie et la vôtre en conduisant comme des dingues, ils trouveront
  455. <a href="https://www.courrierinternational.com/article/vu-des-etats-unis-en-france-les-migrants-exploites-par-uber-eats-et-deliveroo">
  456. un migrant à qui faire faire le boulot</a>. Mais le tout s'appuie sur un
  457. mélange de paresse et de sens de ce qui lui est dû qui saisit l'individu en
  458. régime libéral au moment de faire à bouffer ou de s'occuper de la dimension
  459. matérielle de sa vie. Certes nous devons encore être quelques-un·es à cuire des
  460. nouilles quand nous avons la flemme de cuisiner et qui apprécions de sortir au
  461. restaurant pour nous changer les idées, découvrir un autre monde, des odeurs,
  462. une ambiance (et je n'oublie pas que ces lieux aussi sont propices à
  463. l'exploitation du travail). Mais la compétition économique pousse au cul tout
  464. le monde pour inventer des services innovants – c'est à dire dont personne
  465. n'avait vraiment besoin, qui étaient des rêves d'enfants gâtés mais qui,
  466. intelligemment marketés, nous laissent imaginer que nos vies sont vachement
  467. mieux avec. Ils constituent une <a href="http://cqfd-journal.org/Le-tourisme-est-une-industrie-de"><em>industrie de la
  468. compensation</em></a> sur laquelle il faudra mettre le doigt un jour et qui en
  469. attendant offre aux winners des vies de merde pleines de gratifications.</p>
  470. <p>C'est pratique aussi, quand votre smartphone pense à votre place, que le
  471. logiciel va chercher vos mots de passe sur une autre bécane, recueille et
  472. transfère vos données à votre insu… Pratique, mais un peu inquiétant.
  473. Qu'importe, c'est surtout bien pratique ! Je suis la première à ne pas
  474. faire en matière de sécurité tous les efforts que me proposent des camarades
  475. plus cultivés que moi sur ces questions. Mais malgré cette désinvolture, je
  476. flippe quand je vois le niveau d'indépendance acquis par mon smartphone. Après
  477. des années de résistance et bien qu'il soit encore possible d'acheter neufs des
  478. téléphones bien conçus qui permettent de téléphoner (et d'avoir l'heure), j'ai
  479. cédé pour le côté pratique (1) : plus besoin de m'inquiéter d'avoir une
  480. connexion Internet régulière, de préparer mes déplacements et ma vie sociale
  481. comme je le faisais, avec capture d'écran de plans, schémas dessinés dans
  482. l'agenda, infos importantes notées sur papier, etc. Mais je me sens sous
  483. tutelle, dépossédée, comme une gamine gâtée sauf que je sais ce que c'est que
  484. l'autonomie et je regrette celle que j'avais avant.</p>
  485. <p>Car c'est pratique mais c'est une dépossession : plus la peine de se
  486. soucier de la dimension matérielle de sa vie (et de savoir cuire des nouilles),
  487. pas besoin de garder la maîtrise de ses outils… Jusqu'ici, tout va bien, tant
  488. qu'on fait encore partie de la petite bourgeoisie qui peut se payer tout ça,
  489. tant que des pans entiers du macro-système technicien ne s'effondrent pas. Mais
  490. tout cela nous déqualifie humainement et il est des menaces plus immédiates
  491. encore que l'effondrement écologique ou une vraie crise de l'énergie : nos
  492. libertés, individuelles et collectives.</p>
  493. <p>Je côtoie beaucoup de personnes engagées, qui n'ont pas de mots assez durs
  494. pour stigmatiser le capitalisme et le productivisme, qui éteignent la lumière
  495. dans les pièces qu'elles n'utilisent pas et qui pourtant maintiennent des
  496. comptes dans des réseaux sociaux devenus <a href="https://www.lecho.be/entreprises/technologie/quand-facebook-devient-un-etat/10139091.html">
  497. plus gros que des États</a>, qui consomment un paquet de ressources et
  498. d'énergie pour calculer ce qu'elles aiment et vendre le résultats à d'autres
  499. boîtes, <a href="https://www.theguardian.com/technology/2019/jun/03/facebook-nude-nipple-protest-wethenipple">
  500. censurent leurs images</a>, détournent leurs « ami·es » d'elles ou
  501. réciproquement sur base algorithmique, <a href="https://www.numerama.com/tech/508425-pourquoi-facebook-naime-pas-le-mot-lesbienne.html">
  502. censurent les noms de groupes pas assez familiaux</a>, gèrent leur
  503. environnement social comme un pensionnat dans les années 1950 en attendant de
  504. purement et simplement censurer leurs propos (2). Et ces personnes, parfois ces
  505. collectifs et associations, restent parce que c'est « pratique »
  506. (3).</p>
  507. <p>J'ai toujours reçu un minimum d'écho dans des groupes anti-capitalistes,
  508. écologistes ou féministes, quand j'ai suggéré que Facebook, Twitter, Google
  509. Drive et autres n'étaient pas nos amis et proposé d'utiliser les outils créés
  510. et maintenus par des groupes politiques plus proches de nous et soucieux de nos
  511. libertés : les outils <a href="https://framasoft.org/fr/">Framasoft</a>
  512. (qui vont du pad à l'agenda en ligne, en passant par l'interface de sondages et
  513. la feuille de calcul), le Crabgrass de <a href="https://riseup.net/">Riseup</a>
  514. qui offre des fonctionnalités magiques et je me désole de ne faire partie
  515. d'aucun groupe qui l'utilise, etc. Et j'ai régulièrement mis en cause chez mes
  516. correspondant·es l'idée saugrenue d'avoir un compte Gmail qui vous pousse à
  517. garder dix ans de données en ligne plutôt que de ranger dans des fichiers
  518. dédiés et régulièrement sauvegardés les images qui vous tiennent à cœur. Et
  519. chaque fois, ce que j'entends, c'est que ce serait sympa de sauver la banquise
  520. mais… quand même, c'est pratique. Et j'ai vu des bonnes volontés s'arrêter au
  521. fait que Framacalc ne propose pas de mettre en couleur les cases, même quand
  522. cette couleur contribue à la lisibilité de la feuille sans rajouter aucune
  523. information digne d'intérêt. Aucune. Ces outils sont parfois moins bien que
  524. leur concurrence commerciale mais ne peut-on arbitrer sur d'autres critères
  525. ?</p>
  526. <p>Nous n'allons pas nous flageller, non : si ces entreprises prolifèrent,
  527. de la start-up aux GAFA, c'est bien parce que les États leur laissent la bride
  528. sur le col. Ils démontent le droit du travail au profit de la micro-entreprise,
  529. ils votent des législations liberticides et laissent passer des <a href="https://gizmodo.com/apple-cofounder-steve-wozniak-says-most-people-should-g-1836178238">
  530. pratiques intrusives</a> et des concentrations industrielles qui devraient
  531. normalement tomber sous le coup de lois anti-trust (Messenger + <a href="https://seenthis.net/tag/facebook">Facebook</a> + WhatsApp + Instagram, what
  532. else?). C'est bien simple : les <a href="https://www.theguardian.com/commentisfree/2019/jul/02/facebook-google-data-change-our-behaviour-democracy">
  533. appels au contrôle des GAFA</a> viennent aujourd'hui <a href="https://www.lemonde.fr/economie/article/2019/05/30/le-grand-pouvoir-de-mark-zuckerberg-conteste-a-l-assemblee-generale-de-facebook_5469563_3234.html">
  534. du sein des dits GAFA</a> (et pas forcément des concurrents !) autant que
  535. des politiques. Visiblement, ça nous touche moins que la dernière vidéo de
  536. pandas mignons qui fait le buzz. Mais ça devrait. Et bien que notre marge de
  537. manœuvre soit limitée, bien qu'une défection individuelle ne signifie pas
  538. grand-chose numériquement, même si c'est dur de se passer des centaines de
  539. likes qui saluent vos traits d'esprit et vos indignations sur Twitter, même si
  540. votre organisation a fait son trou sur Facebook, il me semble que la première
  541. chose à faire, dans cette situation, c'est de quitter ces réseaux pour en faire
  542. vivre de plus démocratiques, sobres et décentralisés. Votre engagement
  543. anti-capitaliste, écologiste et anti-autoritaire le mérite bien…</p>
  544. <p>Mauvaise nouvelle : il va falloir réapprendre à se faire un peu chier,
  545. dans la vie.</p>
  546. <p><strong>PS : Ceci est mon 300e billet sur ce blog, ouvert il y a exactement
  547. dix ans.</strong> 300 billets, ça ne veut pas dire 300 textes, il y a quelques
  548. annonces sur le lot. Mais oui, cela fait deux textes par mois en moyenne. Les
  549. meilleurs ont été publiés ailleurs (notamment dans les journaux papier <em>L'An
  550. 02</em>, <em>CQFD</em>, <em>L'Âge de faire</em>, <em>Moins !</em> et d'autres
  551. encore) ou reformulés dans le cadre des livres <em>Égologie</em> (Le Monde à
  552. l'envers, 2007) et <em>La Conjuration des ego</em> (Syllepse, 2019). Je prépare
  553. aussi la réédition de ma brochure sur le revenu garanti (aux éditions du Monde
  554. à l'envers cet hiver). C'est un blog qui m'a aidée à écrire dans des formats
  555. courts puis un peu plus longs (mais toujours pas très longs !) et à faire œuvre
  556. malgré le chômage de longue durée et le manque de sollicitations. Je me fais
  557. chier à payer le nom de domaine chaque année, ce qui permet de bénéficier d'un
  558. hébergement offert par <a href="https://www.gandi.net/fr">Gandi.net</a> et de
  559. ne pas livrer votre cerveau à la publicité.</p>
  560. <p>(1) À vrai dire j'ai cédé dans la perspective d'un travail de terrain à
  561. l'étranger, où les seuls accès à Internet se faisaient par mobile et où mes
  562. informateurs utilisaient WhatsApp plus volontiers que des sms hors de prix. Et
  563. j'y ai gagné un dictaphone de bien meilleure qualité. Mais au quotidien, en
  564. France, je me laisse convaincre par le smartphone alors que j'ai encore le
  565. choix tous les matins de mettre plutôt mon vieux Nokia dans ma poche.</p>
  566. <p>(2) Ces réseaux sociaux hébergent vos propos, vous permettent de mettre en
  567. ligne vos textes, images, fichiers vidéo et audio. Vous restez responsable de
  568. vos publications. Tout va bien. Sauf que <a href="https://www.laquadrature.net/2019/07/09/lassemblee-nationale-adopte-et-aggrave-la-loi-haine/">
  569. les dernières innovations en matière de libertés civiles</a> (qui
  570. s'accompagnent de la remise en cause d'un droit de la presse qui fonctionne
  571. très bien depuis 1881) font de ces réseaux vos éditeurs, lesquels partagent
  572. avec vous la responsabilité pénale de vos publications. Devinez la peine que
  573. vont prendre ces gros acteurs capitalistes à faire vérifier par des petites
  574. mains rémunérées que vos propos sont en effet contraires à la loi,
  575. diffamatoires, insultants ou appelant à la haine ? C'est moins cher de le
  576. mettre à la poubelle dès qu'une personne qui ne vous aime pas les signale,
  577. d'autant plus que vous ne représentez rien (à moins que vous ne soyez Donald
  578. Trump, dans ce cas <a href="https://www.liberation.fr/planete/2019/07/17/pourquoi-twitter-ne-censure-pas-les-tweets-racistes-de-trump_1740327">
  579. l'appel à la haine est acceptable</a>). Les organisations qui pourraient se
  580. saisir de ce cas de censure pour le rendre public sont elles aussi sur ces
  581. réseaux (qui contrôlent leur audience) ou ailleurs et plus personne ne les
  582. entend crier parce que tout le monde est sur Facebook. Monde de rêve,
  583. hein ?</p>
  584. <p>(3) Moi aussi, je reste, tentant de limiter ma participation et préférant
  585. socialiser dans des lieux plus proches de mes valeurs, <a href="http://seenthis.net/people/aude_v">Seenthis.net</a> ou <a href="https://mastodon.acc.sunet.se/@aude_v">Mastodon</a>.</p>
  586. </article>
  587. </section>
  588. <nav id="jumpto">
  589. <p>
  590. <a href="/david/blog/">Accueil du blog</a> |
  591. <a href="http://blog.ecologie-politique.eu/post/C-est-pratique">Source originale</a> |
  592. <a href="/david/stream/2019/">Accueil du flux</a>
  593. </p>
  594. </nav>
  595. <footer>
  596. <div>
  597. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  598. <p>
  599. Bonjour/Hi!
  600. 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>
  601. 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>).
  602. </p>
  603. <p>
  604. 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>.
  605. </p>
  606. <p>
  607. Voici quelques articles choisis :
  608. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  609. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  610. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  611. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  612. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  613. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  614. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  615. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  616. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  617. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  618. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  619. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  620. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  621. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  622. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  623. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  624. </p>
  625. <p>
  626. 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>.
  627. </p>
  628. <p>
  629. Je ne traque pas ta navigation mais mon
  630. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  631. conserve des logs d’accès.
  632. </p>
  633. </div>
  634. </footer>
  635. <script type="text/javascript">
  636. ;(_ => {
  637. const jumper = document.getElementById('jumper')
  638. jumper.addEventListener('click', e => {
  639. e.preventDefault()
  640. const anchor = e.target.getAttribute('href')
  641. const targetEl = document.getElementById(anchor.substring(1))
  642. targetEl.scrollIntoView({behavior: 'smooth'})
  643. })
  644. })()
  645. </script>