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` 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>How Websites Die (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://notebook.wesleyac.com/how-websites-die/">

<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>How Websites Die</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-2021-12.svg#icon-home"></use>
      </svg> Accueil</a> •
      <a href="https://notebook.wesleyac.com/how-websites-die/" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <p class="subtitle" id="dateline">Monday February 21, 2022 — Taipei, Taiwan</p>
<p>I recently started compiling a <a href="https://www.are.na/wesleyac/defunct-blogging-platforms">list of defunct blogging platforms</a>. It’s been interesting to see how websites die — from domain parking pages to timeouts to blank pages to outdated TLS cipher errors, there are a multitude of different ways.</p>
<p>Tied for the most common are two very different modalities: the opportunistic vultures of domain parking pages, and the natural cycle of life and death: a new website, unconnected from what was once there by everything except name. For instance, Vox.com, now a popular news website, was once a blogging platform. Pitas.com, among the oldest blogging platforms, is now a french magazine. Calepin.co, which offered a way to convert a dropbox folder of markdown files into a website, is now a agency for writers. None of these sites offer any evidence of what was there before them. When buildings are torn down and rebuilt, the ghost of the old building is often visible in the new one — strangely angled walls and rooms, which make sense only in the context of the space as a living organism. On the web, there are no such restrictions: when a website dies, it leaves no sign of its past self behind. The closest you might come to seeing signs of this cycle is witnessing the birth of a new website. Updog.co was once a Dropbox-based hosting platform, but is now a landing page for startup that will “Upgrade Your Dog’s Lifestyle”, which promises to be “unleashed soon”.</p>
<p>Various technical errors add up to significant percentage as well: Failed DNS resolution is the most common — Firefox reports “Hmm. We’re having trouble finding that site”, followed by server timeouts. One site offered a SSL version that had long since been deprecated, while another served up a error page from Cloudflare. Yet another redirected infinitely, with firefox finally giving up and throwing an error.</p>
<p>Spam website were also common, most disguised as “news” websites, although some pretended to be products, hoping that visitors wouldn’t notice that there was no way to actually buy any of the services advertised. A enterprising online casino bought one of the domains to serve as a redirect, presumably as some sort of SEO strategy.</p>
<p>A depressingly small number seemed to have planned out their deaths, with landing pages announcing the shutdown. A few had lengthy blog posts explaining why their authors could no longer support them, but others offered no explanation — Posterous.com simply wrote “Posterous Spaces is no longer available”, with no further explanation. Advogato redirected to a copy of the website on the Internet Archive, with the last post announcing their shutdown.</p>
<p>A couple of the websites were simply frozen in time — no longer allowing signups, but with no obvious indication that they’d closed down other than a copyright date a few years old.</p>
<p>And finally, there were a small smattering of sites that were entirely or almost entirely blank: just a white page, maybe with a cryptic bit of text or two. I wonder who’s still running those servers. Do they even know that they’re still online, or have they been long forgotten, doomed to make their final disappearance when someone mistakenly realizes that they don’t need to keep paying the bill for that server — it’s not doing anything, anyways.</p>
<p>I think a lot about the lifecycle of websites. I’m frustrated by so much of the short-term thinking I see in the world today, and the way we think about websites is a part of that: it’s “normal” for them to just go up in smoke as soon as their authors stop paying attention. People switch platforms and providers and break links without a second thought. It pains me to see people build websites with no feeling of obligation to them — when you put something out into the world, it is your responsibility to care for it.</p>
<p>At the same time, I wonder if this obsession with permanence is misplaced. I recently started building a website that lives at <a href="https://wesleyac.com">wesleyac.com</a>, and one of the things that made me procrastinate for years on putting it up was not being sure if I was ready to commit to it. I solved that conundrum with a <a href="https://wesleyac.com/stability.html">page outlining my thoughts on its stability and permanence</a>:</p>
<blockquote><p>this website (everything residing on the domain “wesleyac.com”, excluding subdomains) should be thought of as a jungle — attempts to link to it are at your own risk.</p><p>you may attempt to archive it, but should you wish to avoid sadness down the line, you should accept now in your heart that all archives will eventually succumb to the sands of time.</p></blockquote>
<p>And I also included this lovely quote from <em>A Psalm for the Wild-Built</em> by Becky Chambers:</p>
<blockquote><p>It is difficult for anyone born and raised in human infrastructure to truly internalize the fact that your view of the world is backward. Even if you fully know that you live in a natural world that existed before you and will continue long after, even if you know that the wilderness is the default state of things, and that nature is not something that only happens in carefully curated enclaves between towns, something that pops up in empty spaces if you ignore them for a while, even if you spend your whole life believing yourself to be deeply in touch with the ebb and flow, the cycle, the ecosystem as it actually is, you will still have trouble picturing an untouched world. You will still struggle to understand that human constructs are carved out and overlaid, that these are the places that are the in-between, not the other way around.</p></blockquote>
<p>Writing that warning was enough to satisfy my feeling of obligation, but I don’t think it’s right for everything. One of the reasons I was interested in blogging platforms is because I run a small <a href="https://thoughts.page/">microblogging site</a>, and I feel a obligation to the people who use it to keep it running. As I picked through the graveyard of defunct blogging sites, there were countless stories of people who’d lost years of their personal history, whether due to database crashes or simply the website operators getting tired. The creator of Scribble.nu, one of the earliest blogging platforms, <a href="https://web.archive.org/web/20131120035936/https://dustin.io/things-i-did/">wrote</a> that it:</p>
<blockquote><p>Became insanely popular at the time, serving almost 100,000 users before it imploded from its success. I spent literally hundreds of hours tweaking our strained servers (two of them: one web server, one database server) to support an ever increasing load. I still receive hate mail occasionally wondering why I had to take this service off line. When you have to decide between paying your server bills or your rent, something has to give.</p></blockquote>
<p>And I’m certainly sympathetic to that — the reality is that making things last on the web is hard because the web was not made to build things that last. Trying to keep websites around forever is struggling against the nature of the web. I think, though, that that struggle is often worthwhile.</p>
<p>For my part, I try to think as I’m launching things about what my commitment to them is, and to be explicit about that. I keep all my domain names paid up for a decade, the longest that ICANN allows. Still, though, if I died today, <a href="https://thoughts.page">thoughts.page</a> would probably only last until my credit card expires and DigitalOcean shuts down my servers.</p>
<p><a href="https://winnielim.org/journal/on-writing-to-exist-and-website-graveyards/">Winnie Lim</a> has similar concerns:</p>
<blockquote><p>One of the things I think about once in a while is the existence of this website once I am no longer around. I think it is a bit ironic for a person who is chronically suicidal to care about her website’s existence after she’s dead.</p><blockquote><p>we pay for a one-time fee to house our remains when we die (at least over here in sg), I wish there’s a similar service for our websites when we die.</p><p>— Winnie Lim (<span class="citation" data-cites="wynlim">@wynlim</span>) November 7, 2020</p></blockquote><p>Websites shouldn’t have to go offline once their creators are dead, yet they mostly will unless they are hosted on a free service that will likely sustain long-term into the future (i.e. wordpress.com or github). I believe websites will be future archaeological artefacts. I hope there’s a website graveyard where I can house this before I die.</p></blockquote>
<p>I’ve often thought about getting together with some friends to pay into a fund to house our websites after we die. I don’t think setting that up would be too hard — the math around insurance policies of this sort is quite simple<label class="margin-toggle sidenote-number" for="sn-1"></label><input class="margin-toggle" id="sn-1" type="checkbox"><span class="sidenote">For instance, a safe withdrawal rate of 3% and a cost of $12 for domain renewal would mean that a one-time payment of $400 should be enough to keep a website up ~forever.</span> — I mostly haven’t tried to set something like this up just since it’s a pretty morbid ask. But, if you’d be interested, maybe reach out to me?</p>
<p>Our ghosts could live forever, if we help each other.</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-2021-12.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-2021-12.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-2021-12.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-2021-12.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-2021-12.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-2021-12.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>