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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the <title>
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Exercice pour préparer l’après crise sanitaire pour être sûr que tout ne reprenne pas comme avant (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f0f0ea">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f0f0ea">
  26. <!-- Documented, feel free to shoot an email. -->
  27. <link rel="stylesheet" href="/static/david/css/style_2020-06-19.css">
  28. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  29. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <script type="text/javascript">
  36. function toggleTheme(themeName) {
  37. document.documentElement.classList.toggle(
  38. 'forced-dark',
  39. themeName === 'dark'
  40. )
  41. document.documentElement.classList.toggle(
  42. 'forced-light',
  43. themeName === 'light'
  44. )
  45. }
  46. const selectedTheme = localStorage.getItem('theme')
  47. if (selectedTheme !== 'undefined') {
  48. toggleTheme(selectedTheme)
  49. }
  50. </script>
  51. <meta name="robots" content="noindex, nofollow">
  52. <meta content="origin-when-cross-origin" name="referrer">
  53. <!-- Canonical URL for SEO purposes -->
  54. <link rel="canonical" href="http://www.bruno-latour.fr/fr/node/851.html">
  55. <body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick">
  56. <article>
  57. <header>
  58. <h1>Exercice pour préparer l’après crise sanitaire pour être sûr que tout ne reprenne pas comme avant</h1>
  59. </header>
  60. <nav>
  61. <p class="center">
  62. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  63. <a href="http://www.bruno-latour.fr/fr/node/851.html" title="Lien vers le contenu original">Source originale</a>
  64. </p>
  65. </nav>
  66. <hr>
  67. <main>
  68. <p><a href="https://www.franceinter.fr/emissions/l-invite-de-8h20-le-grand-entretien/l-invite-de-8h20-le-grand-entretien-03-avril-2020" rel="nofollow">Entretien avec Nicolas Demorand, 2 avril sur les gestes barrières.</a><br/>
  69. Il y a peut-être quelque chose d’inconvenant à se projeter dans l’après crise alors que le personnel de santé est, comme on dit, « sur le front », que des millions de gens perdent leur emploi et que beaucoup de familles endeuillées ne peuvent même pas enterrer leurs morts. Et pourtant, c’est bien maintenant qu’il faut se battre pour que la reprise économique, une fois la crise passée, ne ramène pas le même ancien régime climatique contre lequel nous essayions jusqu’ici, assez vainement, de lutter. En effet, la crise sanitaire est enchâssée dans ce qui n’est pas une crise — toujours passagère — mais une mutation écologique durable et irréversible. Si nous avons de bonne chance de « sortir » de la première, nous n’en avons aucune de « sortir » de la seconde. Les deux situations ne sont pas à la même échelle, mais il est très éclairant de les articuler l’une sur l’autre. En tous cas, ce serait dommage de ne pas se servir de la crise sanitaire pour découvrir d’autres moyens d’entrer dans la mutation écologique autrement qu’à l’aveugle.<br/>
  70. (...)<br/>
  71. Il s’agit de faire la liste des activités dont vous vous sentez privées par la crise actuelle et qui vous donne la sensation d’une atteinte à vos conditions essentielles de subsistance. Pour chaque activité, pouvez-vous indiquer si vous aimeriez que celles-ci reprennent à l’identique (comme avant), mieux, ou qu’elles ne reprennent pas du tout. Répondez aux questions suivantes :<br/>
  72. Question 1 : Quelles sont les activités maintenant suspendues dont vous souhaiteriez qu’elles ne reprennent pas ?<br/>
  73. Question 2 : Décrivez a) pourquoi cette activité vous apparaît nuisible/ superflue/ dangereuse/ incohérente ; b) en quoi sa disparition/ mise en veilleuse/ substitution rendrait d’autres activités que vous favorisez plus facile/ plus cohérente ? (Faire un paragraphe distinct pour chacune des réponses listées à la question 1.)<br/>
  74. Question 3 : Quelles mesures préconisez-vous pour que les ouvriers/ employés/ agents/ entrepreneurs qui ne pourront plus continuer dans les activités que vous supprimez se voient faciliter la transition vers d’autres activités ?<br/>
  75. Question 4 : Quelles sont les activités maintenant suspendues dont vous souhaiteriez qu’elles se développent/ reprennent ou celles qui devraient être inventées en remplacement ?<br/>
  76. Question 5 : Décrivez a) pourquoi cette activité vous apparaît positive ; b) comment elle rend plus faciles/ harmonieuses/ cohérentes d’autres activités que vous favorisez ; et c) permettent de lutter contre celles que vous jugez défavorables ? (Faire un paragraphe distinct pour chacune des réponses listées à la question 4.)<br/>
  77. Question 6 : Quelles mesures préconisez-vous pour aider les ouvriers/ employés/ agents/ entrepreneurs à acquérir les capacités/ moyens/ revenus/ instruments permettant la reprise/ le développement/ la création de cette activité ?<br/>
  78. (Trouvez ensuite un moyen pour comparer votre description avec celle d’autres participants. La compilation puis la superposition des réponses devraient dessiner peu à peu un paysage composé de lignes de conflits, d’alliances, de controverses et d’oppositions.)<br/>
  79. <a href="https://docs.google.com/forms/d/e/1FAIpQLScipFUu1cmZfou17Eo1x6JT-0D6nt7KsLtK0JTyS5VZEuUzfA/viewform" rel="nofollow">Une plate forme a été réalisée par le médialab de Sciences Po et ZKM:</a> pour ceux qui souhaitent compiler les auto-descriptions.</p>
  80. </div>
  81. </main>
  82. </article>
  83. <hr>
  84. <footer>
  85. <p>
  86. <a href="/david/" title="Aller à l’accueil">🏠</a> •
  87. <a href="/david/log/" title="Accès au flux RSS">🤖</a> •
  88. <a href="http://larlet.com" title="Go to my English profile" data-instant>🇨🇦</a> •
  89. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">📮</a> •
  90. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">🧚</abbr>
  91. </p>
  92. <template id="theme-selector">
  93. <form>
  94. <fieldset>
  95. <legend>Thème</legend>
  96. <label>
  97. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  98. </label>
  99. <label>
  100. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  101. </label>
  102. <label>
  103. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  104. </label>
  105. </fieldset>
  106. </form>
  107. </template>
  108. </footer>
  109. <script type="text/javascript">
  110. function loadThemeForm(templateName) {
  111. const themeSelectorTemplate = document.querySelector(templateName)
  112. const form = themeSelectorTemplate.content.firstElementChild
  113. themeSelectorTemplate.replaceWith(form)
  114. form.addEventListener('change', (e) => {
  115. const chosenColorScheme = e.target.value
  116. localStorage.setItem('theme', chosenColorScheme)
  117. toggleTheme(chosenColorScheme)
  118. })
  119. const selectedTheme = localStorage.getItem('theme')
  120. if (selectedTheme && selectedTheme !== 'undefined') {
  121. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  122. }
  123. }
  124. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  125. window.addEventListener('load', () => {
  126. let hasDarkRules = false
  127. for (const styleSheet of Array.from(document.styleSheets)) {
  128. let mediaRules = []
  129. for (const cssRule of styleSheet.cssRules) {
  130. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  131. continue
  132. }
  133. // WARNING: Safari does not have/supports `conditionText`.
  134. if (cssRule.conditionText) {
  135. if (cssRule.conditionText !== prefersColorSchemeDark) {
  136. continue
  137. }
  138. } else {
  139. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  140. continue
  141. }
  142. }
  143. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  144. }
  145. // WARNING: do not try to insert a Rule to a styleSheet you are
  146. // currently iterating on, otherwise the browser will be stuck
  147. // in a infinite loop…
  148. for (const mediaRule of mediaRules) {
  149. styleSheet.insertRule(mediaRule.cssText)
  150. hasDarkRules = true
  151. }
  152. }
  153. if (hasDarkRules) {
  154. loadThemeForm('#theme-selector')
  155. }
  156. })
  157. </script>
  158. </body>
  159. </html>