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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723
  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>Neurodiversity (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://tdotc.eu/2018/06/09/neurodiversity/">
  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. Neurodiversity (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://tdotc.eu/2018/06/09/neurodiversity/">Source originale du contenu</a></h3>
  445. <blockquote class="pull-quote">
  446. “One way to understand neurodiversity is to think in terms of human
  447. operating systems. Just because a <span class="caps">PC</span> is not running Windows,
  448. doesn&#8217;t mean that it&#8217;s broken. By autistic standards, the ‘normal’
  449. human brain is easily distractable, obsessively social, and suffers
  450. from a deficit of attention to detail.” — Steve Silberman, author
  451. of <a class="reference external" href="http://stevesilberman.com/book/neurotribes/">Neurotribes</a>.</blockquote>
  452. <p class="center">❦❦❦</p>
  453. <p>… and suffers from a deficit of attention to detail, just like
  454. Windows, I would&nbsp;add.</p>
  455. <p>I came across this quote while watching a semi-related video about
  456. autism (linked at the bottom) by Sarah and Liam Harvey. There is much
  457. I could write about autism—and I will probably do, in time—but today
  458. I&#8217;ll focus on&nbsp;neurodiversity.</p>
  459. <p>The quote from Steve Silberman hit me surprisingly hard&nbsp;today.</p>
  460. <p>Truth is, long before I realized I was autistic, I had abandoned
  461. Windows and discovered the joy of alternative operating systems. I had
  462. customized my own computer, but what I was truly cherishing, as early
  463. at fourteen years old was the sheer diversity of operating systems in
  464. existence. I knew that was called “diversity” but I did not know, back
  465. then, what the word “diversity” means for others&nbsp;today.</p>
  466. <p>What I did know, however, is that mentioning other operating systems
  467. than Windows was attracting bad sorts of attention: mockery,
  468. disapproval, fear, a general form of opprobrium which I quickly
  469. learned to avoid at all costs. Without access to a group of peers
  470. (that came six years later), I simply hid my technical
  471. endeavors. Played “make pretend” by staying knowledgeable on Windows
  472. developments, attempting to reskin the appearance of my software
  473. towards “normality” (with more or less, and often less,&nbsp;success).</p>
  474. <p>For context, remember: these were the 90s, the time where Intel and
  475. Microsoft were king. Computers were still super expensive. And I was
  476. being raised in a conservative, often reactionary
  477. environment. Unorthodoxy in computing was <em>seriously</em>&nbsp;unpopular.</p>
  478. <p>The discovery that one could <em>choose</em> an operating system had been
  479. already a foundational learning moment, which reshaped my intellectual
  480. endeavours and set me on a path I am still walking more than twenty
  481. years since. But what most fascinated me was the study of differences
  482. between the available options. Why these differences existed, since
  483. when, who was responsible for them, what kind of person was using one
  484. operating system more than another. And the next most astonishing,
  485. disappointing and emotionally devastating discovery for me was that
  486. <em>no one else cared</em>—to the&nbsp;contrary.</p>
  487. <p>What I was doing was not “normal”; it was <em>bad</em>, and the fact that I
  488. found beauty in this diversity made me even <em>worse</em>. So I hid. I felt
  489. lonely, guilty, and it brought me bad habits that haunt me to this
  490. day: I still avoid sharing what I learn or my intellectual hobbies
  491. with my peers, my family and my friends. Out of learned fear they
  492. might&nbsp;disapprove.</p>
  493. <p>And today, I hear Steve Silberman drawing this analogy between
  494. neurotypism and “normal” operating systems, and <em>I understand</em>—for
  495. the first time, ever, I understand the fears, the loneliness, the
  496. suffering of neuroatypicals, especially teenagers, and their&nbsp;parents.</p>
  497. <p class="center">❦❦❦</p>
  498. <p>The irony of the situation is not lost on&nbsp;me.</p>
  499. <p>I now wear my autism on my sleeve, and I openly and regularly
  500. highlight to peers and new acquaintances how it impedes my
  501. activities. So I often “feel” the assumptions by friends and
  502. acquaintances that autism has brought me pain and misery in my
  503. childhood; I sometimes “feel” when they censor themselves from asking
  504. me questions about it, to avoid re-opening imagined old&nbsp;wounds.</p>
  505. <p>The truth is, I did not <em>suffer</em> of autism. It was there, and probably
  506. made certain things more difficult than otherwise (especially
  507. respective to social interactions and friendmaking), but it never was
  508. something I would resent about myself. There has never been self-hate
  509. about this. I had sufficiently many other concerns going, and,
  510. foremost, I lacked so much self-awareness (…yay autism…), that it
  511. never came up to me that autism was a thing I should be concerned
  512. about, or that others may be concerned with. Not the least because I
  513. simply didn&#8217;t <em>know</em> I was&nbsp;autistic.</p>
  514. <p>Sure, I got bullied plenty, but the bullying was focused on other
  515. topics. The fact that my language use was not appropriate for my age
  516. group, for example. Or that I performed above expectations at school
  517. assignments. Or that I was doing irregular things with computers. My
  518. life today is more complicated because of what I experienced in
  519. <em>those</em> dimensions early on, but not much so because of&nbsp;autism.</p>
  520. <p>The fight to make neurodiversity visible and accepted is not my
  521. fight. Insofar there is a “movement”, I am not part of it. I did not
  522. suffer, so I do not deserve&nbsp;it.</p>
  523. <p class="center">❦❦❦</p>
  524. <p>The illustration used by Sarah Harvey in her video looks like&nbsp;this:</p>
  525. <p><a class="reference external" href="/2018/06/09/neurodiversity/images/neurodiversity.jpg"><img alt="neurodiversity" src="/2018/06/09/neurodiversity/images/neurodiversity.jpg?w=400" /></a></p>
  526. <p>I see this rainbow lettering as a cute form of <a class="reference external" href="https://en.wikipedia.org/wiki/Cultural_appropriation">cultural
  527. appropriation</a>. I initially figured it makes the “fight” more real,
  528. but on second thought I think it is meant to attract allies: those who
  529. already support sexual and gender diversity could perhaps be made to
  530. extend their support to neurodiversity by appealing to the same&nbsp;symbols.</p>
  531. <p>The parallels are striking,&nbsp;even.</p>
  532. <p>There is a similar fear and loneliness of children, teenagers and&nbsp;parents.</p>
  533. <p>There is a similar anxiety of adults who discover a new way to lead
  534. their existence after another existence of self-denial or&nbsp;self-ignorance.</p>
  535. <p>There is a similar fight for recognition, for&nbsp;acceptance.</p>
  536. <p>There is a similar ignorance of the masses, education to be&nbsp;given.</p>
  537. <p>There is similar active disinformation by opposing forces, politics to
  538. be&nbsp;played.</p>
  539. <p>There are, similarly, social rules to be learned, to be adapted. There
  540. are friends and family members to be&nbsp;accommodated.</p>
  541. <p>There are, similarly, traditions that cannot be continued as-is and
  542. must be&nbsp;transformed.</p>
  543. <p>The colors are&nbsp;fitting.</p>
  544. <p>At <a class="reference external" href="https://en.wikipedia.org/wiki/Stonewall_riots">Stonewall</a>, the transsexuals fought for the rights and acceptance of
  545. homosexuals, bisexuals and other deviants. The Ts <em>had</em> to fight
  546. as their need for medical attention and public accommodation forced
  547. them in the open. In our time, narcoleptics, Tourette&#8217;s, deep autists,
  548. and bipolars fight for the rights and acceptance of HFAs, ADHDs and
  549. dyslexics. They fight for us because <em>they</em> cannot hide, so they might
  550. as well&nbsp;fight.</p>
  551. <p>And I feel indebted to them, as much as I was grateful for what the
  552. Ts did for me before&nbsp;then.</p>
  553. <p class="center">❦❦❦</p>
  554. <p>A startup that I currently work with is very much concerned with
  555. “diversity.” Report after report, presentation after presentation, I
  556. get to hear how “we should strive for more diversity” and how “little
  557. diverse” our group currently&nbsp;is.</p>
  558. <p>This bothers me to no end. Ostensibly, the only thing that seems to
  559. matter is the Equal Opportunity laws and the percentage of female and
  560. non-white employees (and, after sufficiently many employees, the
  561. number of medically handicapped hires, as mandated by&nbsp;law).</p>
  562. <p>I mean, I get it, the fact that there are only two women in a team of
  563. 20+ engineers is a Problem with a capital P, one that needs serious
  564. attention. Ditto for the number of non-white employees. The ratios
  565. inside the group should really mirror that of the population at large,
  566. and currently they don&#8217;t, so there&#8217;s work to do. And I am fine with
  567. that&nbsp;work.</p>
  568. <p>But can we, please, not call this “lack of&nbsp;diversity”?</p>
  569. <p>Every time I read or hear that “we have a diversity problem” or “our
  570. team is not diverse,” I feel that I am being pushed back in the&nbsp;closet.</p>
  571. <p>Cultural diversity is an asset. International backgrounds make people
  572. more mindful accepting of different value systems. Conversations get
  573. lifted away from simple banter. With more than ten different cultural
  574. and a large combinatorial multiplication by several socio-economic
  575. backgrounds, this team has very little risk let discussions and
  576. decision-making become biased by poorly defined “common sense” or
  577. “shared values” and instead focuses on more tangible and objective&nbsp;arguments.</p>
  578. <p>Sexual diversity is an asset. This group is even right on track there:
  579. as the group grew, the overall gender balance (including non-technical
  580. staff) is getting better, and I was happy to discover that the second
  581. openly gay staff member was a woman. It&#8217;s almost as if women and men
  582. have an equal probability to be gay, and that a small team can display
  583. the same ratios as the general population. What a surprise,&nbsp;right?!</p>
  584. <p>Neurodiversity is an asset. One of the most fun, smart, entertaining
  585. and foremost beloved team members is an <span class="caps">ADHD</span> lighthouse. I am <em>so</em>
  586. proud and grateful to be able to see them as a publicly recognized
  587. (and rewarded) model that I can follow. There is a demographically
  588. appropriate distribution of dyslexia, autism, <span class="caps">OCD</span>, <span class="caps">SPD</span> and other
  589. divergences, and the surrounding social group is amazingly tolerant
  590. and embracing of this diversity. So why does it not get reported on,
  591. acknowledged,&nbsp;celebrated?</p>
  592. <p>Why do I still get to hear that “we have a diversity&nbsp;problem”?</p>
  593. <p class="center">❦❦❦</p>
  594. <p>June 18 is <a class="reference external" href="https://en.wikipedia.org/wiki/Autistic_Pride_Day">Autistic Pride Day</a>. Be there, be proud. I probably&nbsp;will.</p>
  595. <blockquote>
  596. <p class="center">❦❦❦</p>
  597. </blockquote>
  598. </article>
  599. </section>
  600. <nav id="jumpto">
  601. <p>
  602. <a href="/david/blog/">Accueil du blog</a> |
  603. <a href="http://tdotc.eu/2018/06/09/neurodiversity/">Source originale</a> |
  604. <a href="/david/stream/2019/">Accueil du flux</a>
  605. </p>
  606. </nav>
  607. <footer>
  608. <div>
  609. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  610. <p>
  611. Bonjour/Hi!
  612. 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>
  613. 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>).
  614. </p>
  615. <p>
  616. 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>.
  617. </p>
  618. <p>
  619. Voici quelques articles choisis :
  620. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  621. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  622. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  623. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  624. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  625. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  626. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  627. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  628. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  629. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  630. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  631. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  632. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  633. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  634. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  635. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  636. </p>
  637. <p>
  638. 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>.
  639. </p>
  640. <p>
  641. Je ne traque pas ta navigation mais mon
  642. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  643. conserve des logs d’accès.
  644. </p>
  645. </div>
  646. </footer>
  647. <script type="text/javascript">
  648. ;(_ => {
  649. const jumper = document.getElementById('jumper')
  650. jumper.addEventListener('click', e => {
  651. e.preventDefault()
  652. const anchor = e.target.getAttribute('href')
  653. const targetEl = document.getElementById(anchor.substring(1))
  654. targetEl.scrollIntoView({behavior: 'smooth'})
  655. })
  656. })()
  657. </script>