davidbgk
/
larlet-fr-david

<!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,initial-scale=1">
<!-- Required to make a valid HTML5 document. -->
<title>Ouvertance — David Larlet</title>
<!-- That good ol' feed, subscribe :). -->
<link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
<link rel="manifest" href="/static/david/icons2/site.webmanifest">
<link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
<meta name="msapplication-TileColor" content="#f0f0ea">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<script type="text/javascript">
    function toggleTheme(themeName) {
        document.documentElement.classList.toggle(
            'forced-dark',
            themeName === 'dark'
        )
        document.documentElement.classList.toggle(
            'forced-light',
            themeName === 'light'
        )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
        toggleTheme(selectedTheme)
    }
</script>

<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick" data-instant-intensity="viewport-all">

<article>
<h1>Ouvertance</h1>
<nav>
  <p class="center">
    <a rel="prev" href="/david/2020/06/18/" title="Publication précédente : Mouvements">←</a> •
    <a href="/david/" title="Aller à l’accueil" tabindex="1">🏠</a>
    
  </p>
</nav>
<hr>

<p><em>Je n’ai pas trouvée de meilleure traduction à « openness ».</em></p>
<h2 id="accessibilite">Accessibilité <a href="#accessibilite" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote lang="en">
<p>Any Government of Canada service (and ones delivered and built by third parties) needs to meet <a href="https://www.w3.org/TR/WCAG20/">WCAG 2.0 AA</a> accessibility standards. This is mostly the basics e.g. keyboard navigable, has sufficient colour contrast, has good headings and image alt-text, etc.</p>
<p>Not meeting WCAG 2.0 AA is a semi-frequent source of lawsuits <mark>that the Government of Canada always loses</mark>.</p>
<p><cite><em><a href="https://sboots.ca/2020/06/16/building-digital-services-in-the-canadian-government/">A short introduction to building digital services in the Canadian government</a></em> (<a href="/david/cache/2020/cd68df2851bce7b4dc09a626bceffaa6/">cache</a>)</cite></p>
</blockquote>
<p>J’aime beaucoup ce que partage Sean Boots sur son blog. Je suis de plus en plus reconnaissant des personnes prenant ce temps. Et j’ai l’impression qu’elles sont <a href="https://mxb.dev/blog/the-return-of-the-90s-web/">de nouveau</a> (<a href="/david/cache/2020/2e490bfc24d27865bf42f49ea2c79c12/">cache</a>) de plus en plus nombreuses.</p>
<p><em>Dans ma bulle en tout cas.</em></p>
<h2 id="confiance">Confiance <a href="#confiance" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote>
<p>It’s just unfortunate that a company can so easily set itself apart simply by being honest and fair.</p>
<p><cite><em><a href="https://garrettdimon.com/2020/thoughts-on-trust-in-business/">Thoughts on Trust in Business</a></em> (<a href="/david/cache/2020/70e5fefd4e7ab3f2bc03e917c4add8b0/">cache</a>)</cite></p>
</blockquote>
<p>J’aime beaucoup ce que <a href="https://stimulusjs.org/">produit</a> et <a href="https://m.signalvnoise.com/">partage</a> Basecamp mais ironiquement je n’ai jamais utilisé l’un de leurs produits sérieusement. Et il semblerait que <a href="https://hey.com/">Hey!</a> ne déroge pas à la règle tant que je ne peux pas contrôler le domaine.</p>
<p>Je suis très intéressé par <a href="https://hey.com/how-it-works/">leur façon d’aborder le problème</a> cela dit et je n’exclus pas de mettre en place mes propres règles dans Mail.app afin d’arriver à un résultat approchant.</p>
<p><em>Faire confiance est différent d’acheter ses propres menottes.</em></p>
<h2 id="targets">Targets <a href="#targets" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote lang="en">
<p>In other words, if you upload a list of a few thousand people who are open to your message, whether it is interest in a harmless hobby or incendiary claims against a political opponent, Facebook’s vast surveillance machinery, giant databases, and top-of-the line artificial-intelligence tools can <mark>help you find many, many more similar targets</mark>—which you can reach as long as you’re willing to pay Facebook.</p>
<p><cite><em><a href="https://www.theatlantic.com/technology/archive/2020/05/trumps-executive-order-isnt-about-twitter/612349/">Trump’s Executive Order Isn’t About Twitter</a></em> (<a href="/david/cache/2020/395e363cffff4e9c6b33633bc726f1e2/">cache</a>)</cite></p>
</blockquote>
<p>Face<em>book</em> est un livre ouvert… pour celles et ceux qui ont les poches suffisamment profondes.</p>
<h2 id="lissage">Lissage <a href="#lissage" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote lang="en">
<p>First, turn OFF “Font smoothing” in System Preferences → General</p>
<p>That preference name is misleading. It used to be called “LCD font smoothing”, which suggested subpixel antialiasing. But Apple removed subpixel antialiasing from macOS in 2018, the same month it retired its last non-retina notebook.</p>
<p>The other thing the name suggests is that your fonts might not be smoothed at all. This is not the case either.</p>
<p>What it actually does is <mark>it makes font slightly bolder</mark></p>
<p><cite><em><a href="https://tonsky.me/blog/monitors/">Time to upgrade your monitor</a></em> (<a href="/david/cache/2020/4f1f531d8e88bfb6908b00fbf60d16e6/">cache</a>)</cite></p>
</blockquote>
<p>Suite à cet article, j’ai désactivé le lissage des polices et ma vie a changé à tout jamais. Ou du moins est-elle plus <em>light</em>. J’ai enfin vu la lumière sur ces histoires de pixels et de densité… J’ai un peu l’impression d’avoir <a href="/david/2020/06/18/#obsolescence">changé une seconde fois de machine</a> dans le même mois.</p>
<p>Ne pas oublier de le retirer des préférences de <a href="https://www.sublimetext.com/">SublimeText</a> si <code>font_options</code> contient la valeur <code>subpixel_antialias</code>, je ne sais plus si je l’avais ajouté ou si c’était la valeur par défaut à un moment. Je dois utiliser cet outil depuis bientôt 10 ans…</p>
<h2 id="algocratie">Algocratie <a href="#algocratie" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote>
<p>Là où les technocrates remettaient volontiers le pouvoir aux ingénieurs, donc à des personnes considérées comme détenant un savoir supérieur aux citoyens, politiciens y compris, les algocrates semblent considérer que le pouvoir peut être délégué aux objets techniques eux-mêmes, les algorithmes prenant les décisions à la place des citoyens et des élus. Ces algorithmes, bien qu’<mark>échappant au contrôle des individus</mark>, auraient néanmoins, dit-on, la faculté de créer de nouvelles solidarités sociales, comme si les citoyens n’avaient pas la capacité d’agir pour générer eux-mêmes des liens sociaux.</p>
<p><cite><em><a href="https://www.ledevoir.com/societe/le-devoir-de-philo-histoire/580735/des-technocrates-aux-algocrates">Des technocrates aux algocrates</a></em> (<a href="/david/cache/2020/f8ef3c28cb75d299fc723d88fb8d0744/">cache</a>)</cite></p>
</blockquote>
<p>Et pourtant, un <a href="https://beta.gouv.fr/">petit village</a> résiste encore et toujours à l’envahisseur et tente de faire des choses via <a href="https://publi.codes/">publi.codes</a> et <a href="https://github.com/StartupsPoleEmploi/trefle">d’autres</a> <a href="https://github.com/Delegation-numerique-en-sante/covid19-algorithme-orientation">initiatives</a> au sein de l’État existent pour tenter de rendre les <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/tree/master/contenus#algorithme">algorithmes</a> intelligibles.</p>
<p><em>Comment les rendre plus lisibles et visibles ?</em></p>

<blockquote lang="en">
<p>But in this moment, the conversation we should be having—how can we fix the algorithms?—is instead being co-opted and twisted by politicians and pundits howling about censorship and miscasting content moderation as the demise of free speech online. It would be good to remind them that free <em>speech</em> does not mean free <em>reach</em>. <mark>There is no right to algorithmic amplification.</mark> In fact, that’s the very problem that needs fixing.</p>
<p><cite><em><a href="https://www.wired.com/story/free-speech-is-not-the-same-as-free-reach/">Free Speech Is Not the Same As Free Reach</a></em> (<a href="/david/cache/2020/7c3883b39ab29809ccb63ad2a268d08d/">cache</a>)</cite></p>
</blockquote>
<p>Une pensée pour les personnes développant des produits <em>open-source</em> et devant <a href="https://github.com/omarroth/invidious/issues/569">faire ces choix</a>.</p>
<h2 id="maintenance">Maintenance <a href="#maintenance" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote lang="en">
<p>Willison maintains 73 open source projects, and he says the only way you can maintain 73 projects is if you treat every single one of them as if you’re not a core maintainer. Each must have a ReadMe and tests and detailed issue threads discussing what he was working on. “Because then you can drop back into them after a six-month gap and be productive with them,” he says.</p>
<p>“<mark>I’m an open source maintenance group with a population of one</mark>,” Willison says. “I’m taking the lessons I learned [at Eventbrite], a 600-engineer organization, and applying them to a one-engineer organization.”</p>
<p><cite><em><a href="https://thenewstack.io/datasette-a-developer-a-shower-and-a-data-inspired-moment/">Datasette: A Developer, a Shower and a Data-Inspired Moment</a></em> (<a href="/david/cache/2020/032142ee0df638618a8b145cb7ea9ebc/">cache</a>)</cite></p>
</blockquote>
<p>Quand la rigueur est libératrice. Je suis vraiment admiratif de réussir à maintenir autant de bouts de codes. Mes centres d’intérêts semblent être bien… étriqués (?) en comparaison, au bout d’une poignée de produits je me lasse et j’ai besoin d’élaguer pour libérer la charge mentale associée.</p>
<h2 id="paillasse">Paillasse <a href="#paillasse" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote lang="en">
<p>My blog is my laboratory workbench where I go through the ideas and paragraphs I’ve picked up along my way, and I twist them and turn them and I see if they fit together. I do that by narrating my way between them. And if they do fit, I try to add another piece, and then another. <mark>Writing a post is a process of experimental construction.</mark></p>
<p><cite><em><a href="http://interconnected.org/home/2020/06/16/quotebacks">Quotebacks and hypertexts</a></em> (<a href="/david/cache/2020/2a35ead18f2e4d22a091367acbab1e85/">cache</a>)</cite></p>
</blockquote>
<p>En parlant de paillasse, j’ai enfin terminé de décliner un thème sombre/foncé pour cet espace grâce à l’aide d’<a href="https://ricaud.me/">Anthony</a> et j’ai appris plein de trucs (et on a <a href="https://bugs.webkit.org/show_bug.cgi?id=213394">trouvé un bug</a>). J’aime prendre le temps d’expérimenter en un lieu qui n’est critique que pour moi. L’idée initiale était de faire un sélecteur de thème (le truc que vous voyez en pied de page) <a href="https://mastodon.social/@dav/104093540923157521">suffisamment générique pour qu’il soit applicable facilement</a> par n’importe qui proposant un thème sombre <em>via</em> sa CSS mais ça s’est révélé être plus difficile que prévu. Je ne sais pas encore si ça sera le cas et au pire vous pouvez aller faire un tour dans le code source de ces pages. Note, on peut aller <a href="https://mxb.dev/blog/color-theme-switcher/">beaucoup plus loin</a> (<a href="/david/cache/2020/7a485d9382d6b3138c70cb2b9518fcb1/">cache</a>) dans le domaine.</p>
<p>Au passage, cela m’a fait passer en mode adaptatif en fonction de l’heure du jour sous macOS et je suis super content d’avoir testé ça <em>notamment</em> car cela délimite plus clairement ma journée et mes activités. Et puis, maintenant je peux chialer sur des services qui n’ont pas de thème sombre (coucou Microsoft Github) ou passer des heures à faire en sorte que mes applications suivent les préférences du système d’exploitation (cette traduction est toujours aussi fabuleuse).</p>
<p>J’ai un autre truc sur la paillasse en ce moment c’est d’utiliser l’option <code>data-instant-intensity=&quot;viewport-all&quot;</code> de <a href="https://instant.page/">instant.page</a> que j’utilise depuis de nombreuses années (c’est l’ancien <a href="http://instantclick.io/">instantclick</a>, merci <a href="https://dieulot.fr/">Alexandre Dieulot</a> !). C’est limite car ça veut dire que ça précharge tous les liens locaux et donc tous les articles en cache lorsqu’ils entrent dans la fenêtre visible. Mais je me dis que pour un usage nomade c’est pas plus mal et ça respecte le <em>header</em> <code>Save-Data</code> pour les personnes qui ont cette option. Normalement, tout devrait sembler encore plus instantané, en espérant ne pas être allé <a href="/david/stream/2015/12/30/">trop loin…</a></p>
<h2 id="the-last-dance">The Last Dance <a href="#the-last-dance" title="Ancre vers cette partie" aria-hidden="true">#</a></h2><p>J’ai finalement vu <a href="https://en.wikipedia.org/wiki/The_Last_Dance_(TV_series)">ce documentaire</a> où des millionnaires parlent d’autres millionnaires. J’ai joué au basketball pendant ces années là, beaucoup, <em>vraiment</em> beaucoup. J’avais le maillot de Jordan et ses chaussures. Aussi, difficile de ne pas s’y retrouver et tout est fait pour ça. Une chose qui m’a marqué dans je ne sais plus quel épisode, c’est de montrer que Nike est devenu la marque actuelle en grande partie grâce au concours de Mickael Jordan à cette époque.</p>
<p>Au vu de la popularité sur Netflix, ça me donne une bonne idée du pourcentage de la <a href="https://www.numerama.com/business/599695-un-francais-sur-dix-paie-un-abonnement-a-netflix.html">population des abonné·e·s</a> (<a href="/david/cache/2020/f7f37a2f04e53d5fef5189fbd172f5b7/">cache</a>) qui a mon âge… <em>good shot!</em></p>
<h2 id="manque-a-gagner">Manque à gagner <a href="#manque-a-gagner" title="Ancre vers cette partie" aria-hidden="true">#</a></h2>
<blockquote>
<p>En ville, le libéral, le gauchiste, le révolutionnaire et le grand bourgeois payent leur pain, leur essence et leurs taxes. L’ermite, lui, ne demande ni ne donne rien à l’État. Il s’enfouit dans les bois, en tire subsistance. Son retrait constitue un <em>manque à gagner</em> pour le gouvernement. <mark>Devenir un manque à gagner devrait constituer l’objectif des révolutionnaires.</mark> Un repas de poisson grillé et de myrtilles cueillies dans la forêt est plus anti-étatique qu’une manifestation hérissée de drapeaux noirs. Les dynamiteurs de la citadelle ont besoin de la citadelle. Ils sont contre l’État au sens où ils s’y appuient dessus. Walt Whitman : « Je n’ai rien à voir avec ce système, pas même assez pour m’y opposer. »</p>
<p><cite><em><a href="/david/2020/12/21/#dans-les-forets-de-siberie">Dans les forêts de Sibérie</a></em>, Sylvain Tesson</cite></p>
</blockquote>
<p>La saison de la mouche noire tire à sa fin, il est temps de repartir en forêt. De se rêver ermite tout en continuant à contribuer au système de manière plus ou moins volontaire. Le plus contradictoire étant de consommer tant de matériel et (donc) d’énergie carbonée pour pouvoir accéder à cette position.</p>
<p><em>Un ermite a-t-il des privilèges ?</em></p>

<nav>
  <p class="center">
    <a rel="prev" href="/david/2020/06/18/" title="Publication précédente : Mouvements">←</a> •
    <a href="/david/2020/" title="Liste des publications récentes">↑</a>
    
  </p>
</nav>
</article>


<hr>

<footer>
  <p>
    <a href="/david/" title="Aller à l’accueil">🏠</a> •
    <a href="/david/log/" title="Accès au flux RSS">🤖</a> •
    <a href="http://larlet.com" title="Go to my English profile" data-instant>🇨🇦</a> •
    <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">📮</a> •
    <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">🧚</abbr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend>Thème</legend>
              <label>
                  <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
              </label>
              <label>
                  <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
              </label>
              <label>
                  <input type="radio" value="light" name="chosen-color-scheme"> Clair
              </label>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module" defer></script>
<script type="text/javascript">
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(form)

        form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
        })

        const selectedTheme = localStorage.getItem('theme')
        if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
        }
    }

    const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
    window.addEventListener('load', () => {
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.cssRules) {
                if (cssRule.type !== CSSRule.MEDIA_RULE) {
                    continue
                }
                // WARNING: Safari does not have/supports `conditionText`.
                if (cssRule.conditionText) {
                    if (cssRule.conditionText !== prefersColorSchemeDark) {
                        continue
                    }
                } else {
                    if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                        continue
                    }
                }
                mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }

            // WARNING: do not try to insert a Rule to a styleSheet you are
            // currently iterating on, otherwise the browser will be stuck
            // in a infinite loop…
            for (const mediaRule of mediaRules) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>
</body>
</html>