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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583
  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>Dear Journalists: Stop being loudspeakers for liars (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://medium.com/@dangillmor/dear-journalists-stop-letting-liars-use-your-platforms-as-loudspeakers-cc64c4024eeb">
  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. Dear Journalists: Stop being loudspeakers for liars (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://medium.com/@dangillmor/dear-journalists-stop-letting-liars-use-your-platforms-as-loudspeakers-cc64c4024eeb">Source originale du contenu</a></h3>
  445. <figure name="9c0d" id="9c0d" class="graf graf--figure graf-after--h3"><figcaption class="imageCaption">Sarah Huckabee Sanders, who is paid to lie for the Trump administration</figcaption></figure>
  446. <p name="206c" id="206c" class="graf graf--p graf-after--figure"><em class="markup--em markup--p-em">(First of a series in how journalists need to change their ways in response to unprecedented challenges in the age of Trump. Updated with links to experts on countering misinformation.)</em></p>
  447. <p name="0a4e" id="0a4e" class="graf graf--p graf-after--p"><strong class="markup--strong markup--p-strong"><em class="markup--em markup--p-em">An open letter to my friends and colleagues in journalism:</em></strong></p>
  448. <p name="0ff6" id="0ff6" class="graf graf--p graf-after--p">Please, just stop.</p>
  449. <p name="d920" id="d920" class="graf graf--p graf-after--p">Please stop giving live airtime to liars. Stop publishing their lies.</p>
  450. <p name="4cc2" id="4cc2" class="graf graf--p graf-after--p">Please examine what you’re doing. You are letting liars use your traditional norms — which made sense in different times and situations — to turn you into amplifiers of deceit. You know you are doing this, and sometimes you even defend it.</p>
  451. <p name="1878" id="1878" class="graf graf--p graf-after--p">Please stop.</p>
  452. <p name="ecd4" id="ecd4" class="graf graf--p graf-after--p">But but but but, you say, he’s the president and we have to publish what he says, because by definition what the president says is news. We have to put Kellyanne Conway on our programs, and quote her in our tweets and stories, because she has the president’s ear and knows what’s going on inside the White House.</p>
  453. <p name="beb9" id="beb9" class="graf graf--p graf-after--p">No, you don’t. And what’s more, you shouldn’t.</p>
  454. <p name="bc4d" id="bc4d" class="graf graf--p graf-after--p">Politicians have always told some lies. This is different. The people running our government, and their key supporters, have launched a war on honest journalism, on facts, and on freedom of expression in general. They are using misinformation as strategy. They want the public to become so confused by what is true and what is false that people will give up even on the idea that journalism can help sort things out. This is not business as usual. You may wish otherwise — and the relentless normalizing journalists still do of this abnormal crew shows how much you wish otherwise — but at some point you have to recognize reality and react to it.</p>
  455. <p name="a718" id="a718" class="graf graf--p graf-after--p">Your job is not to uncritically “report” — that is, do stenography and call it journalism — when the people you’re covering are deceiving the public. Your job is, in part, to help the public be informed about what powerful people and institutions are doing with our money and in our names.</p>
  456. <p name="4ecf" id="4ecf" class="graf graf--p graf-after--p">But but but but, you say, we call them out on the lies. We let them lie and then we refute it.</p>
  457. <p name="dc02" id="dc02" class="graf graf--p graf-after--p">Yes, sometimes you do that, but not consistently. And you almost always refuse to call the lies what they are, resorting instead to mushy words like “falsehood” in order to seem more “objective” even when it’s blatantly clear that the statement was a knowing lie.</p>
  458. <p name="2a92" id="2a92" class="graf graf--p graf-after--p">But even if you did that every time, and in real time, which you absolutely do not, it wouldn’t be sufficient. Researchers have shown conclusively that repeating the lie tends to reinforce it. There’s some evidence that challenging lies can help in some circumstances, but most of what you’re doing is amplifying lies.</p>
  459. <p name="084a" id="084a" class="graf graf--p graf-after--p">You need to face something squarely: You’re confronted with radical hacking of your own systems of operation. This requires radical rethinking of those systems.</p>
  460. <p name="887f" id="887f" class="graf graf--p graf-after--p">So in a world where powerful people lie so brazenly, how can you stop letting them do it, while still fulfilling your essential role in our society? By hacking journalism to meet the challenge, starting with an announcement to the liars and the public that you’re no longer going to play along. Here are some of the ways you can make that stick:</p>
  461. <p name="890d" id="890d" class="graf graf--p graf-after--p">Stop putting known liars on live TV and radio programs. CNN, MSNBC, CBS, et al, you know for certain that Kellyanne Conway will lie if you put her on TV. Just don’t do it anymore. (This means, of course, that you should never air White House briefings.)</p>
  462. <p name="f58f" id="f58f" class="graf graf--p graf-after--p">Note: I’m not addressing Fox “News” here, since Murdoch’s channel has chosen to be chief propagandist for the Trump administration. Meanwhile, I’d hope the rest would maintain this policy no matter who is in power. (<em class="markup--em markup--p-em">Updated to clarify that I don’t think Fox will ever adopt a policy of this kind.</em>)</p>
  463. <p name="cbf9" id="cbf9" class="graf graf--p graf-after--p">Banning known liars means you’ll need new talking heads. Be vigilant. Establish a zero-tolerance policy. When someone who is not already a known liar — admittedly a difficult kind of person to find in the Trump administration — lies on your program, don’t bring that person back, ever again.</p>
  464. <p name="ba8a" id="ba8a" class="graf graf--p graf-after--p">Journalists who publish after the fact — on Twitter, in text-based stories, etc. — don’t have any excuse. Do some fact-checking and say no to publishing the lies, even if it means waiting a few minutes before posting your tweets and stories.</p>
  465. <p name="048a" id="048a" class="graf graf--p graf-after--p">This should apply to Trump as well. Don’t put him on live TV, since you know perfectly well he’s going to lie relentlessly and use you as a loudspeaker. Put him on a short delay while you fact-check, and handle the broadcast accordingly.</p>
  466. <p name="9ac6" id="9ac6" class="graf graf--p graf-after--p">This doesn’t mean ignoring the lies, not at all. It means covering them in a way that accomplishes your real job of helping people understand what is going on. How?</p>
  467. <p name="d487" id="d487" class="graf graf--p graf-after--p">If you’re doing TV, mute the sound output. Do a voice-over saying what the truth is. For example: “The president is discussing the Department of Justice investigation into former FBI director Comey’s handling of the Clinton emails. There is no connection between the inspector general’s examination of how Comey handled the emails and the Mueller investigation.”</p>
  468. <p name="fc24" id="fc24" class="graf graf--p graf-after--p">In other words, do what misinformation experts suggest: Don’t repeat the lie. Start by saying what’s true, as experts like <a href="https://twitter.com/GeorgeLakoff/status/1008041254955839488" data-href="https://twitter.com/GeorgeLakoff/status/1008041254955839488" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">George Lakoff</a>, <a href="https://archives.cjr.org/united_states_project/_countering_misinformation_tip.php" data-href="https://archives.cjr.org/united_states_project/_countering_misinformation_tip.php" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Brendan Nyhan and Jason Reifler </a>have long recommended. (I proposed a <a href="https://www.theatlantic.com/politics/archive/2016/09/politicians-war-on-truth/500282/" data-href="https://www.theatlantic.com/politics/archive/2016/09/politicians-war-on-truth/500282/" class="markup--anchor markup--p-anchor" rel="noopener nofollow" target="_blank">version of this for the 2016 presidential debates</a>, but my idea sank without a trace, as I fear this is also likely to do.)</p>
  469. <p name="7bfd" id="7bfd" class="graf graf--p graf-after--p">Then, after it’s over, link to the unedited version of Trump’s lies so that people who want to hear exactly what he said can do so.</p>
  470. <p name="de73" id="de73" class="graf graf--p graf-after--p">For print-oriented news organizations, this is much easier. Make the coverage about the truth, not the lies, but in the context of how the issue came up — the official’s deceptions.</p>
  471. <p name="de14" id="de14" class="graf graf--p graf-after--p">Yes, this might –almost certainly will — hurt TV ratings. It might reduce page views. So there’s a decision to make. Are you journalists or entertainers?</p>
  472. <p name="e8d0" id="e8d0" class="graf graf--p graf-after--p">I fear I also already know the answer to that question. But I retain eternal hope that journalism will recover its collective spine eventually.</p>
  473. <p name="44dd" id="44dd" class="graf graf--p graf-after--p graf--trailing">Today would be good.</p>
  474. </article>
  475. </section>
  476. <nav id="jumpto">
  477. <p>
  478. <a href="/david/blog/">Accueil du blog</a> |
  479. <a href="https://medium.com/@dangillmor/dear-journalists-stop-letting-liars-use-your-platforms-as-loudspeakers-cc64c4024eeb">Source originale</a> |
  480. <a href="/david/stream/2019/">Accueil du flux</a>
  481. </p>
  482. </nav>
  483. <footer>
  484. <div>
  485. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  486. <p>
  487. Bonjour/Hi!
  488. 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>
  489. 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>).
  490. </p>
  491. <p>
  492. 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>.
  493. </p>
  494. <p>
  495. Voici quelques articles choisis :
  496. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  497. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  498. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  499. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  500. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  501. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  502. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  503. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  504. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  505. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  506. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  507. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  508. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  509. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  510. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  511. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  512. </p>
  513. <p>
  514. 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>.
  515. </p>
  516. <p>
  517. Je ne traque pas ta navigation mais mon
  518. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  519. conserve des logs d’accès.
  520. </p>
  521. </div>
  522. </footer>
  523. <script type="text/javascript">
  524. ;(_ => {
  525. const jumper = document.getElementById('jumper')
  526. jumper.addEventListener('click', e => {
  527. e.preventDefault()
  528. const anchor = e.target.getAttribute('href')
  529. const targetEl = document.getElementById(anchor.substring(1))
  530. targetEl.scrollIntoView({behavior: 'smooth'})
  531. })
  532. })()
  533. </script>