davidbgk
/
larlet-fr-david-cache


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
							<!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>banlieue ou suburb (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://www.la-grange.net/2023/03/03/suburb">

<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>banlieue ou suburb</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.la-grange.net/2023/03/03/suburb" title="Lien vers le contenu original">Source originale</a>
    </p>
  </nav>
  <hr>
  <figure>
  <img src="https://www.la-grange.net/2023/03/03/8983-parking.jpg" alt="Parking the centre commercial.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<p>Banlieue ou Suburb. La banlieue est associée au mot français avec tout son bagage social, économique et urbain. La « suburb » américaine de la Californie déploie une grammaire totalement différente.</p>
<p>Hier, je mentionnais le temps pour aller en transport en commun ou en voiture. J'aurais probablement dû mentionner la distance à pied… 11h11 pour 51km.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/route-san-diego.jpg" alt="itinéraire sur une carte électronique avec plusieurs choix possibles entre San Diego et Rancho Bernado.">
  <figcaption>Itinéraire</figcaption>
</figure>
<p>Je n'ai pas le temps cette fois-ci et la fatigue des deux voyages accumulés mais je me dis qu'il me faudrait parcourir cette distance infernale à pied pour mieux comprendre l'idiotie de notre monde, pour mieux saisir les dégradés des tensions urbaines.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/route-bureau.jpg" alt="itinéraire sur une carte électronique avec plusieurs choix possibles entre l'hôtel et le bureau.">
  <figcaption>Itinéraire jusqu'au bureau</figcaption>
</figure>
<p>Quand j'ai mentionné que j'allais marcher de l'hôtel jusqu'au bureau, j'ai senti de l'incompréhension. Et pourtant il ne s'agit là que de 40 minutes… pour quelque chose qui est probablement à 15 minutes en ligne droite.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/8991-autoroute.jpg" alt="Passage sous la structure en béton de l'autoroute.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<p>J'ai tout de même décider de couper à travers les collines et les propriétés industrielles. J'ai gardé l'œil ouvert pour les serpents et les flics. Je me suis gavé du parfum des pins et des eucalyptus. J'ai observé les cactus dans la rocaille. En fait ma plus grande inquiétude dans ses parcours hors-circuits sont les autres humains, ceux qui ne comprendraient pas ma démarche.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/8994-collines.jpg" alt="végétation et longue clotûre en métal avec barbelés dans les collines.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<p>Autoroute et propriétés abandonnées de sites industriels rendent le parcours une longue absurdité. Et bien sûr pas de transports en commun.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/8998-bureau.jpg" alt="Vue sur des parkings vides.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<p>Finalement en suivant la clôture, j'ai trouvé un passage sur un parking abandonné que j'ai pu photographier depuis le bureau, une fois arrivé. Il a fallu avant cela traverser encore une grande route sans humanité.</p>
<p>Tout cela pose tellement de questions, incite à une mise en perspective sur notre rôle dans le monde.</p>
<p>Les écrivains-marcheurs-photographes devraient faire des résidences d'artiste sur les sites industriels de la Californie.</p>
<p>Je suis sûr qu'il y a plus que juste la surface de ces désolations culturelles. Et que l'on ne se méprenne, la marche dans cette trajectoire existensialiste est ce qui me donne l'énergie, le plaisir.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/9002-ombre.jpg" alt="Ombre de mon corps sur un parking vide, les montagnes sont au loin, quelques arbres éparpillés.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<p>Le soir, je suis rentré de nouveau à pied.</p>

<figure>
  <img src="https://www.la-grange.net/2023/03/03/9006-north.jpg" alt="Panneau de direction nord accroché à une rampe en béton pour l'autoroute 15.">
  <figcaption>Rancho Bernardo, Californie, 3 mars 2023</figcaption>
</figure>
<hr>
<blockquote>
<p><a href="https://mastodon.cloud/@karlcow/109957206842654554">Suburban America</a>. How depressing can you be?</p>
</blockquote>
<hr>
<p>Je ne suis pas sûr de savoir les choses que je veux d'un emploi. Peut-être, suis-je inquiet de restreindre trop la possibilité d'explorer de nouvelles trajectoires ?</p>
<p><a href="https://lynnandtonic.com/thoughts/entries/unordered-incomplete-list-of-things-i-want-from-a-job/">Unordered, incomplete list of things I want from a job</a></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>