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>The next decade of the web (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://jamesg.blog/2024/05/19/next-web-decade/">

<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 next decade of the web</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://jamesg.blog/2024/05/19/next-web-decade/" title="Lien vers le contenu original">Source originale</a>
      <br>
      Mis en cache le 2024-05-21
    </p>
  </nav>
  <hr>
  <p>My experience on the web has been one of dualities. </p>
<p>I grew up with the web being around: as a child, I played PBS and BBC games on our family computer. The web provided comfort when I was bored, and a place to open my eyes to the space around me. I fondly remember looking at photos from NASA on our home computer and being in awe. I saw stars from galaxies away, all from my computer screen, as a kid.</p>
<p>Through the web, I have found delight in mathematics, blog posts that encouraged me to seek help for my mental health, and people who opened my world view. I have an encyclopedia at my fingertips -- Wikipedia -- that is curated by people around the world.</p>
<p>I also use the web to work: through the internet, I found a job and connect with colleagues. I am a technical writer, tasked with documenting machine learning systems that are used across the world to solve problems. I publish my work on the web.</p>
<p>At the same time, the web has sometimes made me sad, stressed, or anxious. At the beginning of the pandemic, my use of social media made me cry. I was unable to take in all of the information. I already felt powerless over almost everything that was happening in the world (aside from my being able to stay at home to mitigate the spread of illness), and social media amplified that feeling. I started to take a break from social media: there was too much going on, and I needed quiet.</p>
<p>My web experience was thus enlightenment and disempowerment. Opportunity and anxiety. Tears and joy.</p>
<p>I started to wonder if things could be different. I wondered if rather than being <em>subjected to</em> social media where there were endless discussions going on every day and where I felt in limited control to curate my experience, there could be another way. That's when I found a community of people who wrote on their blogs: the IndieWeb. The IndieWeb, started before I had began high school, was founded on the proposition that the web could be different. That people could be first. That we could build our own experience.</p>
<p>The core value of the IndieWeb, individual empowerment, helped me realise a fundamental change in perspective: that the web was beautiful and at times difficult, but that we, the people, were in control. That as powerless as I may feel over change -- that I <em>have</em> to keep using social media to stay connected, watching ads and all -- things could be different.</p>
<p>I have been thinking about the future of the web, and technology more broadly. I noted recently that perhaps we will reach a time when we get bored of smartphones. When sharing this idea with friends, I added the caveat that I am potentially wearing rose-tinted glasses, trying to wish something into being. Yet, I do not think this is the case</p>
<p>There is already malaise about the state of the web. There are myriad problems: how social media contributes to loneliness, the contribution of such ready access to information to anxiety, the increased likelihood of encountering misinformation, the compulsions we build to check notifications on platforms that we use, the existence of so many platforms that we feel we have to be on not to miss out.</p>
<p>My vision for the web over the next ten years is that we can turn that feeling of malaise, which I think is rooted in disempowerment, into a feeling that things can be different.</p>
<p>No one person set off a light bulb in my mind that made me think I could have a personal website where I blog about all the things I find fun and interesting. Rather, it was seeing role models from all different backgrounds that made me think I could take more control of the web, and use the web as a platform not for consumption or creation for capital, but as a place of expression.</p>
<p>After the last decade, where <em>platforms</em> have emerged as a core constituent of the web on which many rely, it may feel like things cannot change. That the giants are so big that there is no other way. Yet, to give into this feeling -- that things can't change -- is not necessary. <em>It is the way it is</em> is not true on the web. We can make change. It's your web.</p>
<p>My knowing that the web is for the people opened me up to new community, opportunity, and helped me with my mental health. I found people who appreciated me for my writing. I found an audience who liked my work. I started to think that I could be myself without having to worry about engagement. Indeed, I eschew analytics. If one person reads what I write and likes it, I consider a piece of writing a great success. On social media, however, I didn't think that way.</p>
<p>Things can be different.</p>
<p>There are many beacons of hope across the web that suggest things can be different. People who write on their blogs. Photographers who share and sell art on their websites. Mastodon, a public commons where people can chat and where you can move your identity between different site owners if a site owner does something with which you disagree. <em>The Verge</em>, a news publication, has showed that whatever happens with the ecosystem -- search engines changing, for example -- journalists can build <em>destinations</em> where people go; that a home page can be where someone goes to news, rather than exclusively a social media timeline.</p>
<p>We are already making change, but to make more we need to reaffirm the foundations of the web: that the web is for people. We need to go out and shout from the rooftops that the web can be different. To do so effectively, we all need to be the change we want to see in the web. I do this by being myself on my personal website, and by sharing my writing on my site actively.</p>
<p>What changes you want to see will likely be different from mine. That's good. The web should support a plurality of visions. My vision for the web is for us to look to smaller communities. To say that perhaps we don't need scale. Indeed, the scale of social media was not a boon to me. It felt great to be connected to so many people, but I am not built for that. I want a small space where I can see everything my friends post online.  I am curious: what is your vision for the web?</p>
<p>Change will necessitate tools for change, too.</p>
<p>Mastodon is one example of a tool that can cause tidal shifts in our outlook and use of the web. Mastodon's existence says, every day, that we can have a web where the user is in control, where ads are not present among content we read, where we can post links to our own channels of distribution -- personal websites, portfolios, stores, etc. -- without worrying about demotion in ranking algorithms.</p>
<p>We will need more people to build more web tools that empower people. We need tools for people that are as easy to use as possible. We need tools that require no technological experience to use well. We need tools where conditions of usage are intuitive to understand. Tools where personal ownership is first.</p>
<p>I have a few asks of you, the reader.</p>
<p>If you do not have a personal website, take a look at my Wander page. There, you will find many web pages linked. See if anything excites you. Wander the web. Explore. as you explore, keep the idea in your mind that you, too, can have a personal website.</p>
<p>You can write about whatever you want on the web: works of fiction, stories from your life, reviews of movies -- whatever you want. You can share art -- photography, paintings, drawings, videos -- on your own platform. If something inspires you, take a note. Look into starting a website. You can start a website in an afternoon with a tool like WordPress. If you need help, you're welcome to email me at readers [at] jamesg [dot] blog.</p>
<p>If you do have a personal website, I encourage you to do what you can to reaffirm the idea that the web is for the people. You are already leading by example, and some writings on what you do and why you do it on the web would go a long way to contributing to the body of information we have on different ways the web can work. Indeed, the web is for people: documenting stories of how we all use the web creates more chances to reach people and evoke the idea that the web can be different.</p>
<p>In ten years, I hope I look back and feel that I have helped more people feel ownership over the time and places they spend on the web. I hope that more people join me in this, too. I may not have been writing this today if a few people ten years ago hadn't decided to start a small community dedicated to individual empowerment on the web. That shows the power of the web: a few people can create ideas that change the web, ideas that ripple through a decade. Your being the change you want to see in the web may have a multiplicative effect: someone sees how you do things, then they are inspired to take ownership over their web experience.</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>