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 25KB

5 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534
  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>
  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,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Longing for a calling (archive) — David Larlet</title>
  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
  17. <link rel="manifest" href="/manifest.json">
  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">
  20. <meta name="apple-mobile-web-app-title" content="David Larlet">
  21. <meta name="application-name" content="David Larlet">
  22. <meta name="msapplication-TileColor" content="#da532c">
  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- That good ol' feed, subscribe :p. -->
  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">
  27. <meta name="robots" content="noindex, nofollow">
  28. <meta content="origin-when-cross-origin" name="referrer">
  29. <!-- Canonical URL for SEO purposes -->
  30. <link rel="canonical" href="https://www.hypothermia.fr/2019/01/longing-for-a-calling/">
  31. <style>
  32. /* http://meyerweb.com/eric/tools/css/reset/ */
  33. html, body, div, span,
  34. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  35. a, abbr, address, big, cite, code,
  36. del, dfn, em, img, ins,
  37. small, strike, strong, tt, var,
  38. dl, dt, dd, ol, ul, li,
  39. fieldset, form, label, legend,
  40. table, caption, tbody, tfoot, thead, tr, th, td,
  41. article, aside, canvas, details, embed,
  42. figure, figcaption, footer, header, hgroup,
  43. menu, nav, output, ruby, section, summary,
  44. time, mark, audio, video {
  45. margin: 0;
  46. padding: 0;
  47. border: 0;
  48. font-size: 100%;
  49. font: inherit;
  50. vertical-align: baseline;
  51. }
  52. /* HTML5 display-role reset for older browsers */
  53. article, aside, details, figcaption, figure,
  54. footer, header, hgroup, menu, nav, section { display: block; }
  55. body { line-height: 1; }
  56. blockquote, q { quotes: none; }
  57. blockquote:before, blockquote:after,
  58. q:before, q:after {
  59. content: '';
  60. content: none;
  61. }
  62. table {
  63. border-collapse: collapse;
  64. border-spacing: 0;
  65. }
  66. /* http://practicaltypography.com/equity.html */
  67. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  68. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  69. @font-face {
  70. font-family: 'EquityTextB';
  71. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  72. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  73. font-weight: 300;
  74. font-style: normal;
  75. font-display: swap;
  76. }
  77. @font-face {
  78. font-family: 'EquityTextB';
  79. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  80. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  81. font-weight: 300;
  82. font-style: italic;
  83. font-display: swap;
  84. }
  85. @font-face {
  86. font-family: 'EquityTextB';
  87. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  88. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  89. font-weight: 700;
  90. font-style: normal;
  91. font-display: swap;
  92. }
  93. @font-face {
  94. font-family: 'ConcourseT3';
  95. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  96. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  97. font-weight: 300;
  98. font-style: normal;
  99. font-display: swap;
  100. }
  101. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  102. body {
  103. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  104. font-family: "EquityTextB", Palatino, serif;
  105. background-color: #f0f0ea;
  106. color: #07486c;
  107. font-kerning: normal;
  108. -moz-osx-font-smoothing: grayscale;
  109. -webkit-font-smoothing: subpixel-antialiased;
  110. text-rendering: optimizeLegibility;
  111. font-variant-ligatures: common-ligatures contextual;
  112. font-feature-settings: "kern", "liga", "clig", "calt";
  113. }
  114. pre, code, kbd, samp, var, tt {
  115. font-family: 'TriplicateT4c', monospace;
  116. }
  117. em {
  118. font-style: italic;
  119. color: #323a45;
  120. }
  121. strong {
  122. font-weight: bold;
  123. color: black;
  124. }
  125. nav {
  126. background-color: #323a45;
  127. color: #f0f0ea;
  128. display: flex;
  129. justify-content: space-around;
  130. padding: 1rem .5rem;
  131. }
  132. nav:last-child {
  133. border-bottom: 1vh solid #2d7474;
  134. }
  135. nav a {
  136. color: #f0f0ea;
  137. }
  138. nav abbr {
  139. border-bottom: 1px dotted white;
  140. }
  141. h1 {
  142. border-top: 1vh solid #2d7474;
  143. border-bottom: .2vh dotted #2d7474;
  144. background-color: #e3e1e1;
  145. color: #323a45;
  146. text-align: center;
  147. padding: 5rem 0 4rem 0;
  148. width: 100%;
  149. font-family: 'ConcourseT3';
  150. display: flex;
  151. flex-direction: column;
  152. }
  153. h1.single {
  154. padding-bottom: 10rem;
  155. }
  156. h1 span {
  157. position: absolute;
  158. top: 1vh;
  159. left: 20%;
  160. line-height: 0;
  161. }
  162. h1 span a {
  163. line-height: 1.7;
  164. padding: 1rem 1.2rem .6rem 1.2rem;
  165. border-radius: 0 0 6% 6%;
  166. background: #2d7474;
  167. font-size: 1.3rem;
  168. color: white;
  169. text-decoration: none;
  170. }
  171. h2 {
  172. margin: 4rem 0 1rem;
  173. border-top: .2vh solid #2d7474;
  174. padding-top: 1vh;
  175. }
  176. h3 {
  177. text-align: center;
  178. margin: 3rem 0 .75em;
  179. }
  180. hr {
  181. height: .4rem;
  182. width: .4rem;
  183. border-radius: .4rem;
  184. background: #07486c;
  185. margin: 2.5rem auto;
  186. }
  187. time {
  188. display: bloc;
  189. margin-left: 0 !important;
  190. }
  191. ul, ol {
  192. margin: 2rem;
  193. }
  194. ul {
  195. list-style-type: square;
  196. }
  197. a {
  198. text-decoration-skip-ink: auto;
  199. text-decoration-thickness: 0.05em;
  200. text-underline-offset: 0.09em;
  201. }
  202. article {
  203. max-width: 50rem;
  204. display: flex;
  205. flex-direction: column;
  206. margin: 2rem auto;
  207. }
  208. article.single {
  209. border-top: .2vh dotted #2d7474;
  210. margin: -6rem auto 1rem auto;
  211. background: #f0f0ea;
  212. padding: 2rem;
  213. }
  214. article p:last-child {
  215. margin-bottom: 1rem;
  216. }
  217. p {
  218. padding: 0 .5rem;
  219. margin-left: 3rem;
  220. }
  221. p + p,
  222. figure + p {
  223. margin-top: 2rem;
  224. }
  225. blockquote {
  226. background-color: #e3e1e1;
  227. border-left: .5vw solid #2d7474;
  228. display: flex;
  229. flex-direction: column;
  230. align-items: center;
  231. padding: 1rem;
  232. margin: 1.5rem;
  233. }
  234. blockquote cite {
  235. font-style: italic;
  236. }
  237. blockquote p {
  238. margin-left: 0;
  239. }
  240. figure {
  241. border-top: .2vh solid #2d7474;
  242. background-color: #e3e1e1;
  243. text-align: center;
  244. padding: 1.5rem 0;
  245. margin: 1rem 0 0;
  246. font-size: 1.5rem;
  247. width: 100%;
  248. }
  249. figure img {
  250. max-width: 250px;
  251. max-height: 250px;
  252. border: .5vw solid #323a45;
  253. padding: 1px;
  254. }
  255. figcaption {
  256. padding: 1rem;
  257. line-height: 1.4;
  258. }
  259. aside {
  260. display: flex;
  261. flex-direction: column;
  262. background-color: #e3e1e1;
  263. padding: 1rem 0;
  264. border-bottom: .2vh solid #07486c;
  265. }
  266. aside p {
  267. max-width: 50rem;
  268. margin: 0 auto;
  269. }
  270. /* https://fvsch.com/code/css-locks/ */
  271. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  272. font-size: 1rem;
  273. line-height: calc( 1.5em + 0.2 * 1rem );
  274. }
  275. h1 {
  276. font-size: 1.9rem;
  277. line-height: calc( 1.2em + 0.2 * 1rem );
  278. }
  279. h2 {
  280. font-size: 1.6rem;
  281. line-height: calc( 1.3em + 0.2 * 1rem );
  282. }
  283. h3 {
  284. font-size: 1.35rem;
  285. line-height: calc( 1.4em + 0.2 * 1rem );
  286. }
  287. @media (min-width: 20em) {
  288. /* The (100vw - 20rem) / (50 - 20) part
  289. resolves to 0-1rem, depending on the
  290. viewport width (between 20em and 50em). */
  291. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  292. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  293. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  294. margin-left: 0;
  295. }
  296. h1 {
  297. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  298. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  299. }
  300. h2 {
  301. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  302. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  303. }
  304. h3 {
  305. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  306. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  307. }
  308. }
  309. @media (min-width: 50em) {
  310. /* The right part of the addition *must* be a
  311. rem value. In this example we *could* change
  312. the whole declaration to font-size:2.5rem,
  313. but if our baseline value was not expressed
  314. in rem we would have to use calc. */
  315. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  316. font-size: calc( 1rem + .6 * 1rem );
  317. line-height: 1.5em;
  318. }
  319. p, li, pre, details {
  320. margin-left: 3rem;
  321. }
  322. h1 {
  323. font-size: calc( 1.9rem + 1.5 * 1rem );
  324. line-height: 1.2em;
  325. }
  326. h2 {
  327. font-size: calc( 1.5rem + 1.5 * 1rem );
  328. line-height: 1.3em;
  329. }
  330. h3 {
  331. font-size: calc( 1.35rem + 1.5 * 1rem );
  332. line-height: 1.4em;
  333. }
  334. figure img {
  335. max-width: 500px;
  336. max-height: 500px;
  337. }
  338. }
  339. figure.unsquared {
  340. margin-bottom: 1.5rem;
  341. }
  342. figure.unsquared img {
  343. height: inherit;
  344. }
  345. @media print {
  346. body { font-size: 100%; }
  347. a:after { content: " (" attr(href) ")"; }
  348. a, a:link, a:visited, a:after {
  349. text-decoration: underline;
  350. text-shadow: none !important;
  351. background-image: none !important;
  352. background: white;
  353. color: black;
  354. }
  355. abbr[title] { border-bottom: 0; }
  356. abbr[title]:after { content: " (" attr(title) ")"; }
  357. img { page-break-inside: avoid; }
  358. @page { margin: 2cm .5cm; }
  359. h1, h2, h3 { page-break-after: avoid; }
  360. p3 { orphans: 3; widows: 3; }
  361. img {
  362. max-width: 250px !important;
  363. max-height: 250px !important;
  364. }
  365. nav, aside { display: none; }
  366. }
  367. ul.with_columns {
  368. column-count: 1;
  369. }
  370. @media (min-width: 20em) {
  371. ul.with_columns {
  372. column-count: 2;
  373. }
  374. }
  375. @media (min-width: 50em) {
  376. ul.with_columns {
  377. column-count: 3;
  378. }
  379. }
  380. ul.with_two_columns {
  381. column-count: 1;
  382. }
  383. @media (min-width: 20em) {
  384. ul.with_two_columns {
  385. column-count: 1;
  386. }
  387. }
  388. @media (min-width: 50em) {
  389. ul.with_two_columns {
  390. column-count: 2;
  391. }
  392. }
  393. .gallery {
  394. display: flex;
  395. flex-wrap: wrap;
  396. justify-content: space-around;
  397. }
  398. .gallery figure img {
  399. margin-left: 1rem;
  400. margin-right: 1rem;
  401. }
  402. .gallery figure figcaption {
  403. font-family: 'ConcourseT3'
  404. }
  405. footer {
  406. font-family: 'ConcourseT3';
  407. display: flex;
  408. flex-direction: column;
  409. border-top: 3px solid white;
  410. padding: 4rem 0;
  411. background-color: #07486c;
  412. color: white;
  413. }
  414. footer > * {
  415. max-width: 50rem;
  416. margin: 0 auto;
  417. }
  418. footer a {
  419. color: #f1c40f;
  420. }
  421. footer .avatar {
  422. width: 200px;
  423. height: 200px;
  424. border-radius: 50%;
  425. float: left;
  426. -webkit-shape-outside: circle();
  427. shape-outside: circle();
  428. margin-right: 2rem;
  429. padding: 2px 5px 5px 2px;
  430. background: white;
  431. border-left: 1px solid #f1c40f;
  432. border-top: 1px solid #f1c40f;
  433. border-right: 5px solid #f1c40f;
  434. border-bottom: 5px solid #f1c40f;
  435. }
  436. </style>
  437. <h1>
  438. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  439. Longing for a calling (archive)
  440. <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
  441. </h1>
  442. <section>
  443. <article>
  444. <h3><a href="https://www.hypothermia.fr/2019/01/longing-for-a-calling/">Source originale du contenu</a></h3>
  445. <p>Noëlie me laissait parfois l’accompagner sur le chemin de retour du collège. Faire un détour jusque chez elle ne me dérangeait pas – je la trouvais si jolie et fière, j’espérais secrètement qu’elle déteindrait sur moi en la talonnant. Son trajet traversait une place entourée des immeubles les plus hauts de la ville. Parfois, elle m’y défiait d’un regard complice : <em>« Allez, on crie ? »</em> Nous nous plantions alors au beau milieu du carrefour, répétions ensemble <em>« 3, 2, 1… »</em> et hurlions à pleins poumons avant de détaler, laissant l’écho de nos cris rebondir sur les murs.</p>
  446. <p>J’ai redécouvert l’essence du cri il y a quelques années, durant <a href="https://www.hypothermia.fr/2016/01/voix/">ce cours sur la voix</a> auquel je pense encore souvent aujourd’hui. Dans une petite salle aux murs insonorisés, le prof nous avait invités à nous laisser aller aussi fort que nous le pouvions <em>« … pour cracher nos démons et leur faire si peur qu’ils ne reviendront pas de si tôt »</em>. Une des participantes a lâché qu’il serait chouette d’avoir toujours à portée une pièce capitonnée où évacuer le trop plein. J’ai répondu que ma voiture remplissait merveilleusement cet office.</p>
  447. <p>Peu avant Noël encore, interrompant un long trajet vers mes racines, je me suis garée sur une aire d’autoroute déserte et j’ai expulsé du plus haut de mes cordes vocales une pelote de nœuds qui me rongeait l’estomac depuis la veille. Le cri remplit intégralement l’espace à l’intérieur, faisant fuir tout le reste. Une thérapie de choc qui fait toujours ses preuves lorsque j’ai besoin d’une décompression d’urgence.</p>
  448. <p><audio class="wp-audio-shortcode" id="audio-12703-1" preload="none" controls="controls"><source type="audio/mpeg" src="https://www.hypothermia.fr/media/2019/01/Gjallarhorn-Kulning.mp3?_=1"/><a href="https://www.hypothermia.fr/media/2019/01/Gjallarhorn-Kulning.mp3">https://www.hypothermia.fr/media/2019/01/Gjallarhorn-Kulning.mp3</a></audio><p class="smaller">Gjallarhorn – Kulning</p><p>Ce morceau est hérité de ma période musicale mystico-électro-médiévale adolescente, qui refait encore régulièrement surface dans mes oreilles. Je trouvais une telle satisfaction dans ce cri inhumain si mélodieux. L’écouter me tenait au seuil des univers parallèles que cette sirène me faisait miroiter par son chant surnaturel. Je pensais que sa voix était un don unique, un talent inné. J’étais loin de savoir qu’avec de la pratique, il serait tout à fait à ma portée.</p><p>Le kulning est une technique particulière de chant traditionnellement utilisée par les bergères de pays nordiques pour rappeler leurs troupeaux sur de longues distances. C’est cette vidéo virale de <a href="https://www.youtube.com/channel/UCAk3t7WHs2zjsZpopox8Taw">Jonna Jinton</a> qui m’en a fait retomber amoureuse, et m’a questionnée sur son enseignement. Jonna incarnant le cliché de la belle suédoise vivant d’amour, de nature et d’eau fraîche dans sa maison au cœur des vastes étendues nordiques – je me suis instinctivement dit que le secret de ce chant devait être jalousement gardé et transmis de mère en fille Viking. Quelque chose qui m’était donc complètement inaccessible.</p>
  449. <p>J’ai retrouvé le kulning un peu par hasard il y a quelques mois, en première partie du <a href="https://www.hypothermia.fr/2018/05/memoria-hospitis-unius-diei-praetereuntis/">concert d’Amenra</a>. Je n’étais clairement pas enchantée par Myrkur, qui m’insupportait par les maniérismes de son jeu de scène et la saturation extrême de ses instrumentalisations. J’ai toutefois été médusée de reconnaître ces lignes mélodiques suraiguës si envoûtantes au beau milieu d’un ses morceaux, ravivant aussitôt ma passion. De la Suède j’avais basculé au Danemark ; d’ici la Suisse il ne restait qu’un pas à faire, non ?</p><p>Ce chant m’est ainsi devenu une véritable lubie ces dernières années. Je me demandais comment il était possible de produire un tel son sans se vriller les cordes vocales, et regrettais fort avoir la voix bien trop grave pour atteindre des notes aussi élevées. J’aurais tellement voulu apprendre, moi aussi, à appeler les vaches – malgré la crainte d’être une <em><a href="https://www.hypothermia.fr/2015/09/copy-of-a/">Copy of A</a></em> ou de risquer l’appropriation culturelle, l’envie était si forte. Même si nombre de mes noyaux centraux sont des pièces rapportées, j’apprends encore à reconnaître cette dernière comme un guide, comme l’a si bien exprimé <a href="http://www.alexandrafranzen.com/2014/09/07/who-is-living-your-dream/">Alexandra Franzen dans un article auquel je reviens souvent</a> :</p><blockquote><p>Jealousy can be a teacher if you lean in… close.<br/> And if you’re willing to feel it, explore it and hunt for the patterns.<br/> The root of the word “jealousy” is actually an Old French word, jalousie, meaning “enthusiasm, love, longing”.</p></blockquote><p>Lors d’une de mes dernières recherches à ce sujet et parce qu’Internet est un univers merveilleux, je suis miraculeusement tombée sur <a href="https://www.youtube.com/channel/UCAdhKYgLWean3hG29-7uy2A">la chaîne Youtube de Maria Misgeld</a>, professeur de chant qui a publié de nombreuses petites vidéos tutorielles sur l’apprentissage du kulning. Il ne m’en a pas fallu plus pour franchir le pas. Dès le lendemain, je me suis mise à la tâche : chaque trajet quotidien en voiture était rempli de ses enregistrements et de mes vocalises.</p><p>Je me suis cassé la voix dès le premier jour, voulant bien évidemment brûler les étapes pour arriver au plus vite au résultat tant espéré. Sans échauffement ni conditionnement, le son s’est coincé dans ma gorge et mes cordes vocales ont cédé sous trop de pression. Il m’a fallu quelques jours pour me rétablir, puis quelques uns pour comprendre comment positionner exactement ma langue et mon palais. Quelques autres encore pour réussir à faire naviguer le son dans ma cavité buccale, et quelques uns enfin pour réussir à le moduler sans trop trébucher. Je suis encore en train d’apprendre à quel point je ne peux protéger ma voix qu’en m’y abandonnant pleinement, sans chercher à trop la contrôler ou la retenir.</p><p>Dans un espace aussi confiné que ma voiture, je n’arrivais absolument pas à savoir si j’étais sur la bonne voi[e|x]. J’arrivais certes de plus en plus aisément à atteindre les notes que je souhaitais, mais j’avais plutôt l’impression de sonner comme une chèvre au bord de l’agonie. Il faut dire que le son si spécifique au kulning est très désagréable de près, à la limite de l’insupportable tant il est fort et frontal. De face il n’y a aucune douceur, aucune harmonie, simplement le cri. Son intérêt réside dans l’écho renvoyé par la distance, qui en révèle de multiples dimensions.</p><p>Alors j’ai roulé jusqu’à un coin de montagne isolé, j’ai enfilé mes raquettes toutes neuves, j’ai grimpé jusqu’à avoir une jolie vue, j’ai planté mon trépied dans la neige, j’ai déclenché l’enregistrement, et je me suis lancée du plus fort que me permettaient mon inhibition naturelle et mon petit registre débutant.<br/></p><p>Le kulning n’a pas de paroles articulées ni de partition imposée. J’y retrouve <a href="https://www.hypothermia.fr/2015/07/3-2-1-improvisez/">le plaisir d’improviser</a> selon l’humeur du jour, l’audace du moment, le retour de l’écho. Maria Misgeld indiquait que c’est un chant profondément personnel et thérapeutique ; pas deux chanteurs n’auront le même style, et chaque chant unique sera un cliché instantané des états d’âme du <em>lokk</em>, comme on appelle ceux qui le pratiquent. <em>Cracher nos démons</em>, qu’il disait.</p><p>Je n’ai pas attiré plus de vaches lors de mon second essai, malgré ma recherche d’un endroit où la résonance serait encore plus amplifiée. J’ai par contre reçu en net écho depuis la vallée un <em>« Ferme ta gueuuuuule ! »</em> bien placé… Qui n’a pas réussi à effacer mon sourire. Les bases sont là : je pourrai les développer en voiture, ou dès que je trouverai de vastes étendues sans âme qui vive ni risque d’avalanche pour pratiquer en toute tranquillité. Ce qui ajoute un argument de taille à mes dernières envies de voyages, qu’il m’est grand temps de penser à concrétiser.</p></p>
  450. </article>
  451. </section>
  452. <nav id="jumpto">
  453. <p>
  454. <a href="/david/blog/">Accueil du blog</a> |
  455. <a href="https://www.hypothermia.fr/2019/01/longing-for-a-calling/">Source originale</a> |
  456. <a href="/david/stream/2019/">Accueil du flux</a>
  457. </p>
  458. </nav>
  459. <footer>
  460. <div>
  461. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  462. <p>
  463. Bonjour/Hi!
  464. Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
  465. Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
  466. </p>
  467. <p>
  468. Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
  469. </p>
  470. <p>
  471. Voici quelques articles choisis :
  472. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  473. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  474. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  475. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  476. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  477. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  478. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  479. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  480. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  481. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  482. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  483. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  484. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  485. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  486. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  487. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  488. </p>
  489. <p>
  490. On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
  491. </p>
  492. <p>
  493. Je ne traque pas ta navigation mais mon
  494. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  495. conserve des logs d’accès.
  496. </p>
  497. </div>
  498. </footer>
  499. <script type="text/javascript">
  500. ;(_ => {
  501. const jumper = document.getElementById('jumper')
  502. jumper.addEventListener('click', e => {
  503. e.preventDefault()
  504. const anchor = e.target.getAttribute('href')
  505. const targetEl = document.getElementById(anchor.substring(1))
  506. targetEl.scrollIntoView({behavior: 'smooth'})
  507. })
  508. })()
  509. </script>