davidbgk
/
larlet-fr-david


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927
							<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang=fr>
<!-- Has to be within the first 1024 bytes, hence before the <title>
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset=utf-8>
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
<!-- Required to make a valid HTML5 document. -->
<title>ENMI 2015 — David Larlet</title>
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/static/david/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="David Larlet">
<meta name="application-name" content="David Larlet">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- That good ol' feed, subscribe :p. -->
<link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://larlet.fr/david/blog/2015/enmi/">
  <!-- SEO/Semantic metadata -->
  <meta name="description" content="Je m’abstiens d’ajouter des commentaires par manque de recul mais choisir les citations est déjà politique." />
  <meta name="twitter:description" property="og:description" itemprop="description" content="Je m’abstiens d’ajouter des commentaires par manque de recul mais choisir les citations est déjà politique." />
  <meta name="twitter:title" property="og:title" itemprop="name" content="ENMI 2015" />
  <meta name="twitter:card" content="summary" />
  <meta name="twitter:creator" content="@davidbgk" />
  <meta name="twitter:url" property="og:url" content="https://larlet.fr/david/blog/2015/enmi/" />
  <meta property="og:type" content="article" />
  <meta property="og:site_name" content="David Larlet (@davidbgk)" />

  <meta name="twitter:image" property="og:image" itemprop="image" content="https://larlet.fr/static/david/blog/2015/enmi.jpg" />


<style>
/* http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* http://practicaltypography.com/equity.html */
/* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
/* https://www.filamentgroup.com/lab/js-web-fonts.html */
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ConcourseT3';
  src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
       url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


/* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
body {
  /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  font-family: "EquityTextB", Palatino, serif;
  background-color: #f0f0ea;
  color: #07486c;
  font-kerning: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
pre, code, kbd, samp, var, tt {
  font-family: 'TriplicateT4c', monospace;
}
em {
  font-style: italic;
  color: #323a45;
}
strong {
  font-weight: bold;
  color: black;
}
nav {
  background-color: #323a45;
  color: #f0f0ea;
  display: flex;
  justify-content: space-around;
  padding: 1rem .5rem;
}
  nav:last-child {
    border-bottom: 1vh solid #2d7474;
  }
  nav a {
    color: #f0f0ea;
  }
  nav abbr {
    border-bottom: 1px dotted white;
  }

h1 {
  border-top: 1vh solid #2d7474;
  border-bottom: .2vh dotted #2d7474;
  background-color: #e3e1e1;
  color: #323a45;
  text-align: center;
  padding: 5rem 0 4rem 0;
  width: 100%;
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
}
  h1.single {
    padding-bottom: 10rem;
  }
  h1 span {
    position: absolute;
    top: 1vh;
    left: 20%;
    line-height: 0;
  }
    h1 span a {
      line-height: 1.7;
      padding: 1rem 1.2rem .6rem 1.2rem;
      border-radius: 0 0 6% 6%;
      background: #2d7474;
      font-size: 1.3rem;
      color: white;
      text-decoration: none;
    }
h2 {
  margin: 4rem 0 1rem;
  border-top: .2vh solid #2d7474;
  padding-top: 1vh;
}
h3 {
  text-align: center;
  margin: 3rem 0 .75em;
}
hr {
  height: .4rem;
  width: .4rem;
  border-radius: .4rem;
  background: #07486c;
  margin: 2.5rem auto;
}
time {
  display: bloc;
  margin-left: 0 !important;
}
ul, ol {
  margin: 2rem;
}
ul {
  list-style-type: square;
}
a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.09em;
}
article {
  max-width: 50rem;
  display: flex;
  flex-direction: column;
  margin: 2rem auto;
}
  article.single {
    border-top: .2vh dotted #2d7474;
    margin: -6rem auto 1rem auto;
    background: #f0f0ea;
    padding: 2rem;
  }
  article p:last-child {
    margin-bottom: 1rem;
  }
p {
  padding: 0 .5rem;
  margin-left: 3rem;
}
  p + p,
  figure + p {
    margin-top: 2rem;
  }

blockquote {
  background-color: #e3e1e1;
  border-left: .5vw solid #2d7474;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  margin: 1.5rem;
}
  blockquote cite {
    font-style: italic;
  }
  blockquote p {
    margin-left: 0;
  }

figure {
  border-top: .2vh solid #2d7474;
  background-color: #e3e1e1;
  text-align: center;
  padding: 1.5rem 0;
  margin: 1rem 0 0;
  font-size: 1.5rem;
  width: 100%;
}
  figure img {
    max-width: 250px;
    max-height: 250px;
    border: .5vw solid #323a45;
    padding: 1px;
  }
figcaption {
  padding: 1rem;
  line-height: 1.4;
}
aside {
  display: flex;
  flex-direction: column;
  background-color: #e3e1e1;
  padding: 1rem 0;
  border-bottom: .2vh solid #07486c;
}
  aside p {
    max-width: 50rem;
    margin: 0 auto;
  }

/* https://fvsch.com/code/css-locks/ */
p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  font-size: 1rem;
  line-height: calc( 1.5em + 0.2 * 1rem );
}
h1 {
  font-size: 1.9rem;
  line-height: calc( 1.2em + 0.2 * 1rem );
}
h2 {
  font-size: 1.6rem;
  line-height: calc( 1.3em + 0.2 * 1rem );
}
h3 {
  font-size: 1.35rem;
  line-height: calc( 1.4em + 0.2 * 1rem );
}
@media (min-width: 20em) {
  /* The (100vw - 20rem) / (50 - 20) part
     resolves to 0-1rem, depending on the
     viewport width (between 20em and 50em). */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
    margin-left: 0;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
}
@media (min-width: 50em) {
  /* The right part of the addition *must* be a
     rem value. In this example we *could* change
     the whole declaration to font-size:2.5rem,
     but if our baseline value was not expressed
     in rem we would have to use calc. */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * 1rem );
    line-height: 1.5em;
  }
  p, li, pre, details {
    margin-left: 3rem;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * 1rem );
    line-height: 1.2em;
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * 1rem );
    line-height: 1.3em;
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * 1rem );
    line-height: 1.4em;
  }
  figure img {
    max-width: 500px;
    max-height: 500px;
  }
}

figure.unsquared {
  margin-bottom: 1.5rem;
}
  figure.unsquared img {
    height: inherit;
  }


@media print {
  body { font-size: 100%; }
  a:after { content: " (" attr(href) ")"; }
  a, a:link, a:visited, a:after {
    text-decoration: underline;
    text-shadow: none !important;
    background-image: none !important;
    background: white;
    color: black;
  }
  abbr[title] { border-bottom: 0; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  img { page-break-inside: avoid; }
  @page { margin: 2cm .5cm; }
  h1, h2, h3 { page-break-after: avoid; }
  p3 { orphans: 3; widows: 3; }
  img {
    max-width: 250px !important;
    max-height: 250px !important;
  }
  nav, aside { display: none; }
}

ul.with_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_columns {
    column-count: 2;
  }
}
@media (min-width: 50em) {
  ul.with_columns {
    column-count: 3;
  }
}
ul.with_two_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_two_columns {
    column-count: 1;
  }
}
@media (min-width: 50em) {
  ul.with_two_columns {
    column-count: 2;
  }
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
  .gallery figure img {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .gallery figure figcaption {
    font-family: 'ConcourseT3'
  }

footer {
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
  border-top: 3px solid white;
  padding: 4rem 0;
  background-color: #07486c;
  color: white;
}
  footer > * {
    max-width: 50rem;
    margin: 0 auto;
  }
  footer a {
    color: #f1c40f;
  }
  footer .avatar {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    float: left;
    -webkit-shape-outside: circle();
    shape-outside: circle();
    margin-right: 2rem;
    padding: 2px 5px 5px 2px;
    background: white;
    border-left: 1px solid #f1c40f;
    border-top: 1px solid #f1c40f;
    border-right: 5px solid #f1c40f;
    border-bottom: 5px solid #f1c40f;
  }
</style>

<h1 class="single">
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  ENMI 2015
  <time>Publié le 15 décembre 2015</time>
</h1>
<article class="single">
  <p>Quelques notes prises pendant les <a href="http://enmi-conf.org/wp/enmi15/">Entretiens du Nouveau Monde Industriel 2015</a> sur le thème <em>La toile que nous voulons : du web sémantique au web herméneutique</em> qui est un clin d’œil assumé à l’initiative <a href="https://webwewant.org/">the Web We Want</a>. Du très beau monde comme vous allez le lire, je m’abstiens d’ajouter des commentaires par manque de recul mais choisir les citations est déjà politique ;-).</p>
<p><em>Note: English transcripts are not very accurate. Please do not consider those as exact quotes, especially if you’re a journalist.</em></p>
<h2>Table ronde introductive</h2>
<blockquote>
<p><cite>Bernard Stiegler</cite> : Les machines ayant toujours un temps d’avance sur l’humain, est-ce que la disruption met fin à la politique ?</p>
<p><cite>Dominique Cardon</cite> : La Silicon Valley court-circuite le rôle de l’État en retard, quel genre de politique publique permettrait de se remettre dans le système et de rétablir de la justice et de l’égalité ?</p>
<p><cite>Axelle Lemaire</cite> : C’est à défaut d’avancer suffisamment rapidement au niveau européen que l’on se rabat sur une échelle nationale.</p>
<p><cite>Dominique Cardon</cite> : C’est la société civile qui a fait le web, on a besoin de l’État pour la protéger des intérêts économiques des grands acteurs.</p>
<p><cite>Bernard Stiegler</cite> : Comment on trace des singularités ? La particularité est comparable, la singularité non. Quels réseaux sociaux permettent l’individuation collective ?</p>
<p><cite>Axelle Lemaire</cite> : De la réflexion intellectuelle à la mise en application politique : c’est le champs de la traduction.</p>
<p><cite>Axelle Lemaire</cite> : Principe de loyauté des plateformes : chacun doit jouer son rôle et sa responsabilité avec plus de transparence. Documenter les algorithmes du public qui prennent les décision pour les administrés.</p>
<p><cite>Bernard Stiegler</cite> : Comment faire croître des alternatives économiques dans ce contexte là ? Seule la puissance publique pourra nous aider à aller dans cette direction. Il faut reconstituer du collectif grâce au numérique.</p>
<p><cite>Axelle Lemaire</cite> : Le cadre juridique nécessaire du numérique doit s’appuyer sur les citoyens, la fabrique de la loi doit être issue de l’intelligence collective. Cela amorce une manière différente de gouverner pour reconnecter une partie de nos citoyens avec le monde politique.</p>
<p><cite>Dominique Cardon</cite> : La frontière entre le toxique et le non-toxique est très floue. Comment protéger les biens communs et encourager le non-toxique ?</p>
<p><cite>Axelle Lemaire</cite> : Internet est un bien commun au même titre que l’espace ou l’Antarctique.</p>
</blockquote>
<h2>Anthropocène et entropie du web</h2>
<h3>Le WEB dans l’anthropocène</h3>
<blockquote>
<p>La société industrielle est malade et les ENMI sont une tentative de le guérir. Le numérique aggrave cette maladie mais pourrait/devrait permettre de soigner ce malade. […] La disruption est le <em>far-west</em> numérique, on est dans le non-droit. Et ça ne peut pas durer sous peine de se terminer en règlements de comptes à l’échelle mondiale. […] Wikipedia devrait être érigé en merveille du monde.</p>
<p>Si le web était fait pour augmenter le potentiel noétique, cela n’a pas été accompagné par la puissance publique européenne. Ce qui l’a transformé en <em>data economy</em>. […] Le vrai sujet de la COP21 est l’entropie, le climat en est une conséquence. […] Quand on apprend quelque chose c’est quand on est troublé. […] Nous sommes devenus des fourmis avec des phéromones numériques (tweets), il est possible de transformer le web pour aller vers l’herméneutique qui est la condition de la civilisation des mortels pour aller vers l’individuation.</p>
<p><cite>Bernard Stiegler</cite></p>
</blockquote>
<p>Lecture : <a href="/david/stream/2015/12/17/">Imperium de Frédéric Lordon</a> ?</p>
<blockquote>
<p>Silicon Valley is not seen as being part of the traditional economy. It’s important to keep that in mind to discuss their impact on the society. […] If you only think about Uber at an economic level, you are happy, their algorithms reduced costs on both sides, it even becomes accessible for poor people! From a political and ethical point of view, you have to be concerned though. […] Right now in Europe those questions are off the table. There is pressure coming from the companies but also from the consumers, forgetting they are citizens.</p>
<p>Google Now is the perfect incarnation of what is happening. All is optimized for your consumption and reduce the pressure produced by that amount of data. At the cost of your privacy and intimacy. Daily. Hourly. It’s hard to be understood by people that they’re auto-tracking themselves for commodity and welfare. There is no alternative effort right now. […] We will not be able to solve that in Europe without a political effort. Silicon Valley has been and still is helped by the American government. Without the ability to experiment by ourself, we should forget about contesting the system in place and accept it as-is.</p>
<p><cite>Evgeny Morozov</cite></p>
</blockquote>
<h3>La bazar et les algorithmes : à propos de l’espace public numérique</h3>
<blockquote>
<p>Vous croyez faire X mais en fait vous travaillez pour Y. […] Contrainte/discipline vs. environnement/utilité. […] Ce qui doit être pensé c’est le contrat social entre les internautes et le web. […] Le web est un bazar pour ceux qui le pratiquent peu. La réalité du web est qu’il est bien une architecture. La richesse du web est d’avoir diversifié les formes de classement. Le web s’est rendu illisible par manque de visibilité globale, chacun pense que cette photo globale est son image locale.</p>
<p>Classement, métriques et mesures rationalisent cet espace. La personnalisation brouille cet environnement numérique au service de l’utilité, elle fait disparaitre les plans d’accès à la diversité au profit d’une bulle informationnelle, secrète et inintelligible. […] Nos comportements sont réguliers et monotones, les algorithmes utilisent nos traces pour re-normaliser nos propres comportements.</p>
<p>Au lieu d’être si vigilants sur ce qui nous contraint et nous observe, nous devrions être plus vigilants sur nos routines et notre illusion de liberté et d’autonomie. […] Nous ne savons pas comment nous avons été calculés ni à qui nous avons été comparés. Dézoomer c’est donner la possibilité à l’utilisateur de comprendre le collectif et les points d’entrée des autres. […] Il appartient d’encourager les initiatives alternatives.</p>
<p><cite>Dominique Cardon</cite></p>
</blockquote>
<h3>De la collaboration des diversités à la compétition vers l’identique : les très grandes bases de données et les régularités sans sens</h3>
<blockquote>
<p>Avec des outils mathématiques issus du discret (bases de données) on construit un monde différent, sans aléatoire. […] Un réseau introduit de l’aléatoire car on introduit les notions de temps et d’espace. […] Quand on a trop de voisins on devient tous gris et on n’a plus de diversité. La démocratie ce n’est pas seulement la force du nombre, mais aussi une minorité qui a une pensée critique.</p>
<p>La prédiction est efficace si l’on est tous formatés, d’où l’intérêt de nous faire consommer de la même manière. […] La collection des jeux de données n’est jamais neutre. La plupart des corrélations sont insensées.</p>
<p><cite>Giuseppe Longo</cite></p>
</blockquote>
<h2>Architecture, traces et modèles de valeur</h2>
<blockquote>
<p>Can the web <em>now</em> be a proper archive? No. You can’t have a permanent access (stable URLs) to the data released (by WikiLeaks). Once you have piece of human knowledge, how do you keep it? How do you share it? Publishing archives makes a record of how mankind behaves, a point where we can look back. […] There are more secret American cables [released by WikiLeaks] about France than about USRR within the last forty years. All French companies need to understand that their communications and transactions are intercepted. Most of U.S. intelligence budgets are invested in political and economical intelligence, not military.</p>
<p>The european left has abandoned technology. Young people are very interested in technology, because they understand something that others do not understand. Their instinct is to be skilled in an area where it lacks rules and control. […] Make people similar to each other is somehow killing them, their individuality, we need to make people as different as possible to each others. Mixing so many people with the web, we have ideas from a few people that spread and reduce diversity but on the other side a different kind of marginalization will appear to increase diversity.</p>
<p>As companies become larger, they start to be embedded within the state and not being trustable anymore. […] The dream of the Silicon Valley is to gain immortality by uploading their brains to some kind of technologic heaven where they can live forever. Google is very good at acquisition but is not very innovative, the Google project is to integrate not to create. They need to know where people are and were.</p>
<p><cite>Julian Assange</cite></p>
</blockquote>
<h3>L’émergence de la Blockchain</h3>
<blockquote>
<p>La <em>blockchain</em> est un registre qui enregistre les transfert mais ce n’est pas qu’un registre, les écritures deviennent performatives, opèrent (il y a une preuve derrière). C’est une moyen de stockage distribué de la donnée, l’ensemble des blocs de transactions horodatées. L’innovation vient des mineurs avec les preuves de travail. Chaque bloc est le fruit d’un consensus machinique, l’intégrité de la <em>blockchain</em> vient du fait que la puissance de calcul pour falsifier le réseau serait trop coûteuse vis-à-vis du gain. L’impact énergétique des mineurs nous fait poser les mêmes questions que celui des datacenters.</p>
<p>Toute l’économie de la certification se retrouve en porte-à-faux. Il n’y a pas d’asymétrie de l’information. Si tout le monde voit la même chose, l’ensemble des transactions est anonyme, d’où une crise de la fiscalité et à terme de la puissance publique. Quid de la <em>blockchain</em> et de l’héritage ? Pas besoin du web pour faire fonctionner la <em>blockchain</em>, c’est une nouvelle forme d’espace public, c’est un système de consensus distribué, c’est une infrastructure de certification, du <em>consensus à la demande</em>. Elle n’enregistre pas l’ensemble des dissensus, ils sont écartés systématiquement.</p>
<p>Le web pensé à partir des capacités apportées par la <em>blockchain</em> et de ses variantes. Les acteur financiers mettent en place leurs propres <em>blockchains</em> privées. La <em>blockchain</em> introduit un espace public certifié, transformant l’exercice de la puissance publique qui est de certifier (diplômes, votes, identités, etc).</p>
<p><cite><a href="http://www.christian-faure.net/2015/09/13/la-blockchain-et-lemergence-des-distributed-consensus-engines/">Christian Fauré</a> (<a href="/david/cache/d5855c416d3ad15cca1c30f412689356/">cache</a>)</cite></p>
</blockquote>
<p>Voir à ce sujet <a href="http://enmi-conf.org/wp/enmi15/blockchain-and-beyond-rapport-sur-la-blockchain/">Blockchain &amp; Beyond</a> (<a href="/david/cache/0d94ebcdd7ee0e8fc67af26933738499/">cache</a>) ainsi que <a href="https://www.ethereum.org/">Ethereum</a>.</p>
<h3>Le concept de group dans les réseaux sociaux</h3>
<blockquote>
<p>Imaginer une autre structure du web. Est-ce que le groupe peut fonctionner come un milieu associé, permettant une protection de la vie privée des membres du groupe et en même temps conserver sa fonction de grammatisation ? Anonyme, intragroupe, intergroupe et personnalisation</p>
<p><cite>Yuk Hui</cite></p>
</blockquote>
<h3>NextLeap</h3>
<blockquote>
<p>Power has been put into infrastructure. And the Internet and the Web are infrastructures. The NSA mass surveillance couldn’t have existed without the Silicon Valley. We need a material constitution/declaration of rights because otherwise all these declarations of words are useless. <a href="https://en.wikipedia.org/wiki/Zooko’s_triangle">Zooko’s Triangle</a>: human-meaningful, decentralized and secure. Relevant: <a href="http://webwomenwant.tumblr.com/">What is the Web 100 Women Want?</a>, <a href="https://leap.se/">LEAP</a>, <a href="http://redecentralize.org/">Redecentralize</a>, <a href="https://bitmask.net/">Bitmask</a>, <a href="https://whispersystems.org/">OpenWhisperSystems</a>. Don’t build surveillance mass machine, it’s treason to the Internet.</p>
<p><cite>Harry Halpin</cite></p>
</blockquote>
<h3>Conclusion sur la cartographie</h3>
<blockquote>
<p>La cartographie des relations c’est ce qui révèle dans un espace bidirectionnel ce qui est multidimensionnel. Elle fait partie de sa propre mémoire mais aussi de celle du groupe, c’est pourquoi la mémoire est sociale. Le groupe est constitué d’un savoir partagé (pas d’une information partagée). Il ne s’agit pas de protéger un commun mais de transformer et de réimaginer le web.</p>
<p><cite>Bernard Stiegler</cite></p>
</blockquote>
<h2>Gouvernementalité algorithmique et machine learning</h2>
<h3>Modélisation prédictive et Deep Learning</h3>
<blockquote>
<p>L’analyse de données n’est pas de l’intelligence artificielle, cela permet de faire de la recommandation ou de la prédiction de maintenance par exemple. L’apprentissage statistique (Machine Learning) est plus transverse et le <em>Deep Learning</em> se rapproche davantage de l’intelligence artificielle. On peut depuis 2012 utiliser les réseaux de neurones profonds pour classifier des images avec un apprentissage à tous les niveaux. Les machines arrivent aujourd’hui à avoir un apprentissage supérieur (3,6%) à celui des humains (5%). Utilité : traduction, reconnaissance faciale, séquences biologiques pour déterminer la fonction selon la structure par exemple. Possibilité de générer une pièce de Shakespeare comme du code source de Linux ! Peu de sens mais la structure et le style sont là.</p>
<p><cite>Olivier Grisel</cite></p>
</blockquote>
<h3>Algorithms, Big Data, and Critical Theory</h3>
<blockquote>
<p>Algorithms need to be politicized. […] Algorithms enable exploitation to become abstract. […] Software is a commodity under the conditions of late capitalism. As such, it is linked to a political economy whereby money and power control what software is written, where it is deployed and who has access to it. This needs to be (re)connected to the political project of human emancipation ensuring that computation extends this freedom rather than proletarianising (some of) humanity.</p>
<p><cite>David Berry</cite></p>
</blockquote>
<h3>La réflexivité algorithmique</h3>
<blockquote>
<p>La toile que nous voulons n’est donc pas celle que nous avons ? Trois temps : récolte massive, traitement automatisé, gouvernementalité algorithmique des données. Soit consentir de manière éclairée à la récolte massive des données, soit considérer qu’elles sont volées. Quelle est notre forme de tolérance dans cette cession de données ? […] Un savoir parfaitement spontané est une illusion. […] L’enchainement de corrélations non discriminantes peut conduire à une corrélation discriminante.</p>
<p><cite>Thomas Berns</cite></p>
</blockquote>
<h3>Le mise à l’écart de l’homme par la machine est-elle irréversible ?</h3>
<blockquote>
<p>Une grande capacité technique ne signifie pas qu’une espèce est capable de se sauver elle-même. Nous ne devrions pas écouter l’espace mais repérer les restes de civilisations qui ont pu être aussi techniques que nous avant de succomber. […] Le moteur de notre raisonnement ce sont nos réactions affectives, la machine doit se baser sur une dynamique d’affect pour nous ressembler. […] Notre capacité à survivre au développement machinique n’est pas assuré, notre destin serait peut-être d’avoir permis l’avènement de l’ère des machines.</p>
<p>Les marchés boursiers ne sont pas totalement automatisés car il faut qu’il y ait des perdants (les humains). […] Celui qui est remplacé par la machine n’en bénéficie pas, c’est le problème des classes laborieuses. Notre problème politique c’est que les classes oisives sont les moins bien placées pour identifier le problème actuel. Et elles sont pourtant en position de prendre les décisions. […] Lorsque les problèmes deviennent trop complexes, la seule solution trouvée jusqu’à présent est la guerre.</p>
<p><cite><a href="http://www.pauljorion.com/blog/">Paul Jorion</a></cite></p>
</blockquote>
<h2>Espace public, études digitales et éditorialisation</h2>
<h3>Pour une contre–université du numérique</h3>
<blockquote>
<p>Construire une intelligence collective qui intègre une <a href="http://www.liberation.fr/futurs/2015/07/07/pour-une-deuxieme-vague-numerique-plus-humaine-et-critique_1345050">dimension critique</a> (<a href="/david/cache/c0db8c7cf166d7bb53f73ad6261cf94a/">cache</a>). Ni conformisme techno ni vague réactionnaire. L’art et les rebelles contre l’obscurantisme et le conformisme. Le néo-populisme est de laisser les clés de la politique à la technologie. Pensée trans-humaniste ou post-humaniste portée par la <em>Singularity University</em>, les Nano-Bio-Informatique et sciences Cognitives (NBIC) devraient permettre de réparer l’humain et de l’augmenter d’ici 2045.</p>
<p>La <em>contre-université</em> oppose les commoners aux libertariens, les techno-critiques aux technophiles, les cultures du numérique aux technologies de l’exponentiel. Répondre aux grands enjeux de l’humanité par les communs et non par les startups, créer des communautés pollinisatrices, participatives et solidaires. Réduire la culture du numérique au <em>startups</em> est extrêmement réducteur et nocif. Si l’université ne s’empare pas de l’aujourd’hui, elle meure. Elle ne doit pas être seulement la mémoire d’une économie pragmatique.</p>
<p><cite>Ariel Kyrou et Bruno Teboul</cite></p>
</blockquote>
<h3>France Televisions</h3>
<blockquote>
<p>Définition obsolète de ce que peut être un diffuseur de media de service public. D’un media de masse à une consommation par communautés. La transformation du diffuseur en éditeur car la valeur n’est plus dans l’intermédiaire mais dans la production. Produire de l’impact social avec des contenus qui ne sont plus uniquement audiovisuels et consommés passivement. La relation avec le public n’est plus le volume et l’audience mais passe par la qualité, l’engagement et l’effet. Pour pouvoir se transformer il faut accepter que la transformation est impossible et générer des enfants qui grandiront demain pour nous remplacer.</p>
<p><cite>Boris Razon</cite></p>
</blockquote>
<h3>Mutation numérique de l’écrit : du fixe &amp; du mouvant</h3>
<blockquote>
<p>Paradoxe du Web : on tâtonne tous dans la préhistoire. Il faut explorer les périodes de transitions. Comment revendiquer ce brouillonnage ? <em>Impossible de citer davantage même si le propos était passionnant de brouillonitude, une forme d’expérience de ré-écriture :-)</em></p>
<p><cite><a href="http://www.tierslivre.net/spip/spip.php?article4287">François Bon</a> (<a href="/david/cache/5ea262491c2749fa3f9f2656ee2408fa/">cache</a>)</cite></p>
</blockquote>
<h3>Ce dont je rêve</h3>
<blockquote>
<ol>
<li>Trouver une alternative à la publicité. Combinaison vertueuse entre une information gratuite et la qualité de cette information. Si l’information est un commun, qu’est que cela veut dire concrètement ?</li>
<li>Insérer l’information dans la conversation. Ne pas imposer les sujets mais produire au moment oportun. Comment ne pas se faire dominer par les plateformes/algorithmes dans ce but ?</li>
<li>Mise à disposition du parcours informationnel pour les lecteurs. Apport de réflexivité pour faire des choix éclairés. <em>Qualified self?</em></li>
<li>Renouvellement du participatif. Échec de co-construire l’information avec le lecteur. Les commentaires ne sont pas fertiles.</li>
<li>Que les programmes informatiques fonctionnent.</li>
<li>Continuité du multimedia. Interruption de lecture, quelle prolongation ?</li>
<li>Créer des media ad-hoc sur des sujets. Construire sur une durée déterminée un lieu où s’agglomère tout ce dont on a envie de savoir.</li>
<li>Construire un rapport de force avec les diffuseurs (réseaux sociaux et Google).</li>
<li>Des journalistes aculturés numériquement. Il est très compliqué de politiser les journalistes.</li>
</ol>
<p><cite><a href="http://rue89.nouvelobs.com/">Xavier de La Porte</a></cite></p>
</blockquote>
<h3>Synthèse</h3>
<blockquote>
<p>Nous sommes face à la nécessité de penser une alternative alors qu’il ne semble pas qu’il y en ait. Il faut une critique de l’économie politique. Le darwinisme du trans-humanisme est-il une fatalité ? C’est devenu une doctrine qui nous empêche de penser la question présente qui est l’exo-somatisation (créer des organes non vivants).</p>
<p>La singularité est le mot maudit de la philosophie, les grandes religions en sont pourtant des pensées. Le web est (était ?) une promesse <em>des</em> singularités et de leurs individuations. Se battre c’est protéger la faculté de rêver. Le web était une valeur pratique qui s’est produite mais qui s’est transformée en valeur d’usage condamnée par la valeur d’échange. Le web est devenu cauchemar.</p>
<p>Penser, c’est penser les conditions de réalisation de ses rêves. Il faut créer des instruments de création/provocation de controverse, pas pour les analyser mais pour les susciter. Il faut créer des coopératives de savoirs qui constituent l’alternative. C’est l’avenir des journaux, des universités et des partis politiques.</p>
<p><cite>Bernard Stiegler</cite></p>
</blockquote>
<h2>Le web des territoires</h2>
<blockquote>
<p><cite>Bernard Stiegler</cite> : Il faut une approche intégrale. Il faut une relation organique avec le territoire.</p>
<p><cite>Patrick Braouezec</cite> : Le politique doit arrêter de courir derrière les mutations technologiques mais les anticiper.</p>
<p><cite>Bernard Stiegler</cite> : Il faut savoir se projeter sur 10 ans pour ce type de travail là. Ce qui pose la question de l’inter-générationnel avec une telle temporalité.</p>
<p><cite>Patrick Braouezec</cite> : Comment le citadin s’approprie l’urbain ? Vision classique : l’élu avec une vision politique, le technicien avec son expertise technique, le chercheur avec son expérience. Et le citoyen/usager des équipements ? Et le gestionnaire des équipements et sa connaissance culturelle ? Idée de citadinité.</p>
</blockquote>
<p>Ces deux journées ont été très très denses, peut-être trop. Étaler les ENMI sur une semaine avec des après-midi d’échanges serait probablement plus soutenable. En tout cas, je compte bien écrire sur ces différents sujets ces prochains mois, une fois tous ces concepts digérés…</p>
</article>


  <figure class="image" property="schema:image">
    <img src="/static/david/blog/2015/enmi.jpg" alt="" />
  </figure>


<nav id="jumpto">
  <p>
    <a rel=prev href="/david/blog/2015/javascript-abstraction/">← JavaScript et abstraction</a> | <a href="/david/blog/" title="Retour à la liste des expériences">↑</a> | <a rel=next href="/david/blog/2016/experience-ecriture/">Expérience d’écriture →</a>
  </p>
</nav>

<footer>
  <div>
    <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
    <p>
      Bonjour/Hi!
      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>
      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>).
    </p>
    <p>
      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>.
    </p>

      <p>
        Les dernières publications hebdomadaires sont :
      </p>
      <ul class="with_columns">

          <li>
            <a href="/david/stream/2019/12/31/">Merci</a>
          </li>

          <li>
            <a href="/david/stream/2019/12/27/">Intemporels</a>
          </li>

          <li>
            <a href="/david/stream/2019/12/24/">Outils</a>
          </li>

          <li>
            <a href="/david/stream/2019/12/17/">Origines</a>
          </li>

          <li>
            <a href="/david/stream/2019/12/10/">Publier</a>
          </li>

          <li>
            <a href="/david/stream/2019/12/03/">En forêt</a>
          </li>

          <li>
            <a href="/david/stream/2019/11/26/">Ecocentric</a>
          </li>

          <li>
            <a href="/david/stream/2019/11/19/">Se livrer</a>
          </li>

          <li>
            <a href="/david/stream/2019/11/12/">Dépendances</a>
          </li>

          <li>
            <a href="/david/stream/2019/11/05/">Positif</a>
          </li>

          <li>
            <a href="/david/stream/2019/10/29/">Dettes</a>
          </li>

          <li>
            <a href="/david/stream/2019/10/22/">Privilèges</a>
          </li>

          <li>
            <a href="/david/stream/2019/10/15/">Discrétion</a>
          </li>

          <li>
            <a href="/david/stream/2019/10/08/">Désespérance</a>
          </li>

          <li>
            <a href="/david/stream/2019/10/01/">Présent</a>
          </li>

          <li>
            <a href="/david/stream/2019/09/24/">Manifester</a>
          </li>

          <li>
            <a href="/david/stream/2019/09/17/">Arpenter</a>
          </li>

          <li>
            <a href="/david/stream/2019/09/10/">Nostalgie</a>
          </li>

          <li>
            <a href="/david/stream/2019/09/03/">Déconstruire</a>
          </li>

          <li>
            <a href="/david/stream/2019/08/27/">Documenter</a>
          </li>

          <li>
            <a href="/david/stream/2019/08/20/">Frustration</a>
          </li>

          <li>
            <a href="/david/stream/2019/08/13/">Holisme</a>
          </li>

          <li>
            <a href="/david/stream/2019/08/06/">1%</a>
          </li>

          <li>
            <a href="/david/stream/2019/07/30/">Exemplarité</a>
          </li>

          <li>
            <a href="/david/stream/2019/07/23/">Timelines</a>
          </li>

          <li>
            <a href="/david/stream/2019/07/16/">Écoute</a>
          </li>

          <li>
            <a href="/david/stream/2019/07/02/">Anxiété</a>
          </li>

          <li>
            <a href="/david/stream/2019/06/21/">À lier</a>
          </li>

          <li>
            <a href="/david/stream/2019/06/14/">Pauvreté</a>
          </li>

          <li>
            <a href="/david/stream/2019/06/07/">Amateur</a>
          </li>

          <li>
            <a href="/david/stream/2019/05/31/">Pollution</a>
          </li>

          <li>
            <a href="/david/stream/2019/05/24/">Apaisement</a>
          </li>

          <li>
            <a href="/david/stream/2019/05/10/">Folie</a>
          </li>

          <li>
            <a href="/david/stream/2019/05/03/">Sympathie</a>
          </li>

          <li>
            <a href="/david/stream/2019/04/12/">Péremption</a>
          </li>

          <li>
            <a href="/david/stream/2019/04/05/">Définitions</a>
          </li>

          <li>
            <a href="/david/stream/2019/03/29/">Acceptation</a>
          </li>

          <li>
            <a href="/david/stream/2019/03/22/">Dissonance</a>
          </li>

          <li>
            <a href="/david/stream/2019/03/15/">Reconnaissance</a>
          </li>

          <li>
            <a href="/david/stream/2019/03/08/">Lecture</a>
          </li>

          <li>
            <a href="/david/stream/2019/03/01/">Journaux</a>
          </li>

          <li>
            <a href="/david/stream/2019/02/22/">Écriture</a>
          </li>

          <li>
            <a href="/david/stream/2019/02/15/">Kyriarchie</a>
          </li>

          <li>
            <a href="/david/stream/2019/02/08/">Mots-serrures</a>
          </li>

          <li>
            <a href="/david/stream/2019/02/01/">Sans voie</a>
          </li>

          <li>
            <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>
          </li>

          <li>
            <a href="/david/stream/2019/01/18/">Agilité</a>
          </li>

          <li>
            <a href="/david/stream/2019/01/11/">Métaphores</a>
          </li>

          <li>
            <a href="/david/stream/2019/01/04/">Balbutiements</a>
          </li>

      </ul>

    <p>
      Voici quelques articles choisis :
      <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
      <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
      <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
      <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
      <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
      <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
      <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
      <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
      <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
      <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
      <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
      <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
      <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
      <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
      <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
      et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
    </p>
    <p>
      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>.
    </p>
    <p>
      Je ne traque pas ta navigation mais mon
      <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
      conserve des logs d’accès.
    </p>
  </div>
</footer>
<script type="text/javascript">
  ;(_ => {
    const jumper = document.getElementById('jumper')
    jumper.addEventListener('click', e => {
      e.preventDefault()
      const anchor = e.target.getAttribute('href')
      const targetEl = document.getElementById(anchor.substring(1))
      targetEl.scrollIntoView({behavior: 'smooth'})
    })
  })()
</script>

  <script>
  /* Service workers */
  if (navigator.serviceWorker) {
    window.addEventListener('load', function () {
      var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'
      function sendLinks (selector) {
        var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {
          return link.getAttribute('href')
        })
        links.push(location.pathname)  // Put the current page in cache too.
        navigator.serviceWorker.controller.postMessage({ links: links })
      }
      navigator.serviceWorker.getRegistration()
        .then(function (registration) {
          if (!registration || !navigator.serviceWorker.controller) {
            return navigator.serviceWorker.register('/serviceworker.js')
              .then(navigator.serviceWorker.ready)
              .then(function () {
                console.log('[ServiceWorker] Ready to go!')
              })
              .catch(console.error.bind(console))
          } else {
            console.log('[ServiceWorker] Send links via registration')
            sendLinks(selector)
          }
        })
      navigator.serviceWorker.addEventListener('controllerchange', function () {
        console.log('[ServiceWorker] Send links via controller change')
        sendLinks(selector)
      })
      navigator.serviceWorker.addEventListener('message', function (event) {
        var link = document.querySelector('a[href="' + event.data.link + '"]')
        if (event.data.status && link) {
          link.style.backgroundColor = '#2d7474'
          link.style.color = '#f0f0ea'

            link.setAttribute('title', 'En cache pour consultation sans connexion')

        }
      })
    })
  } else {
    console.warn('[ServiceWorker] No cache for old browsers.')
  }
</script>