davidbgk
/
larlet-fr-david-cache


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
							<!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` element
  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>The ‘Pyramid of Hate’ that Brought Down Basecamp (archive) — David Larlet</title>
<meta name="description" content="Publication mise en cache pour en conserver une trace.">
<!-- 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="#f7f7f7">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.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>
    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>

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://marker.medium.com/the-pyramid-of-hate-that-brought-down-basecamp-838b63ca27e">

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


<article>
  <header>
    <h1>The ‘Pyramid of Hate’ that Brought Down Basecamp</h1>
  </header>
  <nav>
    <p class="center">
      <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
      </svg> Accueil</a> •
      <a href="https://marker.medium.com/the-pyramid-of-hate-that-brought-down-basecamp-838b63ca27e" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <h2 id="1c95" class="ho gp gq bf b hp hq hr hs ht hu hv hw hx hy hz ia ib ic id ie dx"><em class="if">Basecamp bosses banned politics at work over a social justice diagram</em></h2>

<figure class="jk jl fw fx paragraph-image"><figcaption class="kb kc fy fw fx kd ke bf b bg bh dx">The ADL’s “Pyramid of Hate.” Image via adl.org.</figcaption></figure>

<p id="b09b" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Earlier this week, I wrote a <a class="el lb" rel="noopener" href="/basecamp-is-failing-its-own-future-d487bed43155">response</a> to tech company Basecamp’s decision to ban political speech in the workplace. That same evening, Casey Newton published an article for <a href="https://www.theverge.com/2021/4/27/22406673/basecamp-political-speech-policy-controversy" class="el lb" rel="noopener nofollow"><em class="lc">The Verge</em></a><em class="lc"> </em>that shed some light on the events that apparently prompted this announcement. As Newton’s article explains, the political discussions taking place at Basecamp largely focused on the internal culture of the company itself — not conversations about the outside world brought into work, as many were led to believe by the company’s original statement. Newton writes,</p>

<blockquote class="ld le lf"><p id="c1f3" class="kf kg lc kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Interviews with a half-dozen Basecamp employees over the past day paint a portrait of a company where workers sought to advance Basecamp’s commitment to diversity, equity, and inclusion by having sensitive discussions about the company’s own failures. After months of fraught conversations, Fried and his co-founder, David Heinemeier Hansson moved to shut those conversations down.</p></blockquote>

<p id="a324" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Among the sens<span id="rmm">i</span>tive topics of discussion was a list called “Best Names Ever” that had been compiled and maintained by Basecamp workers over the past decade. This was a list of customer names that various workers had found funny for some reason or another. According to Newton, many of these names were American or European in origin, however others were obviously Asian or African. Eventually, employees began to express their discomfort with the list, and the company began holding discussions about how to hold those who had allowed it to circulate for so long accountable.</p>

<p id="4231" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">On April 13, two employees who had contributed to the list in the past issued an apology using Basecamp’s internal employee chat, hosted on the remote workplace collaboration software that Basecamp itself builds and distributes. This apology, Newton explains, included a link to the so-called “<a href="https://www.adl.org/sites/default/files/documents/pyramid-of-hate.pdf" class="el lb" rel="noopener nofollow">Pyramid of Hate</a>”—an illustration produced by the Anti-Defamation League that shows “how the most extreme acts of extremist violence are enabled by a foundation of biased attitudes and acts of bias.”</p>

<p id="80fd" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">On the lowest level of the Pyramid of Hate are “acts of bias,” defined as jokes, stereotypes, non-inclusive language, and other comparatively minor insensitivities (often dubbed “microaggressions”). Higher up on the pyramid are structural and legal forms of discrimination, bias-motivated acts of violence, and finally, at the most extreme level, genocide.</p>

<p id="0e21" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Apparently, the founders of Basecamp took great offense to this graphic being brought into the discussion. Newton writes,</p>

<blockquote class="ld le lf"><p id="6bb7" class="kf kg lc kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">[Hansson] told me today that attempting to link the list of customer names to potential genocide represented a case of “catastrophizing” — one that made it impossible for any good-faith discussions to follow. Presumably, any employees who are found contributing to genocidal attitudes should be fired on the spot — and yet nobody involved seemed to think that contributing to or viewing the list was a fireable offense. If that’s the case, Hansson said, then the pyramid of hate had no place in the discussion. To him, it escalated employees’ emotions past the point of being productive.</p></blockquote>

<p id="2c0b" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">In response to Newton’s article, Hansson issued a lengthy <a href="https://world.hey.com/dhh/let-it-all-out-78485e8e" class="el lb" rel="noopener nofollow">blog post</a> in which he recounted the back-and-forth that took place over the company chat, spurring multiple reports to HR. “I was dismayed to see the argument advanced in text and graphics on [Employee 1’s] post that this list should be considered part of a regime that eventually could lead to genocide,” Hansson wrote to his employees. “That’s just not an appropriate or proportionate comparison to draw.”</p>

<p id="4ef7" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">When several of Hansson’s employees attempted to explain the diagram again, he responded:</p>

<blockquote class="ld le lf"><p id="ff25" class="kf kg lc kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">…I don’t think we serve the cause of opposing colonial regimes or racist ideology by connecting their abusive acts around names to this incident. And I don’t think we serve an evaluation of you and others making fun of names in a Campfire session by drawing that connection either.</p><p id="66cb" class="kf kg lc kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">We can recognize that forceful renaming by a colonial regime is racist and wrong while also recognizing that having a laugh at customer names behind their back is inappropriate and wrong without equating or linking the two.</p></blockquote>

<p id="c47d" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Hansson’s comments are revealing. Most notably, they reveal that he doesn’t seem to actually understand the purpose or the content of the diagram in question. The purpose of the “Pyramid of Hate” is not to suggest that racist jokes and callous insensitivities are “part of a regime that eventually could lead to genocide,” nor does it “equate” making fun of names with genocide. The purpose of the graphic is to demonstrate that hate crimes and structural racism don’t happen in a vacuum. They happen within a society in which a foundation has been laid that makes them possible. It’s not a slippery slope; it’s an architectural metaphor in which the higher levels depend upon the support they receive from the lower levels. Like all metaphors, the “Pyramid of Hate” is not perfect. But it does a reasonably good job of illustrating how seemingly isolated attitudes and behaviors can serve as part of a foundation that makes more overt forms of violence possible.</p>

<p id="3443" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Hansson’s second error is the projection of “catastrophizing” onto his employees when it is he himself who is catastrophizing. Instead of seeing a diagram in which the higher levels are dependent upon lower, obviously less extreme levels, Hansson chose to see a graphic in which the behaviors that had become normalized at Basecamp were being equated with genocide. It is this defensive misconstrual of the actual meaning of the diagram which is tantamount to an “escalation” of emotion and hurt feelings—not the use of the diagram in the first place.</p>

<p id="9de5" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">For all the <a href="https://www.theatlantic.com/ideas/archive/2020/07/dehumanizing-condescension-white-fragility/614146/" class="el lb" rel="noopener nofollow">valid criticism</a> that has been lobbed at Robin DiAngelo’s work around white fragility, some of her concepts are of use here, especially the “good/bad binary.” The “good/bad binary” is the internal script that makes us say, “Racism is bad, I’m not bad, therefore I’m not a racist!” The problem with this all-or-nothing thinking is that it undermines our ability to process nuance. The emotional attachment we feel to perceiving ourselves (or being perceived by others) as “good” makes it more difficult to accept information that complicates that “good” image.</p>

<p id="0b1b" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">In reality, people are complicated. Sometimes “good” people hold biases or attitudes that help reinforce negative, even violent systems. When that happens, it’s up to us to make good on our “good” self-image by holding ourselves accountable to those around us.</p>

<p id="59c6" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">In the conclusion of his blog post, Hansson writes,</p>

<blockquote class="ld le lf"><p id="0b7c" class="kf kg lc kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">If you do indeed strive to have a diverse workforce both ideologically and identity wise, you’re not going to find unison on all these difficult, contentious issues. If you did, you’d both be revealing an intellectual monoculture and we wouldn’t be having these acrimonious debates.</p></blockquote>

<p id="1c66" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">Indeed, judging from the accounts of the many employees who have now gone on record about this issue, the “debates” that have been happening at Basecamp are precisely the kinds of conversations that happen when you have a diverse workforce. Different issues affect different people differently, and being able to speak freely about those differences is the hallmark of a healthy culture. But by framing these discussions as “acrimonious debates” rather than “challenging conversations,” Hansson has positioned himself not as a peacemaker, but as a tyrant hell-bent on taking his toys and going home; shutting down discussions rather than holding space for growth and discovery.</p>

<p id="8e04" class="kf kg gq kh b hp ki kj kk hs kl km kn ko kp kq kr ks kt ku kv kw kx ky kz la gj hn">If Hansson and Fried had been able to tolerate the dissenting opinions of their own employees, they might have been in for a difficult few weeks or months, but the long-term benefit of cultivating an atmosphere of trust would have been invaluable. Instead, they decided to make their tantrum international news. In doing so, they have all but dismantled the positive reputation they spent more than a decade carefully crafting.</p>
</article>


<hr>

<footer>
  <p>
    <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
      </svg> Accueil</a> •
    <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
      </svg> Suivre</a> •
    <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
      </svg> Pro</a> •
    <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
      </svg> Email</a> •
    <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
        <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
      </svg> Légal</abbr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
              </svg> 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"></script>
<script>
    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>