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>Faut-il bloquer les publicités ? (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="http://esquisses.clochix.net/2015/09/21/pub/">

<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>
  Faut-il bloquer les publicités ? (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="http://esquisses.clochix.net/2015/09/21/pub/">Source originale du contenu</a></h3>
    <p>J’ai été si outré par quelques phrases portées à ma connaissance cette semaine que je reprends le clavier le temps d’un rapide coup de gueule. Dans le <a href="http://standblog.org/blog/post/2015/08/27/Flicage-brouillon-Partie-4-chapitre-28-Choisir-et-personnaliser-son-navigateur">28<sup>e</sup> chapitre de son prochain livre</a>, qu’il prépublie sur son carnet, Tristan conseille de ne pas bloquer la réclame dans son navigateur. Une fois n’est pas coutume, je ne peux pas être moins d’accord avec lui, surtout au vu de ses arguments.</p>

<p>J’encourage pour ma part tou·te·s les internautes à bloquer par tous les moyens les publicités qui envahissent certains sites. Quelques raisons en vrac de refuser la réclame sur le Web :</p>

<ul>
  <li>la publicité est bien plus efficace si elle est ciblée. De ce fait, nombre de régies publicitaires ne se contentent pas d’afficher des bandeaux colorés, mais tracent toutes vos habitudes, afin de cerner votre profil et d’augmenter la probabilité que vous cliquiez sur leurs affiches. Par exemple en vous bombardant de réclames pour des régimes si elles détectent que vous complexez sur votre poids. Les publicités espionnent ce que vous faites, vous traquent de site en site. <em>Pour préserver votre intimité, bloquez les publicités !</em></li>
  <li>grâce à ces profils, les publicités créent des envies, déclenchent des actes (des achats par exemple) que vous n’aviez pas décidés consciemment. C’est une forme de manipulation, de viol de votre libre-arbitre. <em>Pour conserver votre libre arbitre, bloquez les publicités !</em></li>
  <li>les publicités rendent la navigation sur de nombreux sites désagréables. Leur poids ralentit considérablement le chargement, leurs couleurs criardes, voire leurs animations, distraient l’œil de sa lecture. Parfois une publicité apparue soudainement intercepte un de vos clics et vous entraîne sur un site que vous ne souhaitiez pas visiter. Lorsque votre connexion internet est de faible qualité, par exemple sur un ordiphone, la publicité rend la navigation particulièrement désagréable. <em>Pour votre confort, bloquez la publicité </em>!</li>
  <li>le poids de la publicité ralentit le chargement des pages, mais augmente aussi la quantité de données téléchargées. Si vous n’avez pas une connexion illimitée (sur mobile), vous risquez de payer pour le chargement des publicités. Et même si vous avez une connexion illimitée, ces publicités pèsent dans le trafic réseau de votre opérateur, consomment beaucoup de bande passante, qu’à un moment ou un autre il faut bien payer. <em>Pour le bien-être de votre porte-monnaie, bloquez la publicité !</em> (et pour les ours polaires, car afficher les bannières Flash consomme de l’électricité, donc contribue au réchauffement de la planète) ;</li>
  <li>la publicité affiche sur des sites auxquels vous faites confiance des contenus créés par des tiers qui eux ne sont pas forcément de confiance. Des ordinateurs sont régulièrement infectés par des logiciels malveillants diffusés <em>via</em> des publicités piégées affichés sur des sites anodins. Récemment encore, des sites de Yahoo ont diffusé à leur insu de tels logiciels malveillants. Bloquer Flash réduit considérablement la menace, mais pas totalement. <em>Pour votre sécurité, bloquez la publicité !</em></li>
  <li>TF1 est une entreprise qui vend à des annonceurs du temps de cerveau de ses téléspectateurs. Dans un modèle économique basé sur la publicité, vous devenez le produit dont le site fait commerce. Si un site vit essentiellement de la publicité, alors c’est que vous êtes la marchandise qu’il vend (un célèbre évangéliste francophone utilise une métaphore porcine pour rappeler ce fait et encourager les internautes à payer les services qu’ils utilisent). <em>Pour ne pas être une marchandise, bloquez la publicité !</em></li>
  <li>certains médias dépendent de la publicité. Leur but est donc de maximiser le nombre de lecteurs de leurs articles. Quitte à recourir à des méthodes putassières, comme les titres sensationnalistes sans rapport avec le fond de l’article. Parfois, la rémunération des auteurs dépend du nombre de lecteurs de leurs articles. Dans certains médias, les journalistes sont donc encouragés à écrire des articles générant le plus de vues possibles. La qualité ne payant pas toujours, c’est le plus souvent un encouragement au sensationnalisme, aux approximations, à la création et à la montée en épingle de polémiques… À terme, tout cela décrédibilise les sites d’information et les journalistes dans leur ensemble. Un journaliste ne devrait pas être évalué sur sa capacité à faire gagner de l’argent aux annonceurs. On a vu également que certains annonceurs influent sur la ligne éditoriale des médias. Apple par exemple ne veut pas que ses publicités soient à côté d’informations tragiques. Va-t-on arrêter d’informer sur les guerres et autres catastrophes pour faire plaisir aux annonceurs ? <em>Pour la survie du journalisme, bloquez la publicité !</em></li>
  <li>un des gros problèmes du Web est la difficulté à rémunérer les auteurs qui le souhaitent. Il n’existe toujours pas de mécanisme simple, universel, respectueux de la vie privée, largement déployé, permettant de rémunérer l’auteur d’un article. Je suis persuadé que c’est une des plus grandes faiblesses actuelles du Web. Elle perdure notamment parce que le besoin n’est pas criant : la publicité joue ce rôle pour de nombreux sites, donc ils n’ont pas besoin d’inventer un meilleur système. Si de nombreux internautes bloquaient les réclames, le besoin d’inventer de nouveaux modèles économiques se ferait plus pressant. Et j’espère que ces modèles seraient plus vertueux. <em>Pour encourager le Web à évoluer, bloquez la publicité !</em></li>
  <li>je vous épargne le couplet politique rappelant que la publicité est un moyen de propagande pour un modèle de société suicidaire et encourage les discriminations en véhiculant d’innombrables clichés. <em>Si vous avez du cœur, bloquez la publicité !</em></li>
</ul>

<p>Je trouve par ailleurs discutables les arguments de Tristan pour encourager ses lecteurs et lectrices à ne pas remettre en question les modèles économiques fondés sur la vente de l’attention des citoyens :</p>

<p>« En effet, la publicité est la principale si ce n’est l’unique façon pour l’immense majorité des sites Web de se rémunérer » affirme-t-il. Je brandis aussitôt ma pancarte pour demander les chiffres permettant d’affirmer que « l’immense majorité des sites Web » se rémunère grâce à la réclame. Wikipédia ne fait à ma connaissance pas appel à la publicité, pas plus que des millions de sites personnels, les sites vitrines qui présentent une entreprise, une association ou autre. Je ne suis pas sûr que l’existence de la majorité des sites Web dépende de la réclame. Le Web ne mourra pas si demain nous bloquons toutes et tous les réclames. Si j’ai bonne mémoire, la publicité était absente des premiers sites qui m’ont fait aimer le Web, qui m’ont fait découvrir ses potentialités pour la liberté d’expression, le débat d’idée ou le partage de connaissances. Le Web peut parfaitement se passer de la publicité.</p>

<p>« En bloquant la publicité (…) les sites n’auront plus les moyens de publier du contenu original et de qualité ». Je ne suis pas du tout sûr du lien entre la publication de contenu « original et de qualité » et les sites vivant de la vente de temps de cerveau disponible. Intuitivement (oui, ça n’est pas scientifique), j’aurais plutôt l’impression que les sites tirant l’essentiel de leurs revenus de la publicité sont plutôt des fermes à contenu, qui ne publient rien d’original mais pompent des informations publiées par d’autres en les affublant de titres putassiers pour « faire du clic ».</p>

<p>« C’est d’autant plus gênant que l’histoire prouve que la presse indépendante est une condition essentielle pour avoir une démocratie en bonne santé… ». Euh, quel est le rapport entre le financement de sites Web par la publicité, une presse indépendante, et la choucroute ? Le <em>Canard enchainé</em>, symbole de la presse indépendante française, a publié il y a quelques jours son bilan financier 2014. Le journal est toujours en excellente santé. Or, il ne me semble pas qu’il se rémunère en infligeant des placards publicitaires à ses lecteurs. Sur le Web, l’équivalent du <em>Canard</em>, <em>Mediapart</em>, est également résolument sans publicité, et n’a pas l’air de s’en porter plus mal. Tout comme des dizaines de médias indépendants qui enquêtent et informent, <a href="http://www.bastamag.net/"><em>Basta</em></a>, <a href="http://cqfd-journal.org/"><em>CQFD</em></a>, <a href="http://www.fakirpresse.info/"><em>Fakir</em></a>, <a href="http://www.politis.fr/"><em>Politis</em></a> et <a href="http://www.bastamag.net/Itineraire-conseille">tant d’autres</a>. Bien sûr, de nombreux sites de diffusion d’information, comme <em>Le Figaro</em>, <em>Libération</em> ou <em>Le Monde</em>, affichent de la publicité, et en dépendent en partie. Mais peut-on qualifier ces entreprises, propriété d’oligarques, de médias indépendants essentiels à la démocratie ? Lorsqu’un marchand d’armes ou un quelconque affairiste s’achète des médias, le fait-il afin de garantir l’existence d’un des piliers indispensables de la démocratie, ou pour défendre ses intérêts ? Le ménage en cours dans les médias du groupe Bolloré n’est que le dernier exemple de l’indépendance toute relative des organes contrôlés par des financiers. Par ailleurs, bien conscients de l’importance des médias pour la démocratie, les citoyens français consacrent une partie de leurs impôts à financer la presse. D’après <a href="https://fr.wikipedia.org/wiki/Aides_%C3%A0_la_presse_en_France">Wikipédia</a>, nous avons versé en 2012 1,2 milliards d’aides à la presse. <em>Le Figaro</em> de Serge Dassault a été subventionné à hauteur de 18,2 millions d’euros. Nous participons donc déjà, <em>via</em> ces aides, <em>via</em> la redevance audio-visuelle, à la survie de la presse (et à l’enrichissement d’éditocrates qui nous crachent à la gueule à longueur de temps). Est-il indispensable, pour sauver la démocratie, de s’infliger également les encarts promotionnels qui débordent de leurs sites ?</p>

<p>Je m’égare un peu, et ne voudrais pas y passer toute la journée, donc, pour conclure, un dernier conseil : <em>bloquez les publicités !</em> Merci de votre attention.</p>

<p><strong>Addendum</strong> : suite aux réactions à cet article, j’ai publié <a href="http://esquisses.clochix.net/2015/09/15/pub/#light">une suite</a>. Concrètement, comment se protéger de la publicité ? Comment soutenir malgré tout nos sites favoris ? Des questions auxquelles je n’ai pas de réponse.</p>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="http://esquisses.clochix.net/2015/09/21/pub/">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>