A place to cache linked articles (think custom and personal wayback machine)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 22KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Articles archivés — David Larlet</title>
  13. <meta name="description" content="Lien vers les publications externes mises en cache.">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Is that even respected? Retrospectively? What a shAItshow…
  28. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  29. <meta name="robots" content="noai, noimageai">
  30. <!-- Documented, feel free to shoot an email. -->
  31. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  32. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  33. <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>
  34. <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>
  35. <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>
  36. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  37. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  38. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  39. <script>
  40. function toggleTheme(themeName) {
  41. document.documentElement.classList.toggle(
  42. 'forced-dark',
  43. themeName === 'dark'
  44. )
  45. document.documentElement.classList.toggle(
  46. 'forced-light',
  47. themeName === 'light'
  48. )
  49. }
  50. const selectedTheme = localStorage.getItem('theme')
  51. if (selectedTheme !== 'undefined') {
  52. toggleTheme(selectedTheme)
  53. }
  54. </script>
  55. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  56. <header>
  57. <h1>Articles archivés</h1>
  58. </header>
  59. <nav>
  60. <p class="center">
  61. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  62. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  63. </svg> Accueil</a>
  64. </p>
  65. </nav>
  66. <hr>
  67. <main>
  68. <ul>
  69. <li><a href="/david/cache/2024/877ad04fd329c26c80113e15dec540df/" title="Accès à l’article dans le cache local : The Walk and Talk: Everything We Know">The Walk and Talk: Everything We Know</a> (<a href="https://craigmod.com/ridgeline/176/" title="Accès à l’article original distant : The Walk and Talk: Everything We Know">original</a>)</li>
  70. <li><a href="/david/cache/2024/fd6eda56671045e0c1e2d215e07f1a6f/" title="Accès à l’article dans le cache local : "></a> (<a href="https://jacobtomlinson.dev/effver/" title="Accès à l’article original distant : ">original</a>)</li>
  71. <li><a href="/david/cache/2024/d236f33cf82727313d17cb23bf36a395/" title="Accès à l’article dans le cache local : Reconsider your partnership with Brave">Reconsider your partnership with Brave</a> (<a href="https://kagifeedback.org/d/2808-reconsider-your-partnership-with-brave/6" title="Accès à l’article original distant : Reconsider your partnership with Brave">original</a>)</li>
  72. <li><a href="/david/cache/2024/e5c1ca8e3beeb0d256a064832c3566aa/" title="Accès à l’article dans le cache local : The personality of a personal website">The personality of a personal website</a> (<a href="https://manuelmoreale.com/the-personality-of-a-personal-website" title="Accès à l’article original distant : The personality of a personal website">original</a>)</li>
  73. <li><a href="/david/cache/2024/9bc04d41d25fc73391116d99b7259a3d/" title="Accès à l’article dans le cache local : notes">notes</a> (<a href="https://www.la-grange.net/2023/07/10/notes-train" title="Accès à l’article original distant : notes">original</a>)</li>
  74. <li><a href="/david/cache/2024/112d32ccefb9aec48180de42e1fe1534/" title="Accès à l’article dans le cache local : Quand je serai bien vieux">Quand je serai bien vieux</a> (<a href="https://n.survol.fr/n/quand-je-serai-bien-vieux" title="Accès à l’article original distant : Quand je serai bien vieux">original</a>)</li>
  75. <li><a href="/david/cache/2024/877b1e29328f6ad1b6fef26d7407ec5f/" title="Accès à l’article dans le cache local : Your tech stack is not the product">Your tech stack is not the product</a> (<a href="https://hoho.com/posts/your-stack-is-not-the-product/" title="Accès à l’article original distant : Your tech stack is not the product">original</a>)</li>
  76. <li><a href="/david/cache/2024/ba977526c7a8cab6935708b2cdba5c0c/" title="Accès à l’article dans le cache local : Aging programmer">Aging programmer</a> (<a href="https://world.hey.com/jorge/aging-programmer-d448bdec" title="Accès à l’article original distant : Aging programmer">original</a>)</li>
  77. <li><a href="/david/cache/2024/5030196507bcf3e06162e9eaed40abbe/" title="Accès à l’article dans le cache local : Blogging and Composting">Blogging and Composting</a> (<a href="https://blog.jim-nielsen.com/2023/blogging-and-compositing/" title="Accès à l’article original distant : Blogging and Composting">original</a>)</li>
  78. <li><a href="/david/cache/2024/7d2d2bce96cbc020423299e7de03d2cf/" title="Accès à l’article dans le cache local : Disillusioned with Deno">Disillusioned with Deno</a> (<a href="https://www.baldurbjarnason.com/2024/disillusioned-with-deno/" title="Accès à l’article original distant : Disillusioned with Deno">original</a>)</li>
  79. <li><a href="/david/cache/2024/40aada3cc8d6897fda5a277c4299c1fd/" title="Accès à l’article dans le cache local : We Need to Talk About the Front Web">We Need to Talk About the Front Web</a> (<a href="https://gericci.me/we-need-to-talk-about-the-front-web-5.html" title="Accès à l’article original distant : We Need to Talk About the Front Web">original</a>)</li>
  80. <li><a href="/david/cache/2024/7a223e552e8a8e3e11c759cbc5bc3ffa/" title="Accès à l’article dans le cache local : Opening Mail / frantic.im">Opening Mail / frantic.im</a> (<a href="https://frantic.im/opening-mail/" title="Accès à l’article original distant : Opening Mail / frantic.im">original</a>)</li>
  81. <li><a href="/david/cache/2024/b80f5159ee7ac70bcaa6a9fde16c2408/" title="Accès à l’article dans le cache local : Behind the controversy at Basecamp">Behind the controversy at Basecamp</a> (<a href="https://www.theverge.com/2021/4/27/22406673/basecamp-political-speech-policy-controversy" title="Accès à l’article original distant : Behind the controversy at Basecamp">original</a>)</li>
  82. <li><a href="/david/cache/2024/34fec23081019abd741e0578b050c40e/" title="Accès à l’article dans le cache local : Tools shape practices shape tools…">Tools shape practices shape tools…</a> (<a href="https://www.quaternum.net/2024/01/08/tools-shape-practices-shape-tools/" title="Accès à l’article original distant : Tools shape practices shape tools…">original</a>)</li>
  83. <li><a href="/david/cache/2024/faa1d8cae94da6838ff9351e5df791ca/" title="Accès à l’article dans le cache local : Make the indie web easier">Make the indie web easier</a> (<a href="https://gilest.org/indie-easy.html" title="Accès à l’article original distant : Make the indie web easier">original</a>)</li>
  84. <li><a href="/david/cache/2024/3debc675a055d691b32c7d6904531eb4/" title="Accès à l’article dans le cache local : How Google perfected the web">How Google perfected the web</a> (<a href="https://www.theverge.com/c/23998379/google-search-seo-algorithm-webpage-optimization" title="Accès à l’article original distant : How Google perfected the web">original</a>)</li>
  85. <li><a href="/david/cache/2024/d75afc90a9d3c3b5a56b69446795fbb5/" title="Accès à l’article dans le cache local : plaisir d'ébauche">plaisir d'ébauche</a> (<a href="https://www.la-grange.net/2024/01/06/ebauche" title="Accès à l’article original distant : plaisir d'ébauche">original</a>)</li>
  86. <li><a href="/david/cache/2024/c3272392d462da90874d32841e5caac8/" title="Accès à l’article dans le cache local : Where have all the websites gone?">Where have all the websites gone?</a> (<a href="https://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/" title="Accès à l’article original distant : Where have all the websites gone?">original</a>)</li>
  87. <li><a href="/david/cache/2024/89dbef9daef24f311b6401cef62f5855/" title="Accès à l’article dans le cache local : Des Oloés">Des Oloés</a> (<a href="https://tw5.immateriel.fr/wiki/immateriel/b/YXGEDFB" title="Accès à l’article original distant : Des Oloés">original</a>)</li>
  88. <li><a href="/david/cache/2024/1f40a33f9c57a16d420eb0868a129e96/" title="Accès à l’article dans le cache local : Notes from “An approach to computing and sustainability inspired from permaculture” by Devine LuLinvega">Notes from “An approach to computing and sustainability inspired from permaculture” by Devine LuLinvega</a> (<a href="https://blog.jim-nielsen.com/2024/notes-from-computing-sustainably/" title="Accès à l’article original distant : Notes from “An approach to computing and sustainability inspired from permaculture” by Devine LuLinvega">original</a>)</li>
  89. <li><a href="/david/cache/2024/9f8c0e75066c1882a3b4ce084e3223ed/" title="Accès à l’article dans le cache local : The Demo → Demo Loop">The Demo → Demo Loop</a> (<a href="https://daverupert.com/2022/06/demo-to-demo-loop/" title="Accès à l’article original distant : The Demo → Demo Loop">original</a>)</li>
  90. <li><a href="/david/cache/2024/99e7d2ba7e4adc69dbf0f1b2858a5248/" title="Accès à l’article dans le cache local : Style with Stateful, Semantic Selectors">Style with Stateful, Semantic Selectors</a> (<a href="https://benmyers.dev/blog/semantic-selectors/" title="Accès à l’article original distant : Style with Stateful, Semantic Selectors">original</a>)</li>
  91. <li><a href="/david/cache/2024/87c468a4eddabe5d2c28e902d7f17504/" title="Accès à l’article dans le cache local : je ne sais pas pourquoi">je ne sais pas pourquoi</a> (<a href="https://www.la-grange.net/2024/01/11/pourquoi" title="Accès à l’article original distant : je ne sais pas pourquoi">original</a>)</li>
  92. <li><a href="/david/cache/2024/3ea27fca4fabb81676fc1b98264f3bd8/" title="Accès à l’article dans le cache local : It’s OK to call it Artificial Intelligence">It’s OK to call it Artificial Intelligence</a> (<a href="https://simonwillison.net/2024/Jan/7/call-it-ai/" title="Accès à l’article original distant : It’s OK to call it Artificial Intelligence">original</a>)</li>
  93. <li><a href="/david/cache/2024/62bf3ce6ef66e39b7f250a6123d92e66/" title="Accès à l’article dans le cache local : Tomorrow & Tomorrow & Tomorrow">Tomorrow & Tomorrow & Tomorrow</a> (<a href="https://erinkissane.com/tomorrow-and-tomorrow-and-tomorrow" title="Accès à l’article original distant : Tomorrow & Tomorrow & Tomorrow">original</a>)</li>
  94. <li><a href="/david/cache/2024/ea2cfc9aa425a6967d2cacd9f96ceb9e/" title="Accès à l’article dans le cache local : Ask LukeW: New Ways into Web Content">Ask LukeW: New Ways into Web Content</a> (<a href="https://lukew.com/ff/entry.asp?2008" title="Accès à l’article original distant : Ask LukeW: New Ways into Web Content">original</a>)</li>
  95. <li><a href="/david/cache/2024/4a56aa5497e68df0c5bb1d5331203219/" title="Accès à l’article dans le cache local : When “Everything” Becomes Too Much: The npm Package Chaos of 2024">When “Everything” Becomes Too Much: The npm Package Chaos of 2024</a> (<a href="https://socket.dev/blog/when-everything-becomes-too-much" title="Accès à l’article original distant : When “Everything” Becomes Too Much: The npm Package Chaos of 2024">original</a>)</li>
  96. <li><a href="/david/cache/2024/668d0f82ae65b0e94ea76145057759a7/" title="Accès à l’article dans le cache local : ‘One in a million’ iPhone bridal photo explanation: blame panorama mode">‘One in a million’ iPhone bridal photo explanation: blame panorama mode</a> (<a href="https://www.theverge.com/2023/12/2/23985299/iphone-bridal-photo-three-poses-explanation-panorama-photoshop-generative-ai" title="Accès à l’article original distant : ‘One in a million’ iPhone bridal photo explanation: blame panorama mode">original</a>)</li>
  97. <li><a href="/david/cache/2024/b31ba18e3de1fc479b79f1885043026a/" title="Accès à l’article dans le cache local : When to use CSS text-wrap: balance; vs text-wrap: pretty;">When to use CSS text-wrap: balance; vs text-wrap: pretty;</a> (<a href="https://blog.stephaniestimac.com/posts/2023/10/css-text-wrap/" title="Accès à l’article original distant : When to use CSS text-wrap: balance; vs text-wrap: pretty;">original</a>)</li>
  98. <li><a href="/david/cache/2024/55477786fc56b6fc37bb97231b634d90/" title="Accès à l’article dans le cache local : Fabrique : concept">Fabrique : concept</a> (<a href="https://www.quaternum.net/2023/06/02/fabrique-concept/" title="Accès à l’article original distant : Fabrique : concept">original</a>)</li>
  99. <li><a href="/david/cache/2024/c98206d38897264005bcd5b453d032b1/" title="Accès à l’article dans le cache local : Designing better target sizes">Designing better target sizes</a> (<a href="https://ishadeed.com/article/target-size" title="Accès à l’article original distant : Designing better target sizes">original</a>)</li>
  100. <li><a href="/david/cache/2024/09c0739036ea4a8b6c985e127fe7e3c8/" title="Accès à l’article dans le cache local : ☕️ Journal : Carnets">☕️ Journal : Carnets</a> (<a href="https://thom4.net/2023/02/01/carnets/" title="Accès à l’article original distant : ☕️ Journal : Carnets">original</a>)</li>
  101. <li><a href="/david/cache/2024/076169df8a4bd9dde9a4637c6b306dff/" title="Accès à l’article dans le cache local : Ma page /now (ou plutôt /en-ce-moment)">Ma page /now (ou plutôt /en-ce-moment)</a> (<a href="https://blog.professeurjoachim.com/billet/2024-01-05-ma-page-now-ou-plutot-en-ce-moment" title="Accès à l’article original distant : Ma page /now (ou plutôt /en-ce-moment)">original</a>)</li>
  102. <li><a href="/david/cache/2024/e5056f8e0e6acf87c5777ba5b3a2ba92/" title="Accès à l’article dans le cache local : The UX of HTML ⚒ Nerd">The UX of HTML ⚒ Nerd</a> (<a href="https://vasilis.nl/nerd/the-ux-of-html/" title="Accès à l’article original distant : The UX of HTML ⚒ Nerd">original</a>)</li>
  103. <li><a href="/david/cache/2024/b1da1249f2db388d7e84d6ad23c2fc5d/" title="Accès à l’article dans le cache local : Data Luddism">Data Luddism</a> (<a href="https://www.danmcquillan.org/dataluddism.html" title="Accès à l’article original distant : Data Luddism">original</a>)</li>
  104. <li><a href="/david/cache/2024/e990536ed88823f047296ea25a6b7933/" title="Accès à l’article dans le cache local : Samsung caught faking zoom photos of the Moon">Samsung caught faking zoom photos of the Moon</a> (<a href="https://www.theverge.com/2023/3/13/23637401/samsung-fake-moon-photos-ai-galaxy-s21-s23-ultra" title="Accès à l’article original distant : Samsung caught faking zoom photos of the Moon">original</a>)</li>
  105. <li><a href="/david/cache/2024/84f8caf3e7f7b3de9e18281749c3687f/" title="Accès à l’article dans le cache local : Until the Right Design Emerges...">Until the Right Design Emerges...</a> (<a href="https://lukew.com/ff/entry.asp?2036" title="Accès à l’article original distant : Until the Right Design Emerges...">original</a>)</li>
  106. <li><a href="/david/cache/2024/cd2fda3dae5d89990f73fbdaa1c3b491/" title="Accès à l’article dans le cache local : build a world, not an audience">build a world, not an audience</a> (<a href="https://keningzhu.com/journal/build-a-world-not-an-audience" title="Accès à l’article original distant : build a world, not an audience">original</a>)</li>
  107. </ul>
  108. </main>
  109. <hr>
  110. <footer>
  111. <p>
  112. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  113. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  114. </svg> Accueil</a> •
  115. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  116. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  117. </svg> Suivre</a> •
  118. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  119. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  120. </svg> Pro</a> •
  121. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  122. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  123. </svg> Email</a> •
  124. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  125. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  126. </svg> Légal</abbr>
  127. </p>
  128. <template id="theme-selector">
  129. <form>
  130. <fieldset>
  131. <legend><svg class="icon icon-brightness-contrast">
  132. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  133. </svg> Thème</legend>
  134. <label>
  135. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  136. </label>
  137. <label>
  138. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  139. </label>
  140. <label>
  141. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  142. </label>
  143. </fieldset>
  144. </form>
  145. </template>
  146. </footer>
  147. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  148. <script>
  149. function loadThemeForm(templateName) {
  150. const themeSelectorTemplate = document.querySelector(templateName)
  151. const form = themeSelectorTemplate.content.firstElementChild
  152. themeSelectorTemplate.replaceWith(form)
  153. form.addEventListener('change', (e) => {
  154. const chosenColorScheme = e.target.value
  155. localStorage.setItem('theme', chosenColorScheme)
  156. toggleTheme(chosenColorScheme)
  157. })
  158. const selectedTheme = localStorage.getItem('theme')
  159. if (selectedTheme && selectedTheme !== 'undefined') {
  160. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  161. }
  162. }
  163. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  164. window.addEventListener('load', () => {
  165. let hasDarkRules = false
  166. for (const styleSheet of Array.from(document.styleSheets)) {
  167. let mediaRules = []
  168. for (const cssRule of styleSheet.cssRules) {
  169. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  170. continue
  171. }
  172. // WARNING: Safari does not have/supports `conditionText`.
  173. if (cssRule.conditionText) {
  174. if (cssRule.conditionText !== prefersColorSchemeDark) {
  175. continue
  176. }
  177. } else {
  178. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  179. continue
  180. }
  181. }
  182. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  183. }
  184. // WARNING: do not try to insert a Rule to a styleSheet you are
  185. // currently iterating on, otherwise the browser will be stuck
  186. // in a infinite loop…
  187. for (const mediaRule of mediaRules) {
  188. styleSheet.insertRule(mediaRule.cssText)
  189. hasDarkRules = true
  190. }
  191. }
  192. if (hasDarkRules) {
  193. loadThemeForm('#theme-selector')
  194. }
  195. })
  196. </script>
  197. </body>
  198. </html>