davidbgk
/
larlet-fr-david-cache

<!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>Le livre numérique est mort : vive le livre numérique (archive) — 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/">

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://medium.com/@studiowalrus/le-livre-numerique-est-mort-vive-le-livre-numerique-6fae02cd829e">

<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>
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  Le livre numérique est mort : vive le livre numérique (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="https://medium.com/@studiowalrus/le-livre-numerique-est-mort-vive-le-livre-numerique-6fae02cd829e">Source originale du contenu</a></h3>
    <div class="section-inner layoutSingleColumn"><p name="6426" class="graf--p graf--first">Ce matin, en ouvrant le journal, un avis de décès d’un genre un peu particulier a attiré notre attention. Bien sûr, en tant qu’éditeurs, nous sommes sensibles à ces questions et furetons régulièrement sur les sites d’informations. Mais nous ne nous attendions pas à un tel choc.</p><blockquote name="17e3" data-align="center" class="graf--blockquote">« Toute l’industrie du livre — éditeurs, libraires, distributeurs, diffuseurs et services de fabrication, etc — est au regret de vous annoncer la mort du</blockquote><blockquote name="96db" data-align="center" class="graf--blockquote">— LIVRE NUMÉRIQUE (.EPUB) —</blockquote><blockquote name="1d6b" data-align="center" class="graf--blockquote">La cérémonie aura lieu en privé sur internet. Les messages de condoléance sont à adresser au format .txt ou .pdf. Les couronnes HTML et CSS sont les bienvenues, mais devront être déposées à l’entrée. »</blockquote><p name="06d3" class="graf--p">Après avoir fait circuler l’article de mains en mains et avoir échangé quelques réflexions, la surprise est vite retombée. Après tout, nous avions décelé quelques indices, des signes avant-coureurs qui ne trompent pas, un peu quand une vieille cousine commence à trop tousser aux repas de famille.</p><p name="c616" class="graf--p">L’.EPUB était pourtant promis à une belle vie. Dès sa naissance, les bonnes fées s’étaient penchées sur son berceau : un format reconnu et accepté comme standard de référence pour toute une industrie — ça changeait des mp3, mp4, aac, et autres wma de l’industrie du disque, restons polis et ne parlons même pas du cinéma —, un langage simple à mettre en forme et hautement adaptatif (HTML et CSS), accessibles aux plus riches entreprises comme au plus petit des auteurs autopubliés et la promesse d’une évolution conforme aux besoins des designers, éditeurs, etc.</p><figure name="a8a0" class="graf--figure"><div class="aspectRatioPlaceholder is-locked"><p class="aspect-ratio-fill"/><img class="graf-image" data-image-id="1*y3UTk8UdkVAC8VvXE_sJiw.jpeg" data-width="1024" data-height="589" data-action="zoom" data-action-value="1*y3UTk8UdkVAC8VvXE_sJiw.jpeg" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*y3UTk8UdkVAC8VvXE_sJiw.jpeg"/></div><figcaption class="imageCaption">Geoffrey Fairchild — It was a pleasure to burn — Flickr — Creative Commons-BY</figcaption></figure><p name="5fe7" class="graf--p">Et puis les vieux démons sont revenus à la charge : les protections que les grands pontes du livre avaient tant décriées <em class="markup--em markup--p-em">(souvenons-nous en riant : « Le livre ne commettra pas les erreurs du disque et du cinéma ») </em>ont refait surface et nos livres numériques se sont retrouvés bardés de DRM, ces verrous qui empêchent la copie, le partage et qui, acessoirement, empêchent ceux qui les ont achetés de les lire parfois. Insatisfaits d’une mise en page que d’aucuns estimaient pauvre, les logiciels historiques de mise en page <em class="markup--em markup--p-em">print</em> ont intégré dans leurs mécanismes des systèmes de conversion <em class="markup--em markup--p-em">fixes, </em>et le <em class="markup--em markup--p-em">fixed-layout </em>est apparu, réinventant le PDF que l’industrie avait tant décrié quelques années plus tôt. Les formats propriétaires sont arrivés là-dessus et ont commencé à envahir le marché : lisibles uniquement sur Kindle, lisible uniquement sur iPad, lisibles uniquement debout, assis, couché… Et si ce n’était que ça. Par des politiques de prix démentielles, les ebooks ont été mis sur le marché sans grande conviction, presque avec l’envie de ne pas les vendre… et les Français sont tombés dans le panneau, en devenant l’un des pays où les habitants sont les plus réfractaires au livre numérique.</p><p name="3d1d" class="graf--p">À vrai dire, nous pouvons les comprendre. Pourquoi s’entêter à acheter des versions illisibles, souvent plus chères qu’un livre de poche (jusqu’à deux ou trois fois plus), de livres qu’on peut obtenir facilement, pour moins cher et sans licences de lecture qui ne vous en confèrent même pas la propriété ?</p><p name="4f65" class="graf--p">Alors ce qui devait arriver arriva : le format EPUB s’est lentement laissé dépérir. Bien entendu, si tout le monde s’y était mis en même temps, si personne n’avait renâclé, si on avait mis de côté les vieux démons du passé, peut-être en aurait-il été autrement. Mais « avec des si, on mettrait Paris en bouteille »… Bien sûr, nous noircissons le tableau. Le format .epub n’est pas encore mort, mais il donne des signes de faiblesse, ou plutôt <em class="markup--em markup--p-em">d’impuissance</em>, que nous avons listés plus haut et qui nous amènent à réfléchir à son avenir prochain.</p><p name="2991" class="graf--p">Nous partons d’un constat, ou plutôt d’une interrogation : comment, à partir de langages aussi libres et simples que le HTML <em class="markup--em markup--p-em">(le HTML est le langage de balisage qui permet d’afficher cette page web, mais aussi vos ebooks… en fait, il est l’architecture d’une écrasante majorité du texte numérique)</em>, a-t-on pu arriver à une situation aussi fermée, aussi inégalitaire et aussi illisible, autant pour les professionnels que pour les lecteurs ? La réponse est simple : nous avons voulu réinventer des choses qui n’avaient pas besoin de l’être, à commencer par… le web.</p><p name="9f0a" class="graf--p">Car si l’on y réfléchit un instant, un ebook n’est rien d’autre qu’un mini-site web encapsulé pour être consulté en mode <em class="markup--em markup--p-em">offline</em>, rien de plus. Et c’est notre besoin de jouer à la marchande « en échange de ton argent, je te transmets un fichier tangible et stockable » qui nous a propulsés droit dans le mur, et poussés à inventer des solutions toujours moins pratiques, plus compliquées et plus fermées. Alors que le web était là depuis le début, et qu’il nous tendait les mains. Nous avons réinventé le web, en moins bien. Nous avons voulu le plier à nos exigences marketing, techniques et sécuritaires, mais il ne s’est pas laissé faire. Mais il y a néanmoins une bonne nouvelle : si nous nous sommes perdus en chemin, nous sommes toujours dans la bonne forêt. Le .EPUB est un format perméable et soluble, qui permettra à ceux qui ont choisi cette voie de basculer vers la transition facilement, presque sans douleur. Quelle est cette transition ? Pour nous, elle est claire : c’est le retour aux sources du web. Le livre sur internet, consultable en ligne n’importe quand et n’importe où, depuis votre navigateur. <em class="markup--em markup--p-em">Books in browsers.</em></p><figure name="380c" class="graf--figure"><div class="aspectRatioPlaceholder is-locked"><p class="aspect-ratio-fill"/><img class="graf-image" data-image-id="1*FPzPWMbtCkxT-F7GzDIQYg.jpeg" data-width="1024" data-height="683" data-action="zoom" data-action-value="1*FPzPWMbtCkxT-F7GzDIQYg.jpeg" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*FPzPWMbtCkxT-F7GzDIQYg.jpeg"/></div><figcaption class="imageCaption">Johan Larsson, Browser — Flickr Creative Commons — BY</figcaption></figure><p name="35d0" class="graf--p">Nous entendons d’ici les cris d’indignation. Bien entendu, nous ne parlons pas d’un futur applicable dans un an, ni même dans cinq. Mais peut-être dans dix ou quinze en revanche, lorsque la connexion sera comme une seconde nature pour nos appareils, sans restriction de volume de données et de coût, et que les territoires seront entièrement couverts <em class="markup--em markup--p-em">(et bien couverts). </em>Et ce n’est pas la seule condition : il faudra également qu’éditeurs et constructeurs fassent preuve de bonne volonté en autorisant les lecteurs à sauvegarder les contenus consultés en ligne, à les archiver, à en conserver des copies, c’est essentiel pour la sauvegarde du patrimoine et la transmission. Nous entrons dans une société d’abonnement où plus rien d’autre ne compte que la consultation, mais il s’agit d’un miroir aux alouettes : à force de prôner la non-propriété à tout-va, on finira par faire entrer dans la tête des gens que le livre n’est qu’un consommable comme les autres. Profitons que le livre soit encore un symbole fort auquel on peut s’identifier, se référer, avec lequel on peut se bâtir, qu’on peut partager, échanger, en bref, quelque chose d’important, de tangible, et ce même s’il est immatériel. Le livre est un matériau d’exception, de celui dont on forge les âmes, qu’il ne faut pas laisser se diluer dans la médiocrité.</p><p name="3383" class="graf--p">Pourquoi le livre-web ? Parce qu’il est le livre numérique par excellence. Accessible partout, depuis n’importe quel terminal, lisible sur n’importe quelle taille d’écran, il utilise 100% des capacités des navigateurs pour nous offrir des expériences connectées, multimédias, interactives, sans s’arracher les cheveux pour trouver des solutions bâtardes avec des appareils qui ne sont pas faits pour cela. Couplé à des solutions de sauvegarde, de transfert, d’annotations, de copie privée, il devient la bibliothèque numérique dont nous avons tous rêvé en nous lançant dans l’ebook. Ajouté à cela des solutions simples, transparentes et honnêtes de rétribution des éditeurs et des artistes, il coupe l’herbe sous le pied aux intermédiaires trop gourmands et aux multinationales toujours plus envahissantes, qui ne rêvent que de nous enfermer dans un écosystème. Le livre-web est son propre écosystème, qui navigue lui-même sur le grand océan de données qu’est internet.</p><p name="1818" class="graf--p">Nous croyons fermement à la mort programmée de l’EPUB. Elle est inscrite dans ses gênes depuis le début. L’EPUB est une plateforme, un plongeoir, un tremplin vers autre chose. Cet autre chose fait peur, parce qu’il est véritablement dématérialisé et qu’il nous pousse à réfléchir à des solutions plus équilibrées, plus vastes en terme de possibilités, mais aussi plus pérennes. L’EPUB était une parenthèse. Le livre-web est un gage de continuité et d’ouverture. Certains éditeurs commencent à emprunter cette voie outre Atlantique, et pas des moins prestigieux. Nous sommes prêts à parier que d’autres le feront très bientôt de ce côté de l’océan.</p><p name="6b8f" class="graf--p">Ce n’est que le début.</p><p name="176e" class="graf--p">Et si vous êtes curieux, nous vous proposons de jeter un œil à notre propre vision du web-livre : <a target="_blank" href="http://www.radius-experience.com" data-href="http://www.radius-experience.com" class="markup--anchor markup--p-anchor" rel="nofollow">le Projet <em class="markup--em markup--p-em">Radius</em></a>.</p><figure name="d4a9" class="graf--figure"><div class="aspectRatioPlaceholder is-locked"><p class="aspect-ratio-fill"/><img class="graf-image" data-image-id="1*N8EMyw5Dw64x61hF-HfFeg.png" data-width="966" data-height="248" data-action="zoom" data-action-value="1*N8EMyw5Dw64x61hF-HfFeg.png" src="https://d262ilb51hltx0.cloudfront.net/max/800/1*N8EMyw5Dw64x61hF-HfFeg.png"/></div></figure><p name="52c1" class="graf--p graf--empty"><br/></p><p name="f942" class="graf--p graf--last"><em class="markup--em markup--p-em">Photos originales : </em><a target="_blank" href="https://www.flickr.com/photos/gcfairch/4081513150/in/photolist-MLnGM-ciLT1h-7iSbZT-7iW4V5-7iW3FS-5HmVpg-7iW3Z5-7iSbGc-7iW4hj-7iS9Vp-ciKuYs-cij7JU-7Njb7-ciKuVq-7iW4zL-nAqoxr-7dEPEo-7tApxB-953pHv-953pFv-ciLT3U-8Ebj1w-81cLho-ai6w7F-4AKLrQ-aeipS5-8JMvMz-dmyfCP-969unS-pTiCk-9dz6L-953pEX-9EYKR6-9yR4HB-3CzLc8-9DEfBs-5BamLG-cij7yW-71ZSKY-7xsxDK-7xsywB-7xsy94-7xsyXk-9EYKyn-6uvZxA-aCsTb4-p4iFho-87b8gN-f6vnbm-JpoPK" data-href="https://www.flickr.com/photos/gcfairch/4081513150/in/photolist-MLnGM-ciLT1h-7iSbZT-7iW4V5-7iW3FS-5HmVpg-7iW3Z5-7iSbGc-7iW4hj-7iS9Vp-ciKuYs-cij7JU-7Njb7-ciKuVq-7iW4zL-nAqoxr-7dEPEo-7tApxB-953pHv-953pFv-ciLT3U-8Ebj1w-81cLho-ai6w7F-4AKLrQ-aeipS5-8JMvMz-dmyfCP-969unS-pTiCk-9dz6L-953pEX-9EYKR6-9yR4HB-3CzLc8-9DEfBs-5BamLG-cij7yW-71ZSKY-7xsxDK-7xsywB-7xsy94-7xsyXk-9EYKyn-6uvZxA-aCsTb4-p4iFho-87b8gN-f6vnbm-JpoPK" class="markup--anchor markup--p-anchor" rel="nofollow"><em class="markup--em markup--p-em">Geoffrey Fairchild</em></a><em class="markup--em markup--p-em"> (CC-BY — Flickr) ; </em><a target="_blank" href="https://www.flickr.com/photos/johanl/4397800453/in/photolist-7GBSRK-7JN6oA-5FXgMX-n1NAEe-mMs5rB-fooFd-yGMeK-5imLvD-7ctRgR-8ujgzs-3zVaG-5Zgx6-9sfc3J-ddYaVo-83gtho-iAZCc-fooHf-x9t1x-5WBXCD-7uKA9V-k3kVT-9ro7X7-5idMwU-iuzM9-48tt9-deTMor-dqk5Nq-83n7xj-4oGcRM-5WwnrF-85yDmv-85yDcR-avw6z9-md4BWp-hDqWm-9z9Dc-7ksUeD-5Zhmev-5iAmog-5jV3ze-3zVaS-5EHp4g-89kBcc-7hTnU5-adadGP-2XL2BJ-4H2B23-7oEyea-7vENwy-iorZt" data-href="https://www.flickr.com/photos/johanl/4397800453/in/photolist-7GBSRK-7JN6oA-5FXgMX-n1NAEe-mMs5rB-fooFd-yGMeK-5imLvD-7ctRgR-8ujgzs-3zVaG-5Zgx6-9sfc3J-ddYaVo-83gtho-iAZCc-fooHf-x9t1x-5WBXCD-7uKA9V-k3kVT-9ro7X7-5idMwU-iuzM9-48tt9-deTMor-dqk5Nq-83n7xj-4oGcRM-5WwnrF-85yDmv-85yDcR-avw6z9-md4BWp-hDqWm-9z9Dc-7ksUeD-5Zhmev-5iAmog-5jV3ze-3zVaS-5EHp4g-89kBcc-7hTnU5-adadGP-2XL2BJ-4H2B23-7oEyea-7vENwy-iorZt" class="markup--anchor markup--p-anchor" rel="nofollow"><em class="markup--em markup--p-em">Johan Larsson</em></a><em class="markup--em markup--p-em"> (CC-BY Flickr) ; Walrus (2014)</em></p></div>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="https://medium.com/@studiowalrus/le-livre-numerique-est-mort-vive-le-livre-numerique-6fae02cd829e">Source originale</a> |
    <a href="/david/stream/2019/">Accueil du flux</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>
      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>