Browse Source

More links

master
David Larlet 3 years ago
parent
commit
8196c3d359

+ 207
- 0
cache/2021/15d4f93dba253e3194c8dba52d0e8ee6/index.html View File

@@ -0,0 +1,207 @@
<!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>
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 principle of most availability (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="#f0f0ea">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- 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://adactio.com/journal/17987">

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

<article>
<header>
<h1>The principle of most availability</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://adactio.com/journal/17987" title="Lien vers le contenu original">Source originale</a>
</p>
</nav>
<hr>
<p>I’ve been thinking some more about <a href="https://adactio.com/journal/17943">the technical experience of booking a vaccination apointment and how much joy it brought me</a>.</p>

<p>I’ve written before about how <a href="https://adactio.com/journal/9016">I’ve got a blind spot for the web</a> so it’s no surprise that I was praising the use of a well marked-up form, styled clearly, and unencumbered by unnecessary JavaScript. But other technologies were in play too: Short Message Service (SMS) and email.</p>

<p>All of those technologies are platform-agnostic.</p>

<p>No matter what operating system I’m using, or what email software I’ve chosen, email works. It gets more complicated when you introduce HTML email. My response to that is the same as the old joke; you know the one: “Doctor, it hurts when I do this.” (“Well, don’t do that.”)</p>

<p>No matter what operating system my phone is using, SMS works. It gets more complicated when you introduce read receipts, memoji, or other additions. See my response to HTML email.</p>

<p>Then there’s the web. No matter what operating system I’m using on a device that could be a phone or a tablet or a laptop or desktop tower, and no matter what browser I’ve chosen to use, the World Wide Web works.</p>

<p><a href="https://adactio.com/journal/17943#principle">I originally said</a>:</p>

<blockquote>
<p>It feels like <a href="https://adactio.com/journal/14327">the principle of least power</a> in action.</p>
</blockquote>

<p>But another way of rephrasing “least power” is “most availability.” Technologies that are old, simple, and <a href="https://mcfunley.com/choose-boring-technology">boring</a> tend to be more widely available.</p>

<p>I remember when software used to come packaged in boxes and displayed on shelves. The packaging always had a list on the side. It looked like the nutritional information on a food product, but this was a list of “system requirements”: operating system, graphics card, sound card, CPU. I never liked the idea of system requirements. It felt so …exclusionary. And for me, the promise of technology was liberation and freedom to act on my own terms.</p>

<p>Hence my soft spot for the boring and basic technologies like email, SMS, and yes, web pages. The difference with web pages is that you can choose to layer added extras on top. As long as the fundamental functionality is using universally-supported technology, you’re free to enhance with all the latest CSS and JavaScript. If any of it fails, that’s okay: it falls back to a nice solid base.</p>

<p>Alas, many developers don’t build with this mindset. I mean, I understand why: it means thinking about users with the most boring, least powerful technology. It’s simpler and more exciting to assume that everyone’s got a shared baseline of newer technology. But by doing that, you’re missing out on one of the web’s superpowers: that something served up at the same URL with the same underlying code can simultaneously serve people with older technology <em>and</em> also provide a whizz-bang experience to people with the latest and greatest technology.</p>

<p>Anyway, I’ve been thinking about the kind of communication technologies that are as universal as email, SMS, and the web.</p>

<p>QR codes are kind of heading in that direction, although I still have qualms because of their proprietary history. But there’s something nice and lo-fi about them. They’re like print stylesheets in reverse (and I <em>love</em> print stylesheets). A funky little bridge between the physical and the digital. I just wish they weren’t so opaque: you never know if scanning that QR code will actually take you to the promised resource, or if you’re about to rickroll yourself.</p>

<p>Telephone numbers kind of fall into the same category as SMS, but with the added option of voice. I’ve always found the prospect of doing something with, say, <a href="https://www.twilio.com/">Twilio</a>’s API more interesting than building something inside a walled garden like Facebook Messenger or Alexa.</p>

<p>I know very little about chat apps or voice apps, but I don’t think there’s a cross-platform format that works with different products, right? I imagine it’s like the situation with native apps which require a different codebase for each app store and operating system. And so there’s a constant stream of technologies that try to fulfil the dream of writing once and running everywhere: <a href="https://reactnative.dev/">React Native</a>, <a href="https://flutter.dev/">Flutter</a>.</p>

<p>They’re trying to solve a very clear and obvious problem: writing the same app more than once is really wasteful. But that’s the nature of the game when it comes to runtime-specific apps. The only alternative is to either <a href="https://www.joinclubhouse.com/">deliberately limit your audience</a> …or apply the principle of least power/most availability.</p>

<p>The wastefulness of having to write the same app for multiple platforms isn’t the only thing that puts me off making native apps. The exclusivity works in two directions. There’s the exclusive nature of the runtime that requires a bespoke codebase. There’s also the exclusive nature of the app store. It feels like a return to shelves of packaged software with strict system requirements. You can’t just walk in and put your software on the shelf. That’s the shopkeeper’s job.</p>

<p>There is no shopkeeper for the World Wide Web.</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> RSS</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>
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>

+ 43
- 0
cache/2021/15d4f93dba253e3194c8dba52d0e8ee6/index.md View File

@@ -0,0 +1,43 @@
title: The principle of most availability
url: https://adactio.com/journal/17987
hash_url: 15d4f93dba253e3194c8dba52d0e8ee6

<p>I’ve been thinking some more about <a href="https://adactio.com/journal/17943">the technical experience of booking a vaccination apointment and how much joy it brought me</a>.</p>

<p>I’ve written before about how <a href="https://adactio.com/journal/9016">I’ve got a blind spot for the web</a> so it’s no surprise that I was praising the use of a well marked-up form, styled clearly, and unencumbered by unnecessary JavaScript. But other technologies were in play too: Short Message Service (SMS) and email.</p>

<p>All of those technologies are platform-agnostic.</p>

<p>No matter what operating system I’m using, or what email software I’ve chosen, email works. It gets more complicated when you introduce HTML email. My response to that is the same as the old joke; you know the one: “Doctor, it hurts when I do this.” (“Well, don’t do that.”)</p>

<p>No matter what operating system my phone is using, SMS works. It gets more complicated when you introduce read receipts, memoji, or other additions. See my response to HTML email.</p>

<p>Then there’s the web. No matter what operating system I’m using on a device that could be a phone or a tablet or a laptop or desktop tower, and no matter what browser I’ve chosen to use, the World Wide Web works.</p>

<p><a href="https://adactio.com/journal/17943#principle">I originally said</a>:</p>

<blockquote>
<p>It feels like <a href="https://adactio.com/journal/14327">the principle of least power</a> in action.</p>
</blockquote>

<p>But another way of rephrasing “least power” is “most availability.” Technologies that are old, simple, and <a href="https://mcfunley.com/choose-boring-technology">boring</a> tend to be more widely available.</p>

<p>I remember when software used to come packaged in boxes and displayed on shelves. The packaging always had a list on the side. It looked like the nutritional information on a food product, but this was a list of “system requirements”: operating system, graphics card, sound card, CPU. I never liked the idea of system requirements. It felt so …exclusionary. And for me, the promise of technology was liberation and freedom to act on my own terms.</p>

<p>Hence my soft spot for the boring and basic technologies like email, SMS, and yes, web pages. The difference with web pages is that you can choose to layer added extras on top. As long as the fundamental functionality is using universally-supported technology, you’re free to enhance with all the latest CSS and JavaScript. If any of it fails, that’s okay: it falls back to a nice solid base.</p>

<p>Alas, many developers don’t build with this mindset. I mean, I understand why: it means thinking about users with the most boring, least powerful technology. It’s simpler and more exciting to assume that everyone’s got a shared baseline of newer technology. But by doing that, you’re missing out on one of the web’s superpowers: that something served up at the same URL with the same underlying code can simultaneously serve people with older technology <em>and</em> also provide a whizz-bang experience to people with the latest and greatest technology.</p>

<p>Anyway, I’ve been thinking about the kind of communication technologies that are as universal as email, SMS, and the web.</p>

<p>QR codes are kind of heading in that direction, although I still have qualms because of their proprietary history. But there’s something nice and lo-fi about them. They’re like print stylesheets in reverse (and I <em>love</em> print stylesheets). A funky little bridge between the physical and the digital. I just wish they weren’t so opaque: you never know if scanning that QR code will actually take you to the promised resource, or if you’re about to rickroll yourself.</p>

<p>Telephone numbers kind of fall into the same category as SMS, but with the added option of voice. I’ve always found the prospect of doing something with, say, <a href="https://www.twilio.com/">Twilio</a>’s API more interesting than building something inside a walled garden like Facebook Messenger or Alexa.</p>

<p>I know very little about chat apps or voice apps, but I don’t think there’s a cross-platform format that works with different products, right? I imagine it’s like the situation with native apps which require a different codebase for each app store and operating system. And so there’s a constant stream of technologies that try to fulfil the dream of writing once and running everywhere: <a href="https://reactnative.dev/">React Native</a>, <a href="https://flutter.dev/">Flutter</a>.</p>

<p>They’re trying to solve a very clear and obvious problem: writing the same app more than once is really wasteful. But that’s the nature of the game when it comes to runtime-specific apps. The only alternative is to either <a href="https://www.joinclubhouse.com/">deliberately limit your audience</a> …or apply the principle of least power/most availability.</p>

<p>The wastefulness of having to write the same app for multiple platforms isn’t the only thing that puts me off making native apps. The exclusivity works in two directions. There’s the exclusive nature of the runtime that requires a bespoke codebase. There’s also the exclusive nature of the app store. It feels like a return to shelves of packaged software with strict system requirements. You can’t just walk in and put your software on the shelf. That’s the shopkeeper’s job.</p>

<p>There is no shopkeeper for the World Wide Web.</p>

+ 175
- 0
cache/2021/5243221f38525040d87e7407b08e1ff5/index.html View File

@@ -0,0 +1,175 @@
<!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>
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>log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu (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="#f0f0ea">
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- 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="http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html">

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

<article>
<header>
<h1>log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu</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="http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html" title="Lien vers le contenu original">Source originale</a>
</p>
</nav>
<hr>
<p><a href="http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html" title="2021-03-30"><strong>Mar. 30 mars 2021, Vanuatu</strong></a> (vol. 11, num. 19). — Akli Ait Abdallah, Michel Montreuil, Sébastien Heppell et Daniel Martineau sont partis au Vanuatu afin d’y faire un grand reportage audio. Il est passé ce dimanche sur les ondes de Radio Canada Première au cours de l’émission de Michel Désautels. Les auteurs traitent notamment des impacts des changements climatiques dans cet archipel du Pacifique Sud. Mais pas seulement, car l’on peut y découvrir certains pans de la vie dans ces îles.

</p>

<p>Surtout, lors de la diffusion à la radio, le reportage était bien sûr en stéréo. Or il se trouve que les auteurs sont partis avec un arbre mécanique et neufs micros afin de faire des prises de son à 360°. Ils ont donc édité <a href="https://ici.radio-canada.ca/premiere/emissions/desautels-le-dimanche/segments/reportage/349024/vanuatu-changement-climatique-akli-ait-abdallah">une version complètement immersive</a> (récupérable depuis la baladodiffusion <em>Immersion</em> sur <a href="https://ici.radio-canada.ca/ohdio/beta/balados/8226/immersion/521570/vanuatu-pacifique-sud-iles-environnement">Ohdio</a>) pourvu que l’on porte un casque (ou à moins d’avoir un ensemble son 5:1 chez soi). Ils ont même fait <a href="https://ici.radio-canada.ca/recit-numerique/2193/son-immersif-vanuatu-trois-dimensions">un reportage web sur cette expérience</a> avec quelques très belles photos.</p>

<p>J’ai trouvé le reportage vraiment passionnant. J’ai tellement accroché que durant l’écoute je suivais les déplacements des journalistes sur une carte. Et, sincèrement, avec le son 3D, c’est encore mieux. On s’y croirait.</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> RSS</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>
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>

+ 9
- 0
cache/2021/5243221f38525040d87e7407b08e1ff5/index.md View File

@@ -0,0 +1,9 @@
title: log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu
url: http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html
hash_url: 5243221f38525040d87e7407b08e1ff5

<p><a href="http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html" title="2021-03-30"><strong>Mar. 30 mars 2021, Vanuatu</strong></a> (vol. 11, num. 19). — Akli Ait Abdallah, Michel Montreuil, Sébastien Heppell et Daniel Martineau sont partis au Vanuatu afin d’y faire un grand reportage audio. Il est passé ce dimanche sur les ondes de Radio Canada Première au cours de l’émission de Michel Désautels. Les auteurs traitent notamment des impacts des changements climatiques dans cet archipel du Pacifique Sud. Mais pas seulement, car l’on peut y découvrir certains pans de la vie dans ces îles.

</p><p>Surtout, lors de la diffusion à la radio, le reportage était bien sûr en stéréo. Or il se trouve que les auteurs sont partis avec un arbre mécanique et neufs micros afin de faire des prises de son à 360°. Ils ont donc édité <a href="https://ici.radio-canada.ca/premiere/emissions/desautels-le-dimanche/segments/reportage/349024/vanuatu-changement-climatique-akli-ait-abdallah">une version complètement immersive</a> (récupérable depuis la baladodiffusion <em>Immersion</em> sur <a href="https://ici.radio-canada.ca/ohdio/beta/balados/8226/immersion/521570/vanuatu-pacifique-sud-iles-environnement">Ohdio</a>) pourvu que l’on porte un casque (ou à moins d’avoir un ensemble son 5:1 chez soi). Ils ont même fait <a href="https://ici.radio-canada.ca/recit-numerique/2193/son-immersif-vanuatu-trois-dimensions">un reportage web sur cette expérience</a> avec quelques très belles photos.</p>

<p>J’ai trouvé le reportage vraiment passionnant. J’ai tellement accroché que durant l’écoute je suivais les déplacements des journalistes sur une carte. Et, sincèrement, avec le son 3D, c’est encore mieux. On s’y croirait.</p>

+ 4
- 0
cache/2021/index.html View File

@@ -237,6 +237,8 @@
<li><a href="/david/cache/2021/eef2b3e3085a9b71cd7fe64f21fa0453/" title="Accès à l’article dans le cache local : Anxious feelings about optimisation through complexity">Anxious feelings about optimisation through complexity</a> (<a href="http://interconnected.org/home/2021/02/12/optimisation" title="Accès à l’article original distant : Anxious feelings about optimisation through complexity">original</a>)</li>
<li><a href="/david/cache/2021/5243221f38525040d87e7407b08e1ff5/" title="Accès à l’article dans le cache local : log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu">log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu</a> (<a href="http://shl.huld.re/~f6k/log/vol11/19-vanuatu.html" title="Accès à l’article original distant : log : vol. 11, num. 19, mar. 30 mars 2021, vanuatu">original</a>)</li>
<li><a href="/david/cache/2021/7405ceb4a34705e65bc5ccc4f025a0b8/" title="Accès à l’article dans le cache local : Collaboration productive : comment établir un flux de travail qui fonctionne pour toutes les disciplines">Collaboration productive : comment établir un flux de travail qui fonctionne pour toutes les disciplines</a> (<a href="https://numerique.canada.ca/2018/08/21/collaboration-productive/" title="Accès à l’article original distant : Collaboration productive : comment établir un flux de travail qui fonctionne pour toutes les disciplines">original</a>)</li>
<li><a href="/david/cache/2021/96ff9022e3ee0d37611b30f57205810e/" title="Accès à l’article dans le cache local : Ways I'm available to help.">Ways I'm available to help.</a> (<a href="https://lethain.com/ways-i-help/" title="Accès à l’article original distant : Ways I'm available to help.">original</a>)</li>
@@ -251,6 +253,8 @@
<li><a href="/david/cache/2021/6faa32ba37a3b1232125db9858700627/" title="Accès à l’article dans le cache local : Design Justice : repolitiser le design">Design Justice : repolitiser le design</a> (<a href="https://www.internetactu.net/2021/02/03/design-justice-repolitiser-le-design/" title="Accès à l’article original distant : Design Justice : repolitiser le design">original</a>)</li>
<li><a href="/david/cache/2021/15d4f93dba253e3194c8dba52d0e8ee6/" title="Accès à l’article dans le cache local : The principle of most availability">The principle of most availability</a> (<a href="https://adactio.com/journal/17987" title="Accès à l’article original distant : The principle of most availability">original</a>)</li>
<li><a href="/david/cache/2021/7b8d925b24ca7a4777becd5cc212d11a/" title="Accès à l’article dans le cache local : Technical Mentorship Reimagined: Time-bound and No Awkward Asks Necessary">Technical Mentorship Reimagined: Time-bound and No Awkward Asks Necessary</a> (<a href="https://shopify.engineering/technical-mentorship-reimagined" title="Accès à l’article original distant : Technical Mentorship Reimagined: Time-bound and No Awkward Asks Necessary">original</a>)</li>
<li><a href="/david/cache/2021/30069f97e4aa989a1d89fe8d88538da8/" title="Accès à l’article dans le cache local : We Had the COVID-19 Vaccine the Whole Time">We Had the COVID-19 Vaccine the Whole Time</a> (<a href="https://nymag.com/intelligencer/2020/12/moderna-covid-19-vaccine-design.html" title="Accès à l’article original distant : We Had the COVID-19 Vaccine the Whole Time">original</a>)</li>

Loading…
Cancel
Save