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

5 vuotta sitten
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610
  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>L’empathie comme moyen de réparation - l’exemple avec un atelier sur la parole et le genre. (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="https://julia-barbelane.github.io/reflexions/chantiers/l-empathie-comme-moyen-de-reparation-l'exemple-avec-un-atelier-sur-la-parole-et-le-genre.html">
  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. L’empathie comme moyen de réparation - l’exemple avec un atelier sur la parole et le genre. (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="https://julia-barbelane.github.io/reflexions/chantiers/l-empathie-comme-moyen-de-reparation-l'exemple-avec-un-atelier-sur-la-parole-et-le-genre.html">Source originale du contenu</a></h3>
  445. <p><img src="https://raw.githubusercontent.com/Julia-barbelane/reflexions/master/photos/l-empathie-comme-moyen-de-reparation.png" alt="Des hommes et des femmes"/></p>
  446. <p><em>J’ai fait cette expérience dans le cadre du Forum Ouvert de SudWeb où j’ai décidé de participer à l’atelier “la parole et le genre” proposé par <a href="https://twitter.com/perafoo">Raphaël Pierquin</a> qui s’est beaucoup appuyé sur <a href="https://ssw.umich.edu/sites/default/files/documents/events/colc/from-safe-spaces-to-brave-spaces.pdf">la littérature du brave space</a> pour imaginer le déroulement de la session.</em></p>
  447. <h2 id="latelier">L’ATELIER</h2>
  448. <h3 id="13h">13h</h3>
  449. <p>Je rejoins le cabanon où a lieu l’atelier. Des chaises, un cercle et quelques hommes sont installés. Je note que Raphaël a l’air content de voir une femme venir participer.</p>
  450. <blockquote>
  451. <p>Je m’interroge cependant : un homme pour animer un atelier qui parle de la répartition de la parole homme-femme ?</p>
  452. </blockquote>
  453. <p>Je comprends vite que c’est une première fois et qu’il est normalement prévu pour être animé par un homme et une femme. Aussi Raphaël me propose rapidement de prendre le relais pour “<em>gérer</em>” la parole des femmes.</p>
  454. <p>Très vite d’autres hommes nous rejoignent et puis enfin une autre femme. Yess ! Elle s’installe à mes côtés et nous faisons face aux hommes.</p>
  455. <h3 id="13h10">13h10</h3>
  456. <p>Raphaël : <em>Qu’est-ce que vous venez chercher dans cet atelier ?</em></p>
  457. <p>Les réponses sont variées. Certain·e·s sont curieu·x·ses, d’autres s’attendent à trouver des réponses ou à mieux comprendre les mécanismes de répartition de la parole entre hommes et femmes.</p>
  458. <h3 id="13h15">13h15</h3>
  459. <p>Raphaël présente les quelques règles qui vont régir l’atelier. Il précise qu’à la fin de cette présentation, tous les hommes qui rentreront seront invités à ne pas parler et à rester observateurs tandis que les femmes, elles, seront invitées à participer.</p>
  460. <p>Ma curiosité est à son comble. Mais que va-t-il nous faire faire ???</p>
  461. <p><em>“Messieurs, l’idée ici est d’écouter les participantes. Je vous demande de ne pas prendre la parole, sauf pour poser des questions de compréhension ou exprimer vos ressentis.”</em></p>
  462. <p>Hum. J’aime beaucoup cette invitation mais une petite voix me chuchotte qu’il se peut que ce soit difficile pour les participants. Rares sont ceux qui écoutent vraiment et encore plus rares sont ceux qui arrivent à partager leurs sentiments. Ma curiosité est à son comble !</p>
  463. <p><em>“Mesdames, si vous êtes d’accord, je vais vous laisser la parole pour que vous nous racontiez des anecdotes, des histoires, des moments que vous avez mal vécu en lien avec la prise de parole et les hommes.”</em></p>
  464. <p><strong>Précision de l’intention</strong></p>
  465. <p>Il me semble que l’intention de Raphaël est de <strong>créer un espace “d’écoute contrainte et sécurisée” entre une population “oppressée” (ici les femmes) et une population “oppressive” (ici les hommes) pour permettre de libérer la parole de l’une devant l’autre.</strong> Ici en contraignant la prise de parole des hommes Raphaël créé un cadre safe pour les femmes, qui se sentent libres de parler. C’est volontairement beaucoup moins safe pour les hommes. Et ça me semble cohérent car l’idée est de leur offrir une occasion d’écouter et d’apprendre de “celles qu’ils oppressent” chose c’est impossible si ces derniers ne sont pas “contraints” en posture d’écoute et d’empathie.</p>
  466. <p>Trop chouette ! Je réfléchis. J’ai quelques anecdotes. Je prends la parole. La deuxième participante enchaîne.</p>
  467. <h3 id="13h30">13h30</h3>
  468. <p>De nouvelles personnes rejoignent le cercle. Comme annoncé, Raphaël interpelle discrètement les hommes pour leur proposer de rester silencieux et observateurs. Moi je m’occupe d’accueillir les femmes en leur expliquant l’exercice. C’est chouette parcequ’elles ont toutes l’air de répondre avec plaisir et enhousiasme.</p>
  469. <h3 id="13h35">13h35</h3>
  470. <p>Nous sommes finalement 4 femmes, installées côte à côte, et environ 7 hommes (participants et observateurs). Le dialogue continue jusqu’au moment où une des participantes exprime son malaise.</p>
  471. <p><em>“Je trouve la configuration du cercle un peu bizzare. Ce bloc de femmes c’est étrange. Ca vous dirait qu’on se mélange ?”</em></p>
  472. <p>5 secondes plus tard, le cercle était plus homogène. Elle avait raison c’est plus confortable. La discussion reprend.</p>
  473. <h3 id="13h55">13h55</h3>
  474. <p>Raphaël propose de clôturer l’atelier par une petite rétro. La parole est d’abord donnée aux participant·e·s puis aux observateurs. J’ai beaucoup de choses à dire. L’expérience était vraiment stimulante. Et je ne suis pas la seule mais comme il faut libérer la place, on décide de continuer la rétro à l’extérieur.</p>
  475. <p>Je prends alors la mesure de l’enthousiasme partagé et de l’intérêt pour le sujet car la plus grande partie d’entre-nous décide de rester.</p>
  476. <h2 id="la-rétro">LA RÉTRO</h2>
  477. <p>Cet atelier a activé plusieurs parts de moi.</p>
  478. <p><strong>L’Amazone :</strong> je ne m’attendais pas du tout à la rencontrer ici, d’autant que je ne suis pas très à l’aise avec elle. Elle a surtout été activée lorsqu’un des observateurs a dit “<em>j’avais trop envie de parler, mais je ne pouvais pas c’était frustrant !”</em>. Elle a dit un truc du genre “<em>AHAH ! Tant mieux ! Tu vois ce que ça fait hein ?”</em>. Cette part, de nature assez exigente et vindicative, aurait aussi aimé que les participants se saisissent de cette occasion pour poser plus de questions telles que “<em>qu’est-ce que tu as ressenti ? Qu’est-ce que tu me conseillerais pour ne pas reproduire cette situation ? Que peut-on faire dans un cas comme ça pour réparer ?”</em>. Je ne saurais pas dire quelle émotion y été associée exactement, mais c’était en lien avec les besoins de reconnaissance, de compréhension et d’empathie.</p>
  479. <p><strong>La soeur :</strong> au delà de la question du genre, elle a été touchée du “<em>pas fait vers nous</em>”. Ca donne plein d’espoir de sentir cette volonté de comprendre pour agir vers plus de paix et d’équité. Elle s’est sentie en lien avec ses frères qui ont tenté de comprendre et d’accueillir ses expériences dans l’idée d’aller vers du mieux. Je dirais qu’ici c’est la réparation et le lien qui ont été nourris. J’ai ressenti une profonde gratitude pour les hommes en présence.</p>
  480. <p><strong>La mère :</strong> cette part là a peut-être pu se connecter à la difficulté que pouvait représenter un tel exercice pour les hommes. Ca devait être inconfortable pour eux, et elle s’est sentie pleine d’empathie.</p>
  481. <p><strong>L’exploratrice :</strong> celle-ci a été très stimulée ! Et si on rééssayait ? Et si cette fois je faisais partie du groupe des “<em>oppresseu·r·se·s</em>” ? Peut-être pourrais-je apprendre beaucoup ? Peut-être pourrais-je participer à cette “réparation” que j’ai ressentie ?</p>
  482. <h2 id="la-suite">LA SUITE</h2>
  483. <p>Au delà de mon envie de réitérer l’expérience, j’ai aussi décidé d’aller interpeller les autres personnes qui y ont participé. L’idée : avoir plusieurs points de vue avec une curiosité particulière pour celui des hommes. <br/>
  484. <img src="https://raw.githubusercontent.com/Julia-barbelane/reflexions/master/photos/extrait-du-tweet.png" alt="extrait du tweet"/>. <br/>
  485. Résultat, j’ai commencé à agréger quelques retours.</p>
  486. <p>Merci les ami·e·s !</p>
  487. <ul>
  488. <li><a href="https://www.julienpradet.fr/reactions/la-parole-et-le-genre/">Julien</a> “<em>En tant qu’oppresseur, je me sens tout de suite beaucoup plus responsable.</em>”</li>
  489. <li><a href="https://estcequecestdutravail.xyz/2018/06/le-genre-et-la-parole-au-travail.html">Noémie</a> “<em>Tant d’hommes silencieux dans une salle je crois que ça ne m’est jamais arrivé.</em>”</li>
  490. </ul>
  491. </article>
  492. </section>
  493. <nav id="jumpto">
  494. <p>
  495. <a href="/david/blog/">Accueil du blog</a> |
  496. <a href="https://julia-barbelane.github.io/reflexions/chantiers/l-empathie-comme-moyen-de-reparation-l'exemple-avec-un-atelier-sur-la-parole-et-le-genre.html">Source originale</a> |
  497. <a href="/david/stream/2019/">Accueil du flux</a>
  498. </p>
  499. </nav>
  500. <footer>
  501. <div>
  502. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  503. <p>
  504. Bonjour/Hi!
  505. 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>
  506. 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>).
  507. </p>
  508. <p>
  509. 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>.
  510. </p>
  511. <p>
  512. Voici quelques articles choisis :
  513. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  514. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  515. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  516. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  517. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  518. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  519. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  520. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  521. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  522. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  523. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  524. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  525. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  526. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  527. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  528. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  529. </p>
  530. <p>
  531. 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>.
  532. </p>
  533. <p>
  534. Je ne traque pas ta navigation mais mon
  535. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  536. conserve des logs d’accès.
  537. </p>
  538. </div>
  539. </footer>
  540. <script type="text/javascript">
  541. ;(_ => {
  542. const jumper = document.getElementById('jumper')
  543. jumper.addEventListener('click', e => {
  544. e.preventDefault()
  545. const anchor = e.target.getAttribute('href')
  546. const targetEl = document.getElementById(anchor.substring(1))
  547. targetEl.scrollIntoView({behavior: 'smooth'})
  548. })
  549. })()
  550. </script>