davidbgk
/
larlet-fr-david-cache


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
							<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang="en">
<!-- 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>Where have all the websites gone? (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)">
<!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
<meta name="robots" content="noai, noimageai">
<!-- 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://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/">

<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>Where have all the websites gone?</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://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/" title="Lien vers le contenu original">Source originale</a>
      <br>
      Mis en cache le 2024-01-09
    </p>
  </nav>
  <hr>
  <p>It’s Tuesday morning. The year is 2009. You’re just waking up after a long and boozy New Year’s Eve with friends. Your head rings, and your mouth is the type of dry that makes you question your adulthood. You feel something scratch against your arm. Did you take a lover last night? Sort of. It’s a pizza box. Meat lovers.</p>
<p>You reach for your phone. There’s no TikTok or Snapchat yet. Facebook and Instagram are a thing, but they exist as a type of social syndicator— a place to see what your friends were up to last night. You already know as much. The occasional whiff of rank vodka keeps your memory jogged. You tap the browser icon and start typing a webaddress, perhaps appending <code>www</code> as a precautionary relic. <em>Who got drunker than me</em>, you wonder. After a brief page load, you arrive at textsfromlastnight.com. “<em>I cant get the smell of ass out of my nose</em>,” reads the top post.</p>
<p>You scroll, pausing only for the occasional forward to your best friend, who undoubtedly hurts as much as you. You both laugh at the crass misfortunes of others and quietly hope you hadn’t somehow made it onto the front page yourself.</p>
<p>You copy the link to the best of the bunch, the story that made you laugh the hardest, and post it to your Facebook.</p>
<h2 id="for-you-but-not-by-us" tabindex="-1">For you, but not by us. </h2>
<p>For better or worse, the web doesn’t work like that anymore. No one clicks a webpage hoping to learn which cat <em>can haz cheeseburger</em>. Weirdos, maybe. <em>Sickos</em>.</p>
<p>No, we get our content from a For You Page now— algorithmically selected videos and images made by our favorite creators, produced explicitly for our preferred platform. Which platform doesn’t matter much. So long as it’s one of the big five. Creators churn out content for all of them.</p>
<p>It’s a technical marvel, that internet. Something so mindblowingly impressive that if you showed it to someone even thirty years ago, their face would melt the fuck off. So why does it feel like something’s missing? Why are we all so collectively unhappy with the state of the web?</p>
<h2 id="where-did-all-the-websites-go" tabindex="-1">Where <em>did</em> all the websites go? </h2>
<p>A tweet went viral this Thanksgiving when a Twitter user posed a question to their followers. A peek at the comments, and I could only assume the tweet struck a nerve. It certainly did with me. It's why I wrote this piece.</p>
<p><img src="https://fromjason.xyz/img/image-wheredidallthewebsitesgo.jpg" alt="tweet"></p>
<p>Everyone had their own answer. Some comments blamed the app-ification of the web. "<em>Everything is an app now!</em>," one user replied. Others point to the death of Adobe Flash and how so many sites and games died along with it. Everyone agrees that websites have indeed vanished, and we all miss the days we were free to visit them.</p>
<p>I have good news and bad news.</p>
<p>The good news is that websites didn’t go anywhere. There are currently one billion websites on the World Wide Web. Here’s a few from my bookmarks that are <em>amazing</em>.</p>

<p>Cool, right? So here’s the bad news— <em>we</em> are the ones who vanished, and I suspect what we really miss are the joys of discovery.</p>
<h2 id="we-miss-curation" tabindex="-1">We miss curation </h2>
<p>We used to know how to do this. Not long ago, we were good at separating the signal from noise. Granted, there’s a lot more noise these days, but most of it comes from and is encouraged by the silos we dwell in.</p>
<p>Somewhere between the late 2000’s aggregator sites and the contemporary For You Page, we lost our ability to <em>curate</em> the web. Worse still, we’ve outsourced our discovery to corporate algorithms. Most of us did it in exchange for an endless content feed. By most, I mean upwards of 90% who don’t make content on a platform as understood by the <a href="https://en.wikipedia.org/wiki/1%25_rule">90/9/1 rule</a>. And that’s okay! Or, at least, it makes total sense to me. Who wouldn’t want a steady stream of dopamine shots?</p>
<p>The rest of us, <a href="https://www.fromjason.xyz/p/notebook/how-do-we-stop-meta-in-2024-we-fix-the-information-loop/">posters, amplifiers, and aggregators</a>, traded our discovery autonomy for a chance at fame and fortune. Not all, but enough to change the social web landscape.</p>
<p>But that gold at the end of the rainbow isn’t for us. “Creator funds” pull from a fixed pot. It’s a line item in a budget that doesn’t change, whether one hundred or one million hands dip inside it. Executives in polished cement floor offices, who you’ll never meet, <em>choose</em> their winners and losers. And I’m guessing it’s not a meritocracy-based system. They pick their tokens, round up their shills, and stuff Apple Watch ads between them.</p>
<p>So when we wonder where all the websites have gone, know it’s the <em>curators</em> we’re nostalgic for because the curators showed us the best the web had to offer once upon a time. And the curators— the tenders, aggregators, collectors, and connectors— can bring us back to something better. Because it’s still out there, we just have to find it.</p>
<p>Here’s the best part. You can be that curator right now, at this very moment. You can start to rebuild the interconnectivity that made the web fun to explore. And you don’t need to be a computer scientist to do it.</p>
<p>Open a Linktree account or whatever. And instead of adding your other social media accounts, add three links to your favorite blog posts. Or, add links to a few artists with their own sites. Or your favorite aggregator sites. It doesn’t matter what you include, so long as we make portals to other digital green spaces that exist outside of Instagram.</p>
<p><strong>Then, throw that list into your link-in-bio</strong>. I just <a href="https://www.instagram.com/jasondotgov/">swapped my IG link</a> from my home page to a post listing my favorite blogging platforms. Most, if not all, are from “indie” developers. And who knows, maybe someone clicks on it and the web gains a new writer. How cool would that be?</p>
<p>So what do ya say? Let's make a bunch of open web <em>portals</em> for 2024! I guess I set this up for a two-parter, haven’t I? I’ll see you at the next post.</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>