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

2 년 전
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  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>All communication is lossy (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://aworkinglibrary.com/writing/all-communication-is-lossy">
  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>All communication is lossy</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://aworkinglibrary.com/writing/all-communication-is-lossy" title="Lien vers le contenu original">Source originale</a>
  67. </p>
  68. </nav>
  69. <hr>
  70. <p>The hardest thing any of us ever does in our work lives is also the thing we do all day long, often without a lot of attention or intention: that is, getting information from one body into another. All communication involves some amount of signal loss—some information or context or sentiment (or some combination of all three) is distorted or lost as one person communicates to another. The amount of lossiness can and will vary—a skilled communicator or listener may be able to reduce it, while someone who is very distracted or stressed-out may unintentionally do the reverse—but its presence is inevitable and unavoidable. It isn’t a problem that can be eliminated; all we can do is mitigate it.</p>
  71. <p>The most impactful mitigation strategy is to accept that lossiness exists. Simply adopting the mindset that signal loss is normal shifts your attention in ways that start to reduce it. Most miscommunication happens because we aren’t aware of the potential for it, or because we presume it’s unlikely rather than the default state of affairs. If you are <em>aware</em> of the likelihood that some of what you say is getting lost—and, conversely, that you aren’t hearing or absorbing everything that other people are trying to tell you—you are already three-quarters of the way to reducing the signal loss down to something sustainable, if not inconsequential.</p>
  72. <p>Put another way: it’s lack of awareness to lossiness that dooms most conversations to miscommunication, not the lossiness itself.</p>
  73. <p>Once you’re aware—and that awareness has to be something you hold steady, any time you are communicating with someone else, which is <em>all the time</em>—there are lots of habits you can adopt to reduce it:</p>
  74. <ul class="essay">
  75. <li>When listening to someone else, <em>really listen</em>, without trying to imagine how you’ll respond or anticipating what they’ll say next. This is harder than it seems, and it takes practice—but you <em>can</em> do it.</li>
  76. <li>When you think you’ve heard someone, reflect back what you heard and ask if you got it right. </li>
  77. <li>When sharing information with someone else, prompt them to reflect back, and check to see if your message was received the way you intended it to be. </li>
  78. <li>Try to slow communication down, when you can. This seems counterproductive—you’ve got things to do and so little time to do them—but lossiness increases with speed. Take your time and you can avoid time-consuming miscommunications later.</li>
  79. </ul>
  80. <p>Additionally, consider how to make explicit the things that may naturally be implied in a conversation. Usually this means noticing body language or what is going unsaid. E.g., if someone is sharing some news, but their voice seems tired, or their body language (hunched shoulders, eyes looking down) suggests disappointment, don’t be afraid to ask about that. Simple, open questions—how are you feeling about this? or, is there anything else you want to share?—can go a long way towards bringing some subtext forward, and increasing shared understanding.</p>
  81. <p>Adopting these habits is especially important when you communicate with people with less power than you. If you’re a manager, or if the circumstances of your birth afford you more privilege, the burden is on you to attend to the opportunities for lossiness and work to reduce them. This is not to say that others don’t also bear some responsibility for the success of the communication—communication always involves at least two responsible parties—but that you are obligated to carry the heavier weight in that exchange.</p>
  82. <p>This is where I could say that this kind of attention to communication is especially important in remote contexts, where misunderstandings are more likely. But I will tell you for free that what makes for good communication in a remote context is <em>simply what makes for good communication in any context</em>. It’s true that many people find communicating IRL more natural and more comfortable than communicating via a medium like Slack or video or email or whathaveyou. Even I often find IRL communication more energizing than remote exchanges, and I’ve worked remotely for over a decade. But talking to someone IRL is just as ripe for misunderstanding, especially when the people talking have different cultural backgrounds or different relationships to oppressive systems. If you go into IRL communication presuming that you can communicate fully and completely—that signal loss is nil, simply by virtue of being unmediated—you will be disappointed.</p>
  83. <p>Adopting the mindset that lossiness is a fact of life has another benefit: that of beginning to see communication not as simply a transference but as a generative space. That is, we often think of communication as simply moving understanding from one place to another, the way we might move electrons from a substation to a home. This assumption is behind a lot of otherwise well-intentioned efforts to reduce or even eliminate synchronous communication, as it can seem wholly inefficient compared with other methods. But the best communication makes way for something new to emerge in the exchange. It’s not passive but generative, not mere delivery but a creative transformation. You may start out sharing some basic information with a colleague, then find as they reflect back to you that something is being unearthed in the exchange. Be on the lookout for those moments: that’s where the fun happens, that’s where you have the chance to learn something you could never have learned alone.</p>
  84. </article>
  85. <hr>
  86. <footer>
  87. <p>
  88. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  89. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  90. </svg> Accueil</a> •
  91. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  92. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  93. </svg> Suivre</a> •
  94. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  95. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  96. </svg> Pro</a> •
  97. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  98. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  99. </svg> Email</a> •
  100. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  101. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  102. </svg> Légal</abbr>
  103. </p>
  104. <template id="theme-selector">
  105. <form>
  106. <fieldset>
  107. <legend><svg class="icon icon-brightness-contrast">
  108. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  109. </svg> Thème</legend>
  110. <label>
  111. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  112. </label>
  113. <label>
  114. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  115. </label>
  116. <label>
  117. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  118. </label>
  119. </fieldset>
  120. </form>
  121. </template>
  122. </footer>
  123. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  124. <script>
  125. function loadThemeForm(templateName) {
  126. const themeSelectorTemplate = document.querySelector(templateName)
  127. const form = themeSelectorTemplate.content.firstElementChild
  128. themeSelectorTemplate.replaceWith(form)
  129. form.addEventListener('change', (e) => {
  130. const chosenColorScheme = e.target.value
  131. localStorage.setItem('theme', chosenColorScheme)
  132. toggleTheme(chosenColorScheme)
  133. })
  134. const selectedTheme = localStorage.getItem('theme')
  135. if (selectedTheme && selectedTheme !== 'undefined') {
  136. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  137. }
  138. }
  139. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  140. window.addEventListener('load', () => {
  141. let hasDarkRules = false
  142. for (const styleSheet of Array.from(document.styleSheets)) {
  143. let mediaRules = []
  144. for (const cssRule of styleSheet.cssRules) {
  145. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  146. continue
  147. }
  148. // WARNING: Safari does not have/supports `conditionText`.
  149. if (cssRule.conditionText) {
  150. if (cssRule.conditionText !== prefersColorSchemeDark) {
  151. continue
  152. }
  153. } else {
  154. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  155. continue
  156. }
  157. }
  158. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  159. }
  160. // WARNING: do not try to insert a Rule to a styleSheet you are
  161. // currently iterating on, otherwise the browser will be stuck
  162. // in a infinite loop…
  163. for (const mediaRule of mediaRules) {
  164. styleSheet.insertRule(mediaRule.cssText)
  165. hasDarkRules = true
  166. }
  167. }
  168. if (hasDarkRules) {
  169. loadThemeForm('#theme-selector')
  170. }
  171. })
  172. </script>
  173. </body>
  174. </html>