A place to cache linked articles (think custom and personal wayback machine)
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

index.html 15KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  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` element
  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>cailloux n°96 : rêver sincèrement (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="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <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>
  31. <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>
  32. <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>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <meta name="robots" content="noindex, nofollow">
  53. <meta content="origin-when-cross-origin" name="referrer">
  54. <!-- Canonical URL for SEO purposes -->
  55. <link rel="canonical" href="https://cailloux.substack.com/p/96-rever-sincerement">
  56. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  57. <article>
  58. <header>
  59. <h1>cailloux n°96 : rêver sincèrement</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  65. </svg> Accueil</a> •
  66. <a href="https://cailloux.substack.com/p/96-rever-sincerement" title="Lien vers le contenu original">Source originale</a>
  67. </p>
  68. </nav>
  69. <hr>
  70. <p>Vous connaissez peut-être le petit jeu de mot à la mode <a href="https://www.powerlanguage.co.uk/wordle/" rel="">wordle</a> – et ses avatars polyglottes <a href="https://wordle.louan.me/" rel="">le mot</a> et <a href="https://sutom.nocle.fr/" rel="">sutom</a> en français, <a href="https://greenwichmeanti.me/wordle/" rel="">vertl</a> en yiddish, <a href="https://pietroppeter.github.io/wordle-it/" rel="">parole</a> en italien… : un mot à deviner chaque jour et des petits carrés colorés pour partager ses prouesses sur les réseaux sociaux.</p>
  71. <p>Il m’est venu une idée, que je m’empresse de partager ici : écrire chaque jour un poème à partir des mots composant votre grille. Autre contrainte : le poème est composé d’autant de vers qu’il a fallu de coups pour trouver le mot du jour. Enfin, il faut bien évidemment attendre le lendemain pour partager son œuvre, afin de ne pas divulgâcher la solution ! J’ai décidé de nommer cette forme le pécatrix, en espérant qu’elle soit appropriée par d’autres (vous ?) </p>
  72. <p>Voici donc mon premier pécatrix, composé hier :</p>
  73. <blockquote><p>Au sein de l’assemblée océanique,<br>Seul un tiers des poissons<br>A voté la trêve.</p></blockquote>
  74. <p>*</p>
  75. <p>Ces jours-ci, je débute l’écriture des dossiers qui me permettront, je l’espère, d’obtenir mon diplôme et donc le titre de psychologue clinicienne d’ici quelques mois. Il s’agit de rendre compte de mon expérience (en cours) de psychologue stagiaire au sein de deux institutions : l’hôpital de jour d’une clinique psychiatrique et le service de néphrologie d’un hôpital pédiatrique.</p>
  76. <p>J’en suis à l’étape pénible de la <em>constellation</em>, c’est-à-dire que des idées éparses se détachent sur un fond obscur ; elles ont sans doute un rapport entre elles mais je ne le perçois pas encore avec clarté. Le travail consiste à relier ces idées, de façon à leur donner forme – un aigle, une balance, une grande cuillère ou bien une <a href="https://fr.wikipedia.org/wiki/Machine_pneumatique" rel="">machine pneumatique</a>. Cet effort se concrétise principalement grâce à la fonction copier-coller (ou plutôt couper-coller) dont j’use et abuse pour arranger les fragments entre eux. </p>
  77. <p>Dernièrement, alors que, au milieu de la rédaction d’un paragraphe, j’étais en train de me questionner sur la pertinence du terme “vision”, une impression de déjà-vu m’a fait réaliser que j’avais déjà écrit cela, mot pour mot… dans un autre document. M’est alors revenue en mémoire une lettre de Martin, qui, à partir d’un <a href="https://solar.lowtechmagazine.com/fr/2020/03/why-the-office-needs-a-typewriter-revolution.html" rel="">article de low-tech</a> sur l’histoire des instruments d’écriture, <a href="https://tout.substack.com/p/un-conte-calligraphi-sur-des-cerfs" rel="">parle de son propre rapport à l’écriture</a> :</p>
  78. <blockquote><p>Dans mon cahier, je saute des lignes et laisse une marge pour pouvoir reprendre et amender le texte ultérieurement — souvent, j’écris une idée incidente dans la marge pour ne pas la perdre. Le statut de cette bifurcation de pensée se manifeste visuellement. Et quand je reviens à mon texte principal, eh bien il n’a pas bougé. Il m’a attendu sagement là où je l’avais laissé.<br>À force de gloses et de corrections entre les lignes, le texte manuscrit se stratifie. Il avance vers sa structure finale sans perdre la trace de sa forme d’origine. Un texte tapé à l’ordinateur reste toujours fluide, et donc informe.</p></blockquote>
  79. <p>Pour ma part, je crois que cette informité me plaît, elle permet d’accommoder la matière mouvante de ma pensée – au risque de s’y enliser, il est vrai.</p>
  80. <p>*</p>
  81. <p><a href="https://web.archive.org/web/20080410181840/http://uzwi.wordpress.com/2007/01/27/very-afraid/" rel="">Sur son blog, en 2007,</a> l’auteur de science-fiction M. John Harrison distingue l’écriture de la construction d’univers, l’écriture procédant selon lui d’un dialogue entre l’auteurice et son public, laissant place à l’interprétation, tandis que la construction d’univers se limite à la création démiurgique d’un monde fictif clos, dont la qualité première est l’exhaustivité.</p>
  82. <blockquote><p>Every moment of a science fiction story must represent the triumph of writing over worldbuilding. […] Worldbuilding numbs the reader’s ability to fulfil their part of the bargain, because it believes that it has to do everything around here if anything is going to get done.<br>[…]<br>My feeling is that the reader performs most of the act of writing. A book spends a very short time being written into existence; it spends the rest of its life being read into existence.</p></blockquote>
  83. <p>*</p>
  84. <p>À propos d’un tout autre type d’écriture – mais l’on peut tisser des liens entre ces deux réflexions – Joan Didion dans <em>On keeping a notebook</em> :</p>
  85. <blockquote><p>So the point of my keeping a notebook has never been, nor is it now, to have an accurate factual record of what I have been doing or thinking. That would be a different impulse entirely, an instinct for reality which I sometimes envy but do not possess. […] <em>How it felt to me</em>: that is getting closer to the truth about a note­book. I sometimes delude myself about why I keep a notebook, imagine that some thrifty virtue derives from preserving everything observed. […] I imagine, in other words, that the notebook is about other people. But of course it is not. […] My stake is always, of course, in the unmentioned girl in the plaid silk dress. <em>Remember what it was to be me</em>: that is always the point. It is a difficult point to admit. We are brought up in the ethic that others, any others, all others, are by definition more interesting than ourselves; taught to be diffident, just this side of self-effacing. […] But our notebooks give us away, for however dutifully we record what we see around us, the common denominator of all we see is always, transparently, shamelessly, the implacable “I.”</p></blockquote>
  86. <p>Je ne tiens pas de carnet papier mais je suis familière de ce processus. Ce “je” implacable, je le retrouve en parcourant mon historique de recherche, les notes prises la nuit sur mon téléphone, mes captures d’écran, et même, surtout, ces lettres que je vous envoie.</p>
  87. <p>*</p>
  88. <blockquote><p>“[Écrire] est un mode du rêve, et chacun doit essayer de rêver avec sincérité. On sait que tout est faux, mais malgré cela, pour un autre, tout est certain. Ainsi quand j'écris, je rêve, je sais que je rêve, mais tente de rêver sincèrement.</p></blockquote>
  89. <p>– <em>Borgès en dialogue</em>, <em>avec Osvaldo Ferrari</em>, Jorge Luis Borgès, traduit par René Pons</p>
  90. </article>
  91. <hr>
  92. <footer>
  93. <p>
  94. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  95. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  96. </svg> Accueil</a> •
  97. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  98. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  99. </svg> Suivre</a> •
  100. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  101. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  102. </svg> Pro</a> •
  103. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  104. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  105. </svg> Email</a> •
  106. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  107. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  108. </svg> Légal</abbr>
  109. </p>
  110. <template id="theme-selector">
  111. <form>
  112. <fieldset>
  113. <legend><svg class="icon icon-brightness-contrast">
  114. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  115. </svg> Thème</legend>
  116. <label>
  117. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  118. </label>
  119. <label>
  120. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  121. </label>
  122. <label>
  123. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  124. </label>
  125. </fieldset>
  126. </form>
  127. </template>
  128. </footer>
  129. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  130. <script>
  131. function loadThemeForm(templateName) {
  132. const themeSelectorTemplate = document.querySelector(templateName)
  133. const form = themeSelectorTemplate.content.firstElementChild
  134. themeSelectorTemplate.replaceWith(form)
  135. form.addEventListener('change', (e) => {
  136. const chosenColorScheme = e.target.value
  137. localStorage.setItem('theme', chosenColorScheme)
  138. toggleTheme(chosenColorScheme)
  139. })
  140. const selectedTheme = localStorage.getItem('theme')
  141. if (selectedTheme && selectedTheme !== 'undefined') {
  142. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  143. }
  144. }
  145. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  146. window.addEventListener('load', () => {
  147. let hasDarkRules = false
  148. for (const styleSheet of Array.from(document.styleSheets)) {
  149. let mediaRules = []
  150. for (const cssRule of styleSheet.cssRules) {
  151. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  152. continue
  153. }
  154. // WARNING: Safari does not have/supports `conditionText`.
  155. if (cssRule.conditionText) {
  156. if (cssRule.conditionText !== prefersColorSchemeDark) {
  157. continue
  158. }
  159. } else {
  160. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  161. continue
  162. }
  163. }
  164. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  165. }
  166. // WARNING: do not try to insert a Rule to a styleSheet you are
  167. // currently iterating on, otherwise the browser will be stuck
  168. // in a infinite loop…
  169. for (const mediaRule of mediaRules) {
  170. styleSheet.insertRule(mediaRule.cssText)
  171. hasDarkRules = true
  172. }
  173. }
  174. if (hasDarkRules) {
  175. loadThemeForm('#theme-selector')
  176. }
  177. })
  178. </script>
  179. </body>
  180. </html>