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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634
  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>Communication : Les lois de Wiio (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://doubleboucle.fr/communication-les-lois-de-wiio/">
  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. Communication : Les lois de Wiio (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://doubleboucle.fr/communication-les-lois-de-wiio/">Source originale du contenu</a></h3>
  445. <p>En 1978, le professeur Osmo Antero Wiio énonce ses 7 lois sur la communication. Les lois de Wiio présentent sous forme humoristique une des grandes fatalités de la communication : « La Communication échoue habituellement, sauf en cas d’accident. » Même si il est tentant de les rapprocher des « lois de Murphy », l’esprit dans lequel elles ont été rédigé témoigne moins d’une conscience de l’inévitabilité de l’échec que d’un constat objectif sur la complexité des processus de communication.</p>
  446. <p><a title="Yupi666 at en.wikipedia [GFDL (http://www.gnu.org/copyleft/fdl.html), CC-BY-SA-3.0 (http://creativecommons.org/licenses/by-sa/3.0/) or CC BY 2.5 (http://creativecommons.org/licenses/by/2.5)], from Wikimedia Commons" href="https://commons.wikimedia.org/wiki/File%3ACommunication_emisor.jpg"><img src="//upload.wikimedia.org/wikipedia/commons/b/b0/Communication_emisor.jpg" alt="Communication emisor" width="256"/></a></p>
  447. <p>Cet article est librement traduit et adapté par mes soins sur la base de l’<a href="https://www.cs.tut.fi/~jkorpela/wiio.html">article original</a>.</p>
  448. <h2>Les lois de Wiio</h2>
  449. <h3>La plupart des communications sont vouées à l’échec, sauf accident</h3>
  450. <p>Cette loi est le constat sur la base duquel s’établissent les autres lois de Wiio qui en sont une spécialisation ou un dérivé.</p>
  451. <blockquote><p>Malgré leur caractère humoristique, ces lois constituent des observations valides sur toutes les communications humaines. Pour avoir une approche constructive de la communication, il est nécessaire d’admettre leur vérité et de se baser sur elles, plutôt que d’exercer confortablement une communication illusoire.</p></blockquote>
  452. <p>Peut être n’est ce pas tout à fait ce que le professeur Wiio voulait dire (voir plus loin). Toujours est il que de nombreuses personnes ayant lu ces lois ne les ont considérées que comme une expression de sarcasme.</p>
  453. <p>Ce qui différencie la communication humaine de celle des machines par exemple est la faiblesse avec laquelle nous définissons les symboles que nous utilisons pour échanger. De par leur nature subjective même, ces symboles (ou mots) prêtent à confusion.</p>
  454. <p>Le même mot pourra être associé à des expériences radicalement différentes pour deux personnes, même si pour chacune d’elle le sens en paraitra limpide et indiscutablement objectif. De même lorsque nous utilisons  un mot, nous le faisons dans un contexte précis, avec une signification définie par convention. Si le destinataire n’a pas la même perception du contexte ou une convention différente, nous n’avons pas de moyen de savoir cela.</p>
  455. <p>Un mot pourra être compris également suivant plusieurs niveaux d’abstraction. Lorsque nous parlons d’un ogre, parlons-nous d’une créature de légende, d’une personne réelle qui ressemble physiquement à un ogre ou d’une personne qui a un appétit dévorant, possiblement pour autre chose que de la nourriture ? L’utilisation de métaphores et d’un langage imagé multiplie les possibilités de comprendre des choses différentes.</p>
  456. <p>Les différences de langues et de niveaux de maitrise des différentes langues peuvent être un frein au partage suffisant du référentiel nécessaire pour se comprendre. Le fait que certaines activités fassent intervenir des termes anglo-saxons que ce soit dans l’appellation d’une chose ou dans le détail de sa définition sont de nature à aboutir à des interprétations divergentes.</p>
  457. <p>Les différences culturelles entre individus entrainent également des incompréhensions, basées cette fois-ci sur ce qu’il est par exemple normal d’attendre de telle ou telle personne ou de telle ou telle attitude ou comportement. Plus une audience est diversifiée, plus le risque d’obtenir des réactions différentes de celle que vous attendiez est élevé. La même information objective pourra être perçue par exemple comme une opinion politique détestable, un horrible blasphème ou une adorable poésie.</p>
  458. <p>Si l’on considère tous ces éléments et que pour qu’une communication réussisse il faut qu’elle ne tombe dans aucun de ces pièges, la probabilité de l’échec est bien plus élevée que celle du succès. Si on identifie 20 possibilités d’échouer avec une probabilité d’échec de 10% pour chacune, la probabilité de succès n’est alors que de 12%.</p>
  459. <p>Et le modèle que nous considérons jusqu’ici n’est qu’un modèle simplifié. Les choses sont bien pires si l’on considère en plus les efforts de transcription nécessaire. Pour transmettre une connaissance à quelqu’un d’autre, il nous faut transcrire cette connaissance interne en une forme transmissible, transférer cette forme au destinataire, si possible sans détérioration, et laisser le destinataire en faire la transcription inverse pour se l’approprier en tant que connaissance. Si une traduction est nécessaire (comme ici, où je traduis et adapte de l’anglais une traduction du finnois pour le texte de Wiio), les risques sont encore plus grands de commettre des erreurs.</p>
  460. <p>La corruption d’un message ne dépend donc pas uniquement de sa composition mais aussi de toutes les étapes nécessaires à sa transmission entre les différents participants. Si l’on voulait être parfaitement compréhensible en toutes occasions, il faudrait ajouter au contenu du message initial toutes les informations nécessaires pour reconstituer celui-ci si une détérioration devait avoir lieu. Cependant, le temps dont nous disposons pour concevoir et transmettre un message ne nous permet déjà pas d’y inclure qu’une partie des informations nécessaires à sa compréhension. Un message trop long nuirait à la clarté du propos et serait difficile à exploiter dans un échange (et je m’en rends bien compte en relisant la plupart de mes écrits).</p>
  461. <p>Et il y a au moins un autre problème qui peut entrer en ligne de compte. Le message que l’on cherche à transmettre est en général une réponse à un autre message, la demande. Si la demande est vague ou imprécise, les bonnes intentions du répondant vont probablement le pousser à fournir une réponse couvrant un maximum de terrain pour pouvoir être utile, souvent en tapant à côté.</p>
  462. <blockquote><p>– Ahhhh! ça marche pas !!!</p>
  463. <p>– Avez-vous essayé d’éteindre et de rallumer votre appareil ?</p></blockquote>
  464. <p>La probabilité de répondre juste à une question est d’autant plus élevée que la question est la bonne, avec les bonnes informations et le bon niveau de détail.</p>
  465. <h4>Si la communication peut échouer, elle échouera</h4>
  466. <p>A ce point, il ne fait aucun doute que les obstacles à surmonter sont suffisamment nombreux pour que les chances de succès soient quasi inexistantes. Les statistiques et les probabilités sont contre nous.</p>
  467. <h4>Si la communication ne peut pas échouer, elle échouera très probablement aussi</h4>
  468. <p>Malgré tous les efforts que nous pouvons déployer pour s’assurer que la communication est réussie, il restera toujours suffisamment d’éléments hors de notre contrôle ou de notre conscience pour que les chances de succès soient encore très faibles.</p>
  469. <h4>Si la communication semble avoir été faite avec succès, il y a eu méprise</h4>
  470. <p>S’il nous semble que la communication s’est produite avec aisance et succès, il est probable qu’il y a eu méprise. Le destinataire a compris le message à <em>sa</em> façon, généralement celle qui l’arrange et qui ne suscite pas de résistance particulière. Rien n’assure qu’il s’agisse de la signification que vous souhaitiez y mettre. Dommage.</p>
  471. <p>Dans la culture de l’Internet, il y a un adage qui dit qu’à chaque question complexe, il existe une réponse simple, compréhensible, plaisante et tout simplement fausse. Il est souvent plus agréable de recevoir une réponse simple, aussi fausse soit-elle, que de devoir intégrer une réponse complexe. De plus, la plupart des réponses fausses tardent à apparaitre comme telles, et elles ont une fâcheuse tendance pour certaines à sembler fonctionner pendant un temps assez long.</p>
  472. <h4>Si vous êtes satisfait de votre message, la communication a certainement échoué</h4>
  473. <p>Si la formulation de votre message vous plait, vous pouvez être sur que vous l’avez formulé à destination de vous-même et pas de vos destinataires. Vous pouvez essayer de reprendre la formulation pour prendre en compte les particularités de votre auditoire.</p>
  474. <h3>Si un message peut être interprété de plusieurs façons, il le sera de façon à maximiser les dommages causés</h3>
  475. <p>A ce niveau, nous sommes plus proche d’une loi de Murphy, mais elle n’en demeure pas moins valable. En ce qui concerne la gravité, il ne s’agit généralement pas de la pire option que vous aviez envisagé mais d’une encore pire encore que vous n’aviez pas envisagé. Désolé.</p>
  476. <h3>Il y a toujours quelqu’un qui sait mieux que vous ce que vous avez voulu dire</h3>
  477. <p>Alors qu’il est facile de reconnaitre les gens qui n’ont clairement pas compris ce que vous avez dit, reconnaitre ceux qui pensent avoir compris, abondent dans votre sens et commencent à diffuser leur idée erronée de votre avis est une toute autre paire de manche. Rester attentif aux personnes qui semblent vous avoir compris me parait donc une bonne idée.</p>
  478. <h3>Plus nous communiquons, plus la communication empire</h3>
  479. <p>D’ordinaire, on considère que plus on communique, plus la communication s’améliore. En réalité, plus la quantité d’informations augmente, plus le risque de se tromper augmente aussi. D’ailleurs, j’ai décidé il y a quelques temps déjà d’arrêter de reformuler sans arrêt spontanément mes propos et questionner les gens sur leur compréhension. Vous avez le droit de me rappeler cette résolution aussi souvent que nécessaire en commentaire ou sur les réseaux sociaux.</p>
  480. <p>Ce qui fait fonctionner correctement la communication, ce n’est pas le volume d’informations mais la qualité de la donnée contenue dans cette information. Une mesure de son efficacité est dans l’analyse du rapport signal sur bruit.</p>
  481. <h4>Plus nous communiquons, plus vite les méprises se propagent</h4>
  482. <p>La répétition renforce les idées fausses. Répéter une information erronée ne fait qu’augmenter notre propension à la croire vraie, et nous nous retrouvons rapidement à la véhiculer à notre tour. Pour exemple, considérez les annonces de décès de personnalités sur les réseaux sociaux. Si nous voyons l’information une fois, l’erreur nous parait possible. Si nous la voyons plusieurs fois, la probabilité d’en devenir soi-même le relai augmente rapidement. Je salue au passage <a href="http://www.lemonde.fr/actualite-medias/article/2015/03/05/double-demission-a-l-afp-apres-l-annonce-erronee-de-la-mort-de-martin-bouygues_4588314_3236.html">Martin Bouygues et les gens de l’AFP</a>.</p>
  483. <h3>Dans la communication de masse, ce qui importe n’est pas ce qui est mais ce qui semble être</h3>
  484. <p>La communication de masse crée un monde à part. La multiplication des analyses sur les événements et les informations y crée une matière propice à la recherche d’intentions ou de messages cachés, voire de théories du complot. Au final, le phénomène généré par l’information initiale occupe souvent bien plus de place que celle-ci et évolue bien plus rapidement. On assiste sur la toile à des guerres ouvertes qui se règlent le temps de changer de fuseau horaire.</p>
  485. <h3>L’importance d’une nouvelle est inversement proportionnelle au carré de la distance</h3>
  486. <p>Lorsqu’un événement se produit, son importance dépend directement de la distance (physique, communautaire ou affective) que nous percevons avec cet événement. Le décès de quelques passagers français dans un avion privé en Afrique nous parait plus important que le massacre de centaines de personnes dans les mêmes régions ou le décès de centaines de passagers allemands dans les Alpes françaises.</p>
  487. <p>Ce que l’on peut retenir de ces observations c’est que la communication est là aussi fortement impactée par le référentiel propre à chaque personne, et qu’il est donc nécessaire d’en tenir compte.</p>
  488. <h3>Plus la situation est importante, plus vous êtes susceptible d’oublier une chose essentielle dont vous aviez conscience jusque là</h3>
  489. <p>Cette situation se produit à la fois pour l’émetteur et le destinataire du message. Elle s’applique notamment à toutes les informations qui nous paraissent indispensables pour comprendre le sujet dont il est question et que nous considérons malgré nous comme des pré-requis déjà intégrés ou inférés sur la base du contexte présent. Un émetteur à qui une demande de clarification a été adressée arrive généralement à fournir une reformulation satisfaisante et compréhensible par le destinataire, mais bien après que la présente situation se soit terminée.</p>
  490. <h2>Corollaires de Korpella</h2>
  491. <h3>Si personne ne vous agresse, c’est que votre message n’est pas passé</h3>
  492. <p>Le manque de feedback négatif est généralement considéré comme un signe que la communication a été couronnée de succès. Le fait qu’aucun retour négatif n’ait été fait ne peut en aucun cas être considéré comme un témoignage d’adhésion, il peut aussi témoigner d’un désintérêt ou d’une absence d’implication sur le sujet. La demande de clarification ou le feedback négatif, parfois agressif, qu’un émetteur peut recevoir est un signe que son message a atteint sa cible et été au moins partiellement compris, ce qui est un résultat pas si mauvais que ça.</p>
  493. <p>La communication entre humains fonctionne par le dialogue. Les rares fois où une communication uni-directionnelle semble fonctionner (comme une page web ou un livre), c’est en général parce que l’auteur a été impliqué auparavant dans de nombreux dialogues sur le même sujet. Il a pu enrichir son point de vue de celui des autres personnes qui ont pris une part active dans ces dialogues et lui permettre de formuler un message efficace et porteur de sens pour les personnes composant son audience.</p>
  494. <p><a href="http://doubleboucle.fr/feedback/">Le feedback n’est pas juste une façon de donner son avis sur un effort ou le produit de cet effort</a> pour témoigner son appréciation, mais c’est aussi une bonne façon de savoir quel message nous avons pu transmettre.</p>
  495. <blockquote><p>Je ne sais ce que j’ai dit que lorsque l’on m’a répondu.</p></blockquote>
  496. <p>La valeur du feedback n’est plus à démontrer, même le feedback formulé de façon agressive. Les chances sont mêmes élevées qu’un contenu de qualité suscite un feedback plus agressif que les autres, par envie ou autre.</p>
  497. <p>Si vous n’avez aucun feedback, c’est que votre message n’a intéressé personne ou presque.</p>
  498. <h3/>
  499. <h1>Conclusion</h1>
  500. <p>Loin de donner une vision pessimiste de la communication et des difficultés inhérentes au processus, ces lois et corollaires nous permettent d’envisager les choses sous un nouveau jour. Si nous ne pouvons communiquer avec succès, nous pouvons néanmoins travailler à augmenter la probabilité d’un succès accidentel en prêtant une attention toute particulière aux problèmes discutés ici.</p>
  501. </article>
  502. </section>
  503. <nav id="jumpto">
  504. <p>
  505. <a href="/david/blog/">Accueil du blog</a> |
  506. <a href="http://doubleboucle.fr/communication-les-lois-de-wiio/">Source originale</a> |
  507. <a href="/david/stream/2019/">Accueil du flux</a>
  508. </p>
  509. </nav>
  510. <footer>
  511. <div>
  512. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  513. <p>
  514. Bonjour/Hi!
  515. 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>
  516. 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>).
  517. </p>
  518. <p>
  519. 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>.
  520. </p>
  521. <p>
  522. Voici quelques articles choisis :
  523. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  524. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  525. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  526. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  527. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  528. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  529. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  530. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  531. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  532. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  533. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  534. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  535. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  536. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  537. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  538. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  539. </p>
  540. <p>
  541. 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>.
  542. </p>
  543. <p>
  544. Je ne traque pas ta navigation mais mon
  545. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  546. conserve des logs d’accès.
  547. </p>
  548. </div>
  549. </footer>
  550. <script type="text/javascript">
  551. ;(_ => {
  552. const jumper = document.getElementById('jumper')
  553. jumper.addEventListener('click', e => {
  554. e.preventDefault()
  555. const anchor = e.target.getAttribute('href')
  556. const targetEl = document.getElementById(anchor.substring(1))
  557. targetEl.scrollIntoView({behavior: 'smooth'})
  558. })
  559. })()
  560. </script>