davidbgk
/
larlet-fr-david-cache
Watch 1
Star 0
Fork 0
Code Releases 0 Activity
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.
31 Commits
1 Branch
Tree: f2d85e930b
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'f2d85e930b'
${ noResults }
larlet-fr-david-cache/cache/0548a88df19dc344db338424a87.../index.html

index.html 25KB
Raw Blame History

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609 
  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>La Send génération : Pecha Kucha remix (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. 

  28.   <meta name="robots" content="noindex, nofollow">

  29.   <meta content="origin-when-cross-origin" name="referrer">

  30.   <!-- Canonical URL for SEO purposes -->

  31.   <link rel="canonical" href="http://blog.tcrouzet.com/2013/11/24/la-send-generation-pecha-kucha-remix/">

  32. 

  33. <style>

  34. /* http://meyerweb.com/eric/tools/css/reset/ */

  35. html, body, div, span,

  36. h1, h2, h3, h4, h5, h6, p, blockquote, pre,

  37. a, abbr, address, big, cite, code,

  38. del, dfn, em, img, ins,

  39. small, strike, strong, tt, var,

  40. dl, dt, dd, ol, ul, li,

  41. fieldset, form, label, legend,

  42. table, caption, tbody, tfoot, thead, tr, th, td,

  43. article, aside, canvas, details, embed,

  44. figure, figcaption, footer, header, hgroup,

  45. menu, nav, output, ruby, section, summary,

  46. time, mark, audio, video {

  47.   margin: 0;

  48.   padding: 0;

  49.   border: 0;

  50.   font-size: 100%;

  51.   font: inherit;

  52.   vertical-align: baseline;

  53. }

  54. /* HTML5 display-role reset for older browsers */

  55. article, aside, details, figcaption, figure,

  56. footer, header, hgroup, menu, nav, section { display: block; }

  57. body { line-height: 1; }

  58. blockquote, q { quotes: none; }

  59. blockquote:before, blockquote:after,

  60. q:before, q:after {

  61.   content: '';

  62.   content: none;

  63. }

  64. table {

  65.   border-collapse: collapse;

  66.   border-spacing: 0;

  67. }

  68. 

  69. /* http://practicaltypography.com/equity.html */

  70. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */

  71. /* https://www.filamentgroup.com/lab/js-web-fonts.html */

  72. @font-face {

  73.   font-family: 'EquityTextB';

  74.   src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),

  75.        url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');

  76.   font-weight: 300;

  77.   font-style: normal;

  78.   font-display: swap;

  79. }

  80. @font-face {

  81.   font-family: 'EquityTextB';

  82.   src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),

  83.        url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');

  84.   font-weight: 300;

  85.   font-style: italic;

  86.   font-display: swap;

  87. }

  88. @font-face {

  89.   font-family: 'EquityTextB';

  90.   src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),

  91.        url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');

  92.   font-weight: 700;

  93.   font-style: normal;

  94.   font-display: swap;

  95. }

  96. 

  97. @font-face {

  98.   font-family: 'ConcourseT3';

  99.   src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),

  100.        url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');

  101.   font-weight: 300;

  102.   font-style: normal;

  103.   font-display: swap;

  104. }

  105. 

  106. 

  107. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */

  108. body {

  109.   /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */

  110.   font-family: "EquityTextB", Palatino, serif;

  111.   background-color: #f0f0ea;

  112.   color: #07486c;

  113.   font-kerning: normal;

  114.   -moz-osx-font-smoothing: grayscale;

  115.   -webkit-font-smoothing: subpixel-antialiased;

  116.   text-rendering: optimizeLegibility;

  117.   font-variant-ligatures: common-ligatures contextual;

  118.   font-feature-settings: "kern", "liga", "clig", "calt";

  119. }

  120. pre, code, kbd, samp, var, tt {

  121.   font-family: 'TriplicateT4c', monospace;

  122. }

  123. em {

  124.   font-style: italic;

  125.   color: #323a45;

  126. }

  127. strong {

  128.   font-weight: bold;

  129.   color: black;

  130. }

  131. nav {

  132.   background-color: #323a45;

  133.   color: #f0f0ea;

  134.   display: flex;

  135.   justify-content: space-around;

  136.   padding: 1rem .5rem;

  137. }

  138.   nav:last-child {

  139.     border-bottom: 1vh solid #2d7474;

  140.   }

  141.   nav a {

  142.     color: #f0f0ea;

  143.   }

  144.   nav abbr {

  145.     border-bottom: 1px dotted white;

  146.   }

  147. 

  148. h1 {

  149.   border-top: 1vh solid #2d7474;

  150.   border-bottom: .2vh dotted #2d7474;

  151.   background-color: #e3e1e1;

  152.   color: #323a45;

  153.   text-align: center;

  154.   padding: 5rem 0 4rem 0;

  155.   width: 100%;

  156.   font-family: 'ConcourseT3';

  157.   display: flex;

  158.   flex-direction: column;

  159. }

  160.   h1.single {

  161.     padding-bottom: 10rem;

  162.   }

  163.   h1 span {

  164.     position: absolute;

  165.     top: 1vh;

  166.     left: 20%;

  167.     line-height: 0;

  168.   }

  169.     h1 span a {

  170.       line-height: 1.7;

  171.       padding: 1rem 1.2rem .6rem 1.2rem;

  172.       border-radius: 0 0 6% 6%;

  173.       background: #2d7474;

  174.       font-size: 1.3rem;

  175.       color: white;

  176.       text-decoration: none;

  177.     }

  178. h2 {

  179.   margin: 4rem 0 1rem;

  180.   border-top: .2vh solid #2d7474;

  181.   padding-top: 1vh;

  182. }

  183. h3 {

  184.   text-align: center;

  185.   margin: 3rem 0 .75em;

  186. }

  187. hr {

  188.   height: .4rem;

  189.   width: .4rem;

  190.   border-radius: .4rem;

  191.   background: #07486c;

  192.   margin: 2.5rem auto;

  193. }

  194. time {

  195.   display: bloc;

  196.   margin-left: 0 !important;

  197. }

  198. ul, ol {

  199.   margin: 2rem;

  200. }

  201. ul {

  202.   list-style-type: square;

  203. }

  204. a {

  205.   text-decoration-skip-ink: auto;

  206.   text-decoration-thickness: 0.05em;

  207.   text-underline-offset: 0.09em;

  208. }

  209. article {

  210.   max-width: 50rem;

  211.   display: flex;

  212.   flex-direction: column;

  213.   margin: 2rem auto;

  214. }

  215.   article.single {

  216.     border-top: .2vh dotted #2d7474;

  217.     margin: -6rem auto 1rem auto;

  218.     background: #f0f0ea;

  219.     padding: 2rem;

  220.   }

  221.   article p:last-child {

  222.     margin-bottom: 1rem;

  223.   }

  224. p {

  225.   padding: 0 .5rem;

  226.   margin-left: 3rem;

  227. }

  228.   p + p,

  229.   figure + p {

  230.     margin-top: 2rem;

  231.   }

  232. 

  233. blockquote {

  234.   background-color: #e3e1e1;

  235.   border-left: .5vw solid #2d7474;

  236.   display: flex;

  237.   flex-direction: column;

  238.   align-items: center;

  239.   padding: 1rem;

  240.   margin: 1.5rem;

  241. }

  242.   blockquote cite {

  243.     font-style: italic;

  244.   }

  245.   blockquote p {

  246.     margin-left: 0;

  247.   }

  248. 

  249. figure {

  250.   border-top: .2vh solid #2d7474;

  251.   background-color: #e3e1e1;

  252.   text-align: center;

  253.   padding: 1.5rem 0;

  254.   margin: 1rem 0 0;

  255.   font-size: 1.5rem;

  256.   width: 100%;

  257. }

  258.   figure img {

  259.     max-width: 250px;

  260.     max-height: 250px;

  261.     border: .5vw solid #323a45;

  262.     padding: 1px;

  263.   }

  264. figcaption {

  265.   padding: 1rem;

  266.   line-height: 1.4;

  267. }

  268. aside {

  269.   display: flex;

  270.   flex-direction: column;

  271.   background-color: #e3e1e1;

  272.   padding: 1rem 0;

  273.   border-bottom: .2vh solid #07486c;

  274. }

  275.   aside p {

  276.     max-width: 50rem;

  277.     margin: 0 auto;

  278.   }

  279. 

  280. /* https://fvsch.com/code/css-locks/ */

  281. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  282.   font-size: 1rem;

  283.   line-height: calc( 1.5em + 0.2 * 1rem );

  284. }

  285. h1 {

  286.   font-size: 1.9rem;

  287.   line-height: calc( 1.2em + 0.2 * 1rem );

  288. }

  289. h2 {

  290.   font-size: 1.6rem;

  291.   line-height: calc( 1.3em + 0.2 * 1rem );

  292. }

  293. h3 {

  294.   font-size: 1.35rem;

  295.   line-height: calc( 1.4em + 0.2 * 1rem );

  296. }

  297. @media (min-width: 20em) {

  298.   /* The (100vw - 20rem) / (50 - 20) part

  299.      resolves to 0-1rem, depending on the

  300.      viewport width (between 20em and 50em). */

  301.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  302.     font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );

  303.     line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );

  304.     margin-left: 0;

  305.   }

  306.   h1 {

  307.     font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  308.     line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );

  309.   }

  310.   h2 {

  311.     font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  312.     line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );

  313.   }

  314.   h3 {

  315.     font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  316.     line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );

  317.   }

  318. }

  319. @media (min-width: 50em) {

  320.   /* The right part of the addition *must* be a

  321.      rem value. In this example we *could* change

  322.      the whole declaration to font-size:2.5rem,

  323.      but if our baseline value was not expressed

  324.      in rem we would have to use calc. */

  325.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  326.     font-size: calc( 1rem + .6 * 1rem );

  327.     line-height: 1.5em;

  328.   }

  329.   p, li, pre, details {

  330.     margin-left: 3rem;

  331.   }

  332.   h1 {

  333.     font-size: calc( 1.9rem + 1.5 * 1rem );

  334.     line-height: 1.2em;

  335.   }

  336.   h2 {

  337.     font-size: calc( 1.5rem + 1.5 * 1rem );

  338.     line-height: 1.3em;

  339.   }

  340.   h3 {

  341.     font-size: calc( 1.35rem + 1.5 * 1rem );

  342.     line-height: 1.4em;

  343.   }

  344.   figure img {

  345.     max-width: 500px;

  346.     max-height: 500px;

  347.   }

  348. }

  349. 

  350. figure.unsquared {

  351.   margin-bottom: 1.5rem;

  352. }

  353.   figure.unsquared img {

  354.     height: inherit;

  355.   }

  356. 

  357. 

  358. 

  359. @media print {

  360.   body { font-size: 100%; }

  361.   a:after { content: " (" attr(href) ")"; }

  362.   a, a:link, a:visited, a:after {

  363.     text-decoration: underline;

  364.     text-shadow: none !important;

  365.     background-image: none !important;

  366.     background: white;

  367.     color: black;

  368.   }

  369.   abbr[title] { border-bottom: 0; }

  370.   abbr[title]:after { content: " (" attr(title) ")"; }

  371.   img { page-break-inside: avoid; }

  372.   @page { margin: 2cm .5cm; }

  373.   h1, h2, h3 { page-break-after: avoid; }

  374.   p3 { orphans: 3; widows: 3; }

  375.   img {

  376.     max-width: 250px !important;

  377.     max-height: 250px !important;

  378.   }

  379.   nav, aside { display: none; }

  380. }

  381. 

  382. ul.with_columns {

  383.   column-count: 1;

  384. }

  385. @media (min-width: 20em) {

  386.   ul.with_columns {

  387.     column-count: 2;

  388.   }

  389. }

  390. @media (min-width: 50em) {

  391.   ul.with_columns {

  392.     column-count: 3;

  393.   }

  394. }

  395. ul.with_two_columns {

  396.   column-count: 1;

  397. }

  398. @media (min-width: 20em) {

  399.   ul.with_two_columns {

  400.     column-count: 1;

  401.   }

  402. }

  403. @media (min-width: 50em) {

  404.   ul.with_two_columns {

  405.     column-count: 2;

  406.   }

  407. }

  408. 

  409. .gallery {

  410.   display: flex;

  411.   flex-wrap: wrap;

  412.   justify-content: space-around;

  413. }

  414.   .gallery figure img {

  415.     margin-left: 1rem;

  416.     margin-right: 1rem;

  417.   }

  418.   .gallery figure figcaption {

  419.     font-family: 'ConcourseT3'

  420.   }

  421. 

  422. footer {

  423.   font-family: 'ConcourseT3';

  424.   display: flex;

  425.   flex-direction: column;

  426.   border-top: 3px solid white;

  427.   padding: 4rem 0;

  428.   background-color: #07486c;

  429.   color: white;

  430. }

  431.   footer > * {

  432.     max-width: 50rem;

  433.     margin: 0 auto;

  434.   }

  435.   footer a {

  436.     color: #f1c40f;

  437.   }

  438.   footer .avatar {

  439.     width: 200px;

  440.     height: 200px;

  441.     border-radius: 50%;

  442.     float: left;

  443.     -webkit-shape-outside: circle();

  444.     shape-outside: circle();

  445.     margin-right: 2rem;

  446.     padding: 2px 5px 5px 2px;

  447.     background: white;

  448.     border-left: 1px solid #f1c40f;

  449.     border-top: 1px solid #f1c40f;

  450.     border-right: 5px solid #f1c40f;

  451.     border-bottom: 5px solid #f1c40f;

  452.   }

  453. </style>

  454. 

  455. <h1>

  456.   <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>

  457.   La Send génération : Pecha Kucha remix (archive)

  458.   <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>

  459. </h1>

  460. <section>

  461.   <article>

  462.     <h3><a href="http://blog.tcrouzet.com/2013/11/24/la-send-generation-pecha-kucha-remix/">Source originale du contenu</a></h3>

  463.     <p>Dans son journal de Tarkovski ne cesse de se demander ce que peut dire le cinéma que les autres arts ne peuvent pas. Alors que peut dire l’écriture numérique que les écritures plus anciennes ne pouvaient pas ? Qu’est-ce qui se joue de neuf ? Qu’est-ce qui dans notre pratique nous pousse sur de nouvelles routes ? Tentative de réponse dans <a href="http://blog.tcrouzet.com/2013/11/21/faut-il-encore-se-faire-editer/">ce second ebook</a> mis <a href="http://www.youtube.com/watch?v=iyoCsJzrKI0&amp;feature=youtu.be">en abîme dans un Pecha Kucha</a>.<span id="more-33746"/></p>

  464. 

  465. <p><a href="https://app.box.com/s/ybvddylvwul2yp9t8ol5">ePub gratuit</a>, <a href="http://www.amazon.fr/dp/B00GTYRV1C">Kindle</a>, <a href="https://itunes.apple.com/fr/book/id762790919">Apple</a>, <a href="http://store.kobobooks.com/fr-fr/Search?Query=9782919358410">Kobo</a>…</p>

  466. 

  467. <h3>1</h3>

  468. 

  469. <p>Je lis le rouleau original de Kerouac, la grande route déroulée sur trente-six mètres cinquante, une pure giclée de bonheur que les éditeurs au début des années 1950 ont pourtant refusée, forçant Kerouac à réécrire et censurer sa prose cataclysmique parce qu’ils ne comprenaient pas le <em>Beat</em>.</p>

  470. 

  471. <h3>2</h3>

  472. 

  473. <p>Pourtant la route première surpasse la route éditée. L’énergie la déborde dans ses phrases cassées, interrompues par la folie de la pensée trop rapide pour être canalisée. L’immédiateté change tout pour l’auteur comme pour le lecteur. Il faut être insensible pour ne pas le remarquer, le tracer dans la musique, la rugosité de la stance mitraillée devant la conscience surprise.</p>

  474. 

  475. <h3>3</h3>

  476. 

  477. <p>Par le miracle de la touche <em>Send</em> adossée à nos logiciels, téléphones, tablettes… nous sommes potentiellement tous des Kerouac, attachés à un rouleau sans fin, qui nous laisse déverser des mots, des images et des sons sans limites entre nous et les spectateurs. Tout ce que nous lâchons devient définitif, accessible, risible comme beauté fragile d’imperfection.</p>

  478. 

  479. <h3>4</h3>

  480. 

  481. <p>Cette touche <em>Send</em> est tout aussi révolutionnaire que pour le peintre le passage de l’huile à l’aquarelle, de l’aquarelle à l’acrylique. Passage dont les curieux se saisirent pour nous éblouir de productions neuves, par nécessité, parce qu’elles ne pouvaient exister au préalable. Et Picasso qui regardait jusque dans les produits destinés au bâtiment. Le Ripolin et je ne sais quoi.</p>

  482. 

  483. <h3>5</h3>

  484. 

  485. <p>Refuser d’expérimenter, c’est refuser de créer. Refuser le Net, c’est s’enfermer dans des formes moulées par d’autres devenus depuis longtemps marchands de tapis. Refuser le <em>Send</em>, c’est refuser le <em>Speed</em> de notre époque, son <em>Beat</em>, son <em>Rock</em>. Dans cette dynamique il se produit quelque chose qui n’aurait jamais pu advenir par le passé.</p>

  486. 

  487. <h3>6</h3>

  488. 

  489. <p>Je peux tout écrire, je peux tout publier, ça change tout jusque dans les textes que je rêve. Les échafaudages s’écroulent, de la nécessité de plaire à celle de respecter le roman, l’essai, la poésie… J’ai droit à tout, à tout mêler, fusionner, dans un fatras infâme pour les rayonnages des librairies. J’ai droit d’être une flamme, un être entier en train de m’enivrer à l’oxygène.</p>

  490. 

  491. <h3>7</h3>

  492. 

  493. <p>Au même endroit je peux parler de mon outil de travail, de philosophie, de politique, raconter une histoire, les paysages que je traverse et que j’habite, je peux de tout cela faire une œuvre sans chercher à redonner aux différentes lignes qui s’entrecroisent un semblant d’autonomie. Le <em>Send</em> lie le dissemblable, il fait entrer en résonnance des mélodies étrangères.</p>

  494. 

  495. <h3>8</h3>

  496. 

  497. <p>Le <em>Send</em> nous chatouille. Il s’est greffé dans nos cerveaux. Il a brisé nos barrages mentaux. Il est là, disponible, tentant, un peu effrayant, une drogue à laquelle on s’accoutume et qui exige des doses toujours accentuées. C’est une lame au-dessus de nos cous. Nous écrivons avec le feu, quitte à oublier des mots, à en faire l’élision systématique pour grappiller des secondes.</p>

  498. 

  499. <h3>9</h3>

  500. 

  501. <p>Je peux arrêter ce texte, le propulser vers tous les horizons à travers l’espace et le temps, ou bien le continuer encore, mais pas indéfiniment, le <em>Send</em> me travaille, il me tend vers les lecteurs, <em>urgentise</em> chacune de mes phrases par sa simple possibilité. Il m’offre de les clôturer, définitivement, quitte à me ridiculiser.</p>

  502. 

  503. <h3>10</h3>

  504. 

  505. <p>Un <em>Send</em> n’est pas réversible, le Net mémorise, interdit l’oubli, tant chaque chose est aspirée, archivée au-delà de toute possibilité d’effacement, à moins d’un cataclysme. Pas de repenti, ou si peu, foncer en avant vers le texte suivant. Assumer son imperfection, jouir de l’éjection de bits vers les papilles sursensibilisées des récepteurs étrangers.</p>

  506. 

  507. <h3>11</h3>

  508. 

  509. <p>Tarkovski faisait du temps l’essence du cinéma. Il ne se trompait qu’à moitié : le temps est notre matière, que nous cherchions à l’arrêter ou à le chevaucher à pleine vitesse. Le <em>Send</em> fait de nous des êtres-temps. Le <em>Send</em> nous propulse dans notre siècle. Le <em>Send</em> est notre moteur, notre métaphysique, notre trait d’union. Nous appartenons à <em>la Send génération</em>.</p>

  510. 

  511. <h3>12</h3>

  512. 

  513. <p>Les créateurs n’ont jamais vécu rien de semblable. Ceux qui se moquent n’ont jamais goûté avec intensité au <em>Send</em>. Ils ont avec cette touche soit de l’aversion, soit un rapport encore trop classique. Prisonniers du qu’en-dira-t-on ou d’infinies boucles récursives qui les approchent de la paralysie, ils tournent et retournent leur art jusqu’à lui donner l’aspect d’un savon trop gras.</p>

  514. 

  515. <h3>13</h3>

  516. 

  517. <p>Construire durant des mois un texte et le publier en ligne ne fait pas de nous des auteurs numériques. Publier des livres papier ne fait pas de nous des auteurs traditionnels. Le <em>Send</em> se joue sur le Net, puis se moque du support. Il est action writing. Le <em>Send</em> est propre au Net comme le Slam est propre à la scène. Ils participent tous deux de la même urgence.</p>

  518. 

  519. <h3>14</h3>

  520. 

  521. <p>Nombre des auteurs du Net n’écrivent pas autre chose que les auteurs du papier. Notre différence n’est pas dans le support mais dans le <em>Send</em>. Nous ne créons pas pour les étagères des musées mais pour le réseau au sens le plus sanguin du mot. Nous voulons provoquer des secousses sismiques chez les autres en même temps que chez nous, au cours d’une union joyeuse.</p>

  522. 

  523. <h3>15</h3>

  524. 

  525. <p>Avant, on pouvait pratiquer le <em>Send</em> en privé. Lâcher une lettre sans brouillon préparatoire. Ailleurs, quelques auteurs à succès criaient leurs coups de gueule dans la presse, mais jamais selon leur propre agenda. Le <em>Send</em> nous libère de toutes les contingences sinon celles que nous nous imposons nous-mêmes. Le <em>Send</em> est un acte de publication immédiat.</p>

  526. 

  527. <h3>16</h3>

  528. 

  529. <p>On a intégré la présence constante du lecteur, la possibilité de tout lui dire, sans que personne ne s’impose entre lui et nous. Le <em>Send</em> augmente nos capacités cognitives par l’apport des commentaires et la mise en devoir de répondre par de nouvelles passes d’armes littéraires. Le <em>Send</em> nous offre les autres. Il nous plonge en eux.</p>

  530. 

  531. <h3>17</h3>

  532. 

  533. <p>« Vous écrivez mal ! » crient les caciques de l’édition. On croit toujours que Kerouac a éructé <em>Sur la route</em> en trois semaines insomnieuses. La préface à l’édition du tapuscrit original est explicite : depuis des années il notait, esquissait, recommençait… Cette longue préparation s’est soudain cristallisée quand le « je » s’est imposé comme forme narrative.</p>

  534. 

  535. <h3>18</h3>

  536. 

  537. <p>Le <em>Send</em> n’est praticable que sous-tendu par le temps long. Entraînement patient, souci attaché à chaque mot, à chaque tournure, à chaque idée, à chaque thème, longtemps malaxés avant qu’un <em>Send</em> ne les libère dans un afflux de style non réflexif. Alors retour à l’atelier, un œil rivé sur le <em>Send</em> qui pulse dans l’ombre avec de plus en plus d’insistance.</p>

  538. 

  539. <h3>19</h3>

  540. 

  541. <p>Le <em>Send</em> est une attitude. Une reconnaissance de l’impermanence et de la fugitivité. Une acceptation des imperfections, des coquilles, des défauts. Une manière de ne pas protéger ses arrières. De prêter le flanc à des flagellations glaciales. Le <em>Send</em>, c’est vivre aujourd’hui. C’est se montrer tel qu’on est. Sans déguisement, sans afféterie. Le <em>Send</em> est une forme.</p>

  542. 

  543. <h3>20</h3>

  544. 

  545. <p>Un fil rouge unit les adeptes du <em>Send</em>. Ils cherchent un moyen d’accélérer l’écriture, de la libérer, de lui offrir des territoires vierges. Benzédrine, amphétamine, LSD… toute une collection de neuro-boosters (le <em>Beat</em>), plus tard remplacés ou vitaminés par les stridences des guitares électriques (le <em>Rock</em>), laissent place à la stimulation sociale (le <em>Send</em>).</p>

  546.   </article>

  547. </section>

  548. 

  549. 

  550. <nav id="jumpto">

  551.   <p>

  552.     <a href="/david/blog/">Accueil du blog</a> |

  553.     <a href="http://blog.tcrouzet.com/2013/11/24/la-send-generation-pecha-kucha-remix/">Source originale</a> |

  554.     <a href="/david/stream/2019/">Accueil du flux</a>

  555.   </p>

  556. </nav>

  557. 

  558. <footer>

  559.   <div>

  560.     <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">

  561.     <p>

  562.       Bonjour/Hi!

  563.       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>

  564.       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>).

  565.     </p>

  566.     <p>

  567.       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>.

  568.     </p>

  569.     

  570.     <p>

  571.       Voici quelques articles choisis :

  572.       <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,

  573.       <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,

  574.       <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,

  575.       <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,

  576.       <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,

  577.       <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,

  578.       <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,

  579.       <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,

  580.       <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,

  581.       <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,

  582.       <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,

  583.       <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,

  584.       <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,

  585.       <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,

  586.       <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,

  587.       et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>

  588.     </p>

  589.     <p>

  590.       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>.

  591.     </p>

  592.     <p>

  593.       Je ne traque pas ta navigation mais mon

  594.       <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>

  595.       conserve des logs d’accès.

  596.     </p>

  597.   </div>

  598. </footer>

  599. <script type="text/javascript">

  600.   ;(_ => {

  601.     const jumper = document.getElementById('jumper')

  602.     jumper.addEventListener('click', e => {

  603.       e.preventDefault()

  604.       const anchor = e.target.getAttribute('href')

  605.       const targetEl = document.getElementById(anchor.substring(1))

  606.       targetEl.scrollIntoView({behavior: 'smooth'})

  607.     })

  608.   })()

  609. </script>