Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
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 18KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  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>
  13. Tag #IA
  14. — David Larlet</title>
  15. <meta name="description" content="Publications relatives au tag #IA">
  16. <!-- That good ol' feed, subscribe :). -->
  17. <link rel="alternate"
  18. type="application/atom+xml"
  19. title="Feed"
  20. href="/david/log/">
  21. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  22. <link rel="apple-touch-icon"
  23. sizes="180x180"
  24. href="/static/david/icons2/apple-touch-icon.png">
  25. <link rel="icon"
  26. type="image/png"
  27. sizes="32x32"
  28. href="/static/david/icons2/favicon-32x32.png">
  29. <link rel="icon"
  30. type="image/png"
  31. sizes="16x16"
  32. href="/static/david/icons2/favicon-16x16.png">
  33. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  34. <link rel="mask-icon"
  35. href="/static/david/icons2/safari-pinned-tab.svg"
  36. color="#07486c">
  37. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  38. <meta name="msapplication-TileColor" content="#f7f7f7">
  39. <meta name="msapplication-config"
  40. content="/static/david/icons2/browserconfig.xml">
  41. <meta name="theme-color"
  42. content="#f7f7f7"
  43. media="(prefers-color-scheme: light)">
  44. <meta name="theme-color"
  45. content="#272727"
  46. media="(prefers-color-scheme: dark)">
  47. <!-- Is that even respected? Retrospectively? What a shAItshow…
  48. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  49. <meta name="robots" content="noai, noimageai">
  50. <!-- Documented, feel free to shoot an email. -->
  51. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  52. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  53. <link rel="preload"
  54. href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2"
  55. as="font"
  56. type="font/woff2"
  57. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  58. crossorigin>
  59. <link rel="preload"
  60. href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2"
  61. as="font"
  62. type="font/woff2"
  63. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  64. crossorigin>
  65. <link rel="preload"
  66. href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2"
  67. as="font"
  68. type="font/woff2"
  69. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  70. crossorigin>
  71. <link rel="preload"
  72. href="/static/david/css/fonts/triplicate_t3_regular.woff2"
  73. as="font"
  74. type="font/woff2"
  75. media="(prefers-color-scheme: dark)"
  76. crossorigin>
  77. <link rel="preload"
  78. href="/static/david/css/fonts/triplicate_t3_bold.woff2"
  79. as="font"
  80. type="font/woff2"
  81. media="(prefers-color-scheme: dark)"
  82. crossorigin>
  83. <link rel="preload"
  84. href="/static/david/css/fonts/triplicate_t3_italic.woff2"
  85. as="font"
  86. type="font/woff2"
  87. media="(prefers-color-scheme: dark)"
  88. crossorigin>
  89. <script>
  90. function toggleTheme(themeName) {
  91. document.documentElement.classList.toggle(
  92. 'forced-dark',
  93. themeName === 'dark'
  94. )
  95. document.documentElement.classList.toggle(
  96. 'forced-light',
  97. themeName === 'light'
  98. )
  99. }
  100. const selectedTheme = localStorage.getItem('theme')
  101. if (selectedTheme !== 'undefined') {
  102. toggleTheme(selectedTheme)
  103. }
  104. </script>
  105. <style type="text/css">
  106. details[open] summary {
  107. display: none;
  108. }
  109. </style>
  110. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick"
  111. data-instant-intensity="viewport-all">
  112. <header>
  113. <h1>Publications relatives au tag #IA</h1>
  114. </header>
  115. <nav>
  116. <p class="center">
  117. <a href="/david/" title="Aller à l’accueil">
  118. <svg class="icon icon-home">
  119. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  120. </svg>
  121. Accueil</a>
  122. • <a rel="tags"
  123. href="/david/#tags-2023"
  124. title="Liste de toutes les étiquettes">
  125. <svg class="icon icon-tags">
  126. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-tags"></use>
  127. </svg>
  128. Étiquettes</a>
  129. </p>
  130. </nav>
  131. <hr>
  132. <main>
  133. <p>Les plus récentes en premier, les 3 premières sont dépliées et ensuite c’est à la demande, bonne exploration !</p>
  134. <h2>
  135. <a href="/david/2024/01/10/" title="Lien permanent vers cet article">Écriture</a> (2024-01-10)
  136. </h2>
  137. <blockquote lang="en">
  138. <p>And, I’ll assume we all agree that owning your own website is a <em>good thing</em>, and we all want more people to do&nbsp;it.</p>
  139. <p>But here’s the thing: we need more tools for it. We need simpler tools for it. And we need to make installing and using them <em>trivially simple</em>.</p>
  140. <p>We need more self-hosted platforms for personal publishing that <em>aren’t Wordpress</em>. <mark>And don’t point me to Hugo or Netlify or Eleventy or all those things - all of them are great, but none of them are simple enough.</mark> We need web publishing tools that do not require users to open the Terminal <em>at all</em>. And we need lots of&nbsp;them.</p>
  141. <p>We need a whole <em>galaxy</em> of&nbsp;options.</p>
  142. <p><cite><em><a data-link-domain="gilest.org" href="https://gilest.org/indie-easy.html">Let’s make the indie web easier</a> <a href="/david/cache/2024/faa1d8cae94da6838ff9351e5df791ca/" title="Copie locale au 2024-01-09">[archive]</a></em></cite></p>
  143. </blockquote>
  144. <p>Quelques étoiles dans la&nbsp;galaxie&nbsp;:</p>
  145. <ul>
  146. <li><a data-link-domain="atelier.scribouilli.org" href="https://atelier.scribouilli.org/">Scribouilli</a> (<a data-link-domain="github.com" href="https://github.com/Scribouilli/scribouilli">code</a>) par <a data-link-domain="lechappeebelle.team" href="https://lechappeebelle.team/">L’Échappée Belle</a>&#8239;;</li>
  147. <li><a data-link-domain="write.as" href="https://write.as/">Write.as</a> (<a data-link-domain="writefreely.org" href="https://writefreely.org/">open-source</a>) est le plus proche que je pourrais conseiller avec un support commercial de <a data-link-domain="musing.studio" href="https://musing.studio/">Musing Studio</a>&#8239;;</li>
  148. <li><a data-link-domain="masto.host" href="https://masto.host/">mastohost</a> —&nbsp;que <a data-link-domain="fedi.larlet.fr" href="https://fedi.larlet.fr/">j’utilise</a>&nbsp;— permet d’avoir son propre domaine aussi sans vraiment de connaissance technique, le support est&nbsp;réactif&#8239;;</li>
  149. <li><a data-link-domain="carrd.co" href="https://carrd.co/">Carrd</a> est revenu plusieurs fois dans ma bulle ces derniers&nbsp;temps&#8239;;</li>
  150. <li><a data-link-domain="pika.page" href="https://pika.page/">Pika</a> aussi avec une saveur plus&nbsp;humaine.</li>
  151. </ul>
  152. <p>Il y a une bonne liste dans <a data-link-domain="mastodon.social" href="https://mastodon.social/@matthiasott/111557355056827064">cette discussion</a> et une autre <a data-link-domain="robertkingett.com" href="https://robertkingett.com/links/">par ici</a> (section <q lang="en">Managed Static site hosts or Blogging platforms</q>).</p>
  153. <hr />
  154. <blockquote lang="en">
  155. <p>Among its suggestions: write a longer headline; split a six-sentence paragraph up because it’s “too long”; and replace “too complex” words like “invariably,” “notoriety,” and “modification.” Dozens of sentences were flagged as being confusing (I disagree) — and it really hated em dashes. I rewrote my prose over and over, but it didn’t seem to satisfy my robot grader. I finally chose one thought per sentence, broke up paragraphs, and replaced words with suggested keywords to get rid of the red dots signaling&nbsp;problems.</p>
  156. <p><mark>The result feels like an AI summary of my story</mark> — at any moment, a paragraph could start with “In conclusion…” or “The next thing to consider is…” The nuance, voice, and unexpected twists and turns have been snuffed out. I’m sure some people would prefer this uncomplicated, beat-by-beat version of the story, but it’s gone from being a story written by a real person to a clinical, stiff series of&nbsp;sentences.</p>
  157. <p><cite><em><a data-link-domain="theverge.com" href="https://www.theverge.com/c/23998379/google-search-seo-algorithm-webpage-optimization">The Perfect Web Page</a> <a href="/david/cache/2024/3debc675a055d691b32c7d6904531eb4/" title="Copie locale au 2024-01-09">[archive]</a></em></cite></p>
  158. </blockquote>
  159. <p>Un article de TheVerge qui risque de ne pas être très bien référencé. Le moment où l’on s’adapte pour nourrir les robots n’est pas nouveau, on a «&nbsp;juste&nbsp;» mis une nouvelle étiquette dessus en 2023&nbsp;qui permet aux robots / algorithmes de se battre entre eux de manière&nbsp;explicite.</p>
  160. <p>Pas sûr de vouloir <a data-link-domain="darkvisitors.com" href="https://darkvisitors.com/robots-txt-builder">entrer sur le ring</a> sans m’épuiser très&nbsp;vite.</p>
  161. <blockquote lang="en">
  162. <p>I propose <mark>Data Luddism</mark> as a radical response to the productive power of big data and predictive algorithms. My starting point is not the Romantic neo-Luddism of Kirkpatrick Sale but the historical Luddism of 1811-1816, and the Luddites' own rhetoric regarding their resistance to 'obnoxious&nbsp;machines'.</p>
  163. <p><cite><em><a data-link-domain="danmcquillan.org" href="https://www.danmcquillan.org/dataluddism.html">Data Luddism</a> <a href="/david/cache/2024/b1da1249f2db388d7e84d6ad23c2fc5d/" title="Copie locale au 2024-01-09">[archive]</a></em></cite></p>
  164. </blockquote>
  165. <hr />
  166. <blockquote lang="en">
  167. <p>The <code>everything</code> package and its 3,000+ sub-packages have caused a Denial of Service (DOS) for anyone who installs it. We’re talking about storage space running out and system resource&nbsp;exhaustion.</p>
  168. <p>But that’s not all. The creator took their prank to the next level by setting up http://everything.npm.lol, showcasing the chaos they unleashed. They even included a meme from Skyrim, adding some humor (or mockery, depending on your perspective) to the&nbsp;situation.</p>
  169. <p><cite><em><a data-link-domain="socket.dev" href="https://socket.dev/blog/when-everything-becomes-too-much">When “Everything” Becomes Too Much: The npm Package Chaos of 2024</a> <a href="/david/cache/2024/4a56aa5497e68df0c5bb1d5331203219/" title="Copie locale au 2024-01-09">[archive]</a></em></cite></p>
  170. </blockquote>
  171. <p><code>npm install lol</code> 🤣</p>
  172. <p>En <a data-link-domain="jop2024.lol" href="https://jop2024.lol/">parlant de lol</a>…</p>
  173. <hr />
  174. <blockquote>
  175. <p>Si les fictions, celles qu’on s’invente, celles que nous souffle notre inconscient comme celles qu’on lit, ont un rôle majeur à jouer dans la fabrique de notre rapport au monde, alors voilà qui plaide pour redoubler d’ardeur quand il s’agit de nourrir soigneusement nos imaginaires. Quand on voit les déferlements de violence et le virilisme qui caractérisent les héros modernes, on ne peut que s’interroger sur le type de rapport au monde que cela crée. C’est la raison pour laquelle <mark>la bataille culturelle passe aussi par la création de nouvelles utopies,</mark> ni niaises ni naïves, qui puissent donner d’autres matières à rêver qu’un monde dévasté et peuplé de soldats&nbsp;augmentés.</p>
  176. <p>[…] Nous avons besoin d’autres cadres de pensée dans lesquels évoluer. Nous avons besoin d’<em>ailleurs culturels</em> pour sortir de l’ornière et nous&nbsp;dérouter.</p>
  177. <p><cite><em>Alors nous irons trouver la beauté ailleurs</em>, Corinne Morel&nbsp;Darleux</cite></p>
  178. </blockquote>
  179. <p>Nous accueillons une nouvelle personne chez Scopyleft, l’occasion de former une <a href="/david/2021/03/17/">nouvelle équipe</a>. Ces <em>ailleurs culturels</em> doivent pouvoir être partagés et inspirer pour réussir à&nbsp;essaimer.</p>
  180. <p>C’est l’une de mes frustrations à ne plus <a href="/david/2021/01/26/">participer à des regroupements</a>, ne pas partager par ce biais là les expériences menées depuis 11&nbsp;ans en matière d’horizontalité et de travail en&nbsp;commun·s.</p>
  181. <hr />
  182. <blockquote lang="en">
  183. <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&nbsp;it.</p>
  184. <p>Here’s the best part. <mark>You can be that curator right now, at this very moment.</mark> 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&nbsp;it.</p>
  185. <p><cite><em><a data-link-domain="fromjason.xyz" href="https://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/">Where have all the websites gone?</a> <a href="/david/cache/2024/c3272392d462da90874d32841e5caac8/" title="Copie locale au 2024-01-09">[archive]</a></em></cite></p>
  186. </blockquote>
  187. <p>Dixième jour que j’ai l’impression de faire des billets trop longs. Beaucoup d’éparpillement suite à un cumul d’onglets ouverts, parfois depuis bien longtemps. Ça vous laisse un petit exercice de <q lang="en">curation</q> vous&nbsp;aussi&nbsp;:).</p>
  188. </main>
  189. <hr>
  190. <footer>
  191. <p>
  192. <nobr>
  193. <a href="/david/" title="Aller à l’accueil">
  194. <svg class="icon icon-home">
  195. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"></use>
  196. </svg>
  197. Accueil</a>
  198. </nobr>
  199. <nobr>
  200. <a href="/david/log/" title="Accès au flux RSS">
  201. <svg class="icon icon-rss2">
  202. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
  203. </svg>
  204. Suivre</a>
  205. </nobr>
  206. <nobr>
  207. <a href="http://larlet.com"
  208. title="Go to my English profile"
  209. data-instant>
  210. <svg class="icon icon-user-tie">
  211. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
  212. </svg>
  213. Pro</a>
  214. </nobr>
  215. <nobr>
  216. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">
  217. <svg class="icon icon-mail">
  218. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
  219. </svg>
  220. Email</a>
  221. </nobr>
  222. <nobr>
  223. <abbr class="nowrap"
  224. title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">
  225. <svg class="icon icon-hammer2">
  226. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
  227. </svg>
  228. Légal</abbr>
  229. </nobr>
  230. </p>
  231. <template id="theme-selector">
  232. <form>
  233. <fieldset>
  234. <legend>
  235. <svg class="icon icon-brightness-contrast">
  236. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
  237. </svg>
  238. Thème
  239. </legend>
  240. <label>
  241. <input type="radio" value="auto" name="chosen-color-scheme" checked>
  242. Auto
  243. </label>
  244. <label>
  245. <input type="radio" value="dark" name="chosen-color-scheme">
  246. Foncé
  247. </label>
  248. <label>
  249. <input type="radio" value="light" name="chosen-color-scheme">
  250. Clair
  251. </label>
  252. </fieldset>
  253. </form>
  254. </template>
  255. </footer>
  256. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  257. <script>
  258. function loadThemeForm(templateName) {
  259. const themeSelectorTemplate = document.querySelector(templateName)
  260. const form = themeSelectorTemplate.content.firstElementChild
  261. themeSelectorTemplate.replaceWith(form)
  262. form.addEventListener('change', (e) => {
  263. const chosenColorScheme = e.target.value
  264. localStorage.setItem('theme', chosenColorScheme)
  265. toggleTheme(chosenColorScheme)
  266. })
  267. const selectedTheme = localStorage.getItem('theme')
  268. if (selectedTheme && selectedTheme !== 'undefined') {
  269. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  270. }
  271. }
  272. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  273. window.addEventListener('load', () => {
  274. let hasDarkRules = false
  275. for (const styleSheet of Array.from(document.styleSheets)) {
  276. let mediaRules = []
  277. for (const cssRule of styleSheet.cssRules) {
  278. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  279. continue
  280. }
  281. // WARNING: Safari does not have/supports `conditionText`.
  282. if (cssRule.conditionText) {
  283. if (cssRule.conditionText !== prefersColorSchemeDark) {
  284. continue
  285. }
  286. } else {
  287. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  288. continue
  289. }
  290. }
  291. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  292. }
  293. // WARNING: do not try to insert a Rule to a styleSheet you are
  294. // currently iterating on, otherwise the browser will be stuck
  295. // in a infinite loop…
  296. for (const mediaRule of mediaRules) {
  297. styleSheet.insertRule(mediaRule.cssText)
  298. hasDarkRules = true
  299. }
  300. }
  301. if (hasDarkRules) {
  302. loadThemeForm('#theme-selector')
  303. }
  304. })
  305. </script>
  306. </body>
  307. </html>