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>The Year I Didn’t Retweet Men (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/the-only-woman-in-the-room/the-year-i-didnt-retweet-men-79403a7eade1">

<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>
  The Year I Didn’t Retweet Men (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/the-only-woman-in-the-room/the-year-i-didnt-retweet-men-79403a7eade1">Source originale du contenu</a></h3>
    <div class="section-content"><div class="section-inner sectionLayout--insetColumn"><p name="cbf8" id="cbf8" class="graf graf--p graf--leading">In its early days, Twitter used to have a suggested user list, people whose Twitter accounts were recommended to people signing up for the service. If you got added to the list, you ended up a bit like the crappy software that’s preinstalled on Windows laptop — casual users of technology would just get you as part of the experience and might not even know how to unfollow your account.</p><p name="c0d6" id="c0d6" class="graf graf--p graf-after--p">That happened to me and as a result, today I’ve got almost half a million Twitter followers. Maybe half of them are people who chose to follow me, for whatever reason, and half of them got me as an inexplicable nerdy Indian dude shoehorned in with the Kardashians and Rob Delaneys that came bundled with their Twitter account. More importantly, according to Twitter’s analytics tools, over 3/4 of my Twitter followers are men.</p><figure name="95de" id="95de" class="graf graf--figure graf-after--p"><div class="aspectRatioPlaceholder is-locked" style="max-width: 500px; max-height: 164px;"><div class="aspectRatioPlaceholder-fill" style="padding-bottom: 32.800000000000004%;"></div><div class="progressiveMedia js-progressiveMedia graf-image" data-image-id="1*FEk3B9bNDieeH4BLvWrLng.png" data-width="500" data-height="164"><img src="https://cdn-images-1.medium.com/freeze/max/60/1*FEk3B9bNDieeH4BLvWrLng.png?q=20" crossorigin="anonymous" class="progressiveMedia-thumbnail js-progressiveMedia-thumbnail"><canvas class="progressiveMedia-canvas js-progressiveMedia-canvas"></canvas><img class="progressiveMedia-image js-progressiveMedia-image" data-src="https://cdn-images-1.medium.com/max/1600/1*FEk3B9bNDieeH4BLvWrLng.png"><noscript class="js-progressiveMedia-inner"><img class="progressiveMedia-noscript js-progressiveMedia-inner" src="https://cdn-images-1.medium.com/max/1600/1*FEk3B9bNDieeH4BLvWrLng.png"></noscript></div></div><figcaption class="imageCaption">Twitter Analytics breakdown of @anildash followers by gender, February 12, 2014</figcaption></figure><p name="d763" id="d763" class="graf graf--p graf-after--figure">More than a year ago, I began to look at a different aspect of my Twitter experience, the identities of the people whom <em class="markup--em markup--p-em">I </em>follow. Part of the reason was that we’ve been building this tool called <a href="https://thinkup.com/" data-href="https://thinkup.com/" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">ThinkUp</a>, which is all about being more thoughtful about the way we use our social networks. But part of it was my growing sense of social responsibility about what messages I choose to share and amplify, and whose voices and identities I strive to bring to a broader audience.</p><p name="df85" id="df85" class="graf graf--p graf-after--p graf--trailing">At the time, there were tools (since gone offline) that would imprecisely estimate the gender of people you follow by using lists of names commonly used by various genders, and they showed that I was following roughly 52% men and 48% women, not counting accounts that belonged to organizations. These tools do not account for other genders or identities, and I have not been able to find software which does, so I only have statistics which represent gender as a binary, unfortunately. (Like my cofounder Gina Trapani, I don’t believe in <a href="http://smarterware.org/7388/the-case-against-drop-down-identities" data-href="http://smarterware.org/7388/the-case-against-drop-down-identities" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">drop-down identities</a>, so I’d welcome software that better models the actual people I’m connected to.)</p></div></div>

<p></section><section name="eeaa" class="section section--body section--last"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-inner sectionLayout--insetColumn"><p name="a2c1" id="a2c1" class="graf graf--p graf--leading">In the midst of this research, I found the <a href="http://twee-q.com/" data-href="http://twee-q.com/" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Twee-Q</a> tool, another imprecise-but-useful bit of software which showed a guessed gender for people whose voices I was amplifying through retweets. I don’t remember the exact calculation, but at the time, I believe my RTs were about 80% men.</p><p name="afd2" id="afd2" class="graf graf--p graf-after--p">I followed a nearly equal ratio of women and men, but retweeted men <strong class="markup--strong markup--p-strong">three times as often</strong> as I retweeted women. This, despite my knowing how underrepresented women’s voices are in the areas I obsess over, such as technology and policy and culture. I could do better.</p><h3 name="cf79" id="cf79" class="graf graf--h3 graf-after--p">Prince and the Resolution</h3><p name="eecc" id="eecc" class="graf graf--p graf-after--h3">Thus, my new year’s resolution in 2013 was to only retweet women.</p><p name="c813" id="c813" class="graf graf--p graf-after--p">This turned out to be the easiest resolution I’ve ever made. I didn’t post about it because there was no reason to, and the only exception to the rule was when there were organizations or advocacy efforts whose accounts were either substantially ungendered or whose online presence I knew was staffed by women.</p><p name="f2f4" id="f2f4" class="graf graf--p graf-after--p">The only significant challenge to this rule that I faced in 2013 was the <a href="https://twitter.com/3rdeyegirl" data-href="https://twitter.com/3rdeyegirl" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">@3rdeyegirl</a> account, which was nominally staffed by Prince’s (all-woman) band 3rd Eye Girl, but which I knew was also often ghost-written by Prince. For the most part, the account posted nothing substantial enough to be worth retweeting, so I didn’t think about it until August, when <a href="http://www.stereogum.com/1437942/prince-joins-twitter/news/" data-href="http://www.stereogum.com/1437942/prince-joins-twitter/news/" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">Prince made official</a> his presence on the account. So I retweeted his first tweet and then went back to observing my rule.</p>
<h3 name="2107" id="2107" class="graf graf--h3 graf-after--p">So, What Happened?</h3><p name="80ae" id="80ae" class="graf graf--p graf-after--h3">Maybe the most surprising thing about this experiment in being judicious about whom I retweet is how <em class="markup--em markup--p-em">little</em> has changed. I just pay a little bit of attention before I tap on the icon in my Twitter app, but it’s been effortless to make the switch, and has gotten me far more “thanks for the retweet!” messages than I used to get.</p><p name="4740" id="4740" class="graf graf--p graf-after--p">More broadly, I found the only times I even had to think about it were very male-dominated conversations like the dialogue around an Apple gadget event. Even there, I’d always find women saying the same (or better!) things about the moment whose voices I could amplify instead of the usual suspects. And for the bigger Twitter moments I love, like award shows and cultural events, there are an infinite number of women’s voices to choose from.</p><p name="a3bf" id="a3bf" class="graf graf--p graf-after--p">One thing that has happened, and I’m not sure if it’s attributable to my change in retweet behavior, is that I’ve been in far more conversations with women, and especially with women of color, on Twitter in the past year. That’s led to me following more women, and has caused a radical shift in how I <em class="markup--em markup--p-em">perceive</em> my time on Twitter, even though its actual substance isn’t that different.</p><p name="dc36" id="dc36" class="graf graf--p graf-after--p">When my peers in the tech industry complain that “everyone” is talking about some inane meme or horrible tech story, I find it’s much less dominant in my stream. Conversely, when conversations such as <a href="http://storify.com/niche/solidarity-is-for-white-women" data-href="http://storify.com/niche/solidarity-is-for-white-women" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">#SolidarityIsForWhiteWomen</a> or <a href="http://notyourasiansidekick.com/" data-href="http://notyourasiansidekick.com/" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">#NotYourAsianSidekick</a> or, say, any airing of <em class="markup--em markup--p-em">Scandal</em> takes place, the dialogue seems to be in surround sound, much more pervasive and all-encompassing than the usual “tucked away in the sidebar of another article” treatment such voices get.</p><p name="7aef" id="7aef" class="graf graf--p graf-after--p">For me, for my <em class="markup--em markup--p-em">experience</em>, it’s better. I feel happier about the time I spend on Twitter, and it’s made me try to be more thoughtful, and more disciplined with other things I do in my time online. Some of those things are structural, like playing with repeated refrains within tweets, and some were more experimental, like testing patterns of posting at certain times or with certain rhetorical devices. I retweeted the <a href="http://twitter.com/stopandfrisk" data-href="http://twitter.com/stopandfrisk" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">@stopandfrisk</a> account daily for weeks, and found that people who knew me in the tech world, who hadn’t been familiar with the issue, were suddenly bringing it up unprompted in meetings. I’d struggled with doing so at first (Stop and Frisk isn’t run by a woman, features a profile photo of Michael Bloomberg, and is an issue that primarily impacts men), but given that so many women care so deeply about the issue, it didn’t seem at all in contradiction with the spirit of my overall experiment in retweeting women.</p><p name="d69f" id="d69f" class="graf graf--p graf-after--p">More to the point, I wouldn’t have thought of a sustained campaign of amplifying voices as being meaningful <em class="markup--em markup--p-em">without</em> first having chosen to be mindful of who I retweet. A necessary side effect of this effort was that I stopped hate-retweeting, the practice where somebody like me who has a lot of followers retweets the message of someone they disagree with, so that people can pile on them in disagreement. It’s a fairly odious tactic, and I’m embarassed that I’d done it in the past. Once I was only amplifying voices that were worth hearing, it faded away.</p><h3 name="2407" id="2407" class="graf graf--h3 graf-after--p">Give it a try.</h3><p name="27a0" id="27a0" class="graf graf--p graf-after--h3">Based on my experiences, my recommendation to others is simple: Give it a try. If you’re inclined, try being mindful of whose voices you share, amplify, validate and promote to others. For me, it was giving a platform to women where I wasn’t able to mansplain the things they were already saying, but instead just sharing out their own thoughts in their own words. It may be by issue, or by identity, or by community, or some other consideration.</p><p name="53e2" id="53e2" class="graf graf--p graf-after--p graf--trailing">But we spend so very much of our time on these social networks, and there’s so much we can do to right the wrongs we’ve seen in other media, through simple, small actions. This one’s been a delightful and fun place to start.</p></div></div></section></p>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="https://medium.com/the-only-woman-in-the-room/the-year-i-didnt-retweet-men-79403a7eade1">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>