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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600
  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>Pics and It Didn’t Happen (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://thenewinquiry.com/pics-and-it-didnt-happen/">
  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. Pics and It Didn’t Happen (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://thenewinquiry.com/pics-and-it-didnt-happen/">Source originale du contenu</a></h3>
  445. <p><strong>The tension between experience for its own sake and experience we pursue just to put on Facebook is reaching its breaking point. That breaking point is called Snapchat.</strong></p>
  446. <blockquote><p><em>It is a nostalgic time right now, and photographs actively promote nostalgia. Photography is an elegiac art, a twilight art. Most subjects photographed are, just by virtue of being photographed, touched with pathos. An ugly or grotesque subject may be moving because it has been dignified by the attention of the photographer. A beautiful subject can be the object of rueful feelings, because it has aged or decayed or no longer exists. All photographs are momento mori. To take a photograph is to participate in another person’s (or thing’s) mortality, vulnerability, mutability. Precisely by slicing out this moment and freezing it, all photographs testify to time’s relentless melt.<br/>
  447. —Susan Sontag, from</em> On Photography<em> (1973)<br/>
  448. </em></p></blockquote>
  449. <p>A photograph is made of time as much as it is of light — a frozen shutter-speed-size gap of the present captured within a photo border. Despite this, photographs have always been a way to cheat death, or at least to declare the illusion of immortality through lasting visual evidence. There’s always the possibility that the next photo you take will one day be lovingly removed from a box by some unborn great-grandchild; the Polaroid developing in your hands might come to be pinned to someone’s bedpost in posterity. To update that to more contemporary terms, your selfie on Instagram might be a signpost for the future you of what it was like to be this young.<span id="more-34481"/></p>
  450. <p>On Snapchat, images have no such future. Fittingly, its logo is a ghost.</p>
  451. <p>By refuting the assumption of the permanence of the image, Snapchat is a radical departure. It inaugurates <em>temporary photography,</em> in which photos are seen once by their chosen audience and then are gone in 10 seconds or less.
  452. </p>
  453. <p class="margin-right"> Snapchat recipients can take a screenshot, though the app discourages this by notifying the sender</p>
  454. <p>
  455. Millions of people have done this a billion times with the Snapchat app (to say nothing of Facebook’s copycat, Poke).
  456. </p>
  457. <p>The temporary photograph’s abbreviated lifespan changes how it is made and seen, and what it comes to mean. Snaps could be likened to other temporary art such as ice sculptures or decay art (e.g., Yoko Ono’s famous rotting apple) that takes seriously the process of disappearance, or the <a href="http://onehourphotoproject.com/index.php">One Hour Photo</a> project from 2010 that has as its premise to “project a photograph for one hour, then ensure that it will never be seen again.”
  458. </p>
  459. <p>
  460. However, whatever changes in the aesthetics of photographic vision Snapchat is effecting are difficult to assess, given that no one really knows what its self-deleting photos collectively look like. In many ways, this is exactly the point.
  461. </p>
  462. <p>To understand the emergence of temporary photography, one must understand it in relation to the inflating archive of persistent images and their significance on how we perceive and remember the world.</p>
  463. <p>The logic of the camera is that reality is real only to the extent that it is photographable. It pulls individuals out of the moment and makes them see it (and themselves) as an object for the future as well as always already of the past. This seizing of experience’s ephemerality — to possess the present, docile and durable — is what Andreas Kitzmann <a href="http://books.google.com/books?id=dakobh2OBRoC&amp;pg=PA141&amp;lpg=PA141&amp;dq=kitzmann+%E2%80%9Cmuseal+gesture%E2%80%9D&amp;source=bl&amp;ots=AcC8NY_6T5&amp;sig=roE4DuLHdJc3q8CZLymWGrtI2qg&amp;hl=en&amp;sa=X&amp;ei=YiQMUbOXBobp0gG-y4DICA&amp;ved=0CDAQ6AEwAA#v=onepage&amp;q=kitzmann%20%E2%80%9Cmuse">called</a> a “museal gesture,” what Jean Baudrillard <a href="http://books.google.com/books?id=9Z9biHaoLZIC&amp;pg=PA10&amp;dq=baudrillard+museumification&amp;hl=en&amp;sa=X&amp;ei=eCERUb7dLqHm0gGZxID4BA&amp;ved=0CDUQ6AEwAQ#v=onepage&amp;q=baudrillard%20museumification&amp;f=false">called</a> “museumification,” and what André Bazin <a href="http://www.jstor.org/discover/10.2307/1210183?uid=20645&amp;uid=3739584&amp;uid=2129&amp;uid=2&amp;uid=70&amp;uid=3&amp;uid=67&amp;uid=20644&amp;uid=62&amp;uid=3739256&amp;sid=21101637427461">called</a> the “mummy complex,” the “need to have the last word in the argument with death by means of the form that endures.” It’s ownership of the present by proxy.</p>
  464. <p>As Susan Sontag wrote in <em>On Photography</em><em>,</em></p>
  465. <blockquote><p>there is something predatory in the act of taking a picture. To photograph people is to violate them, by seeing them as they never see themselves, by having knowledge of them they can never have; it turns people into objects that can be symbolically possessed.</p></blockquote>
  466. <p>Sontag notes that this makes for a nostalgic gaze, an understanding of the world as primarily documentable. For those who live with status updates, check-ins, likes, retweets, and ubiquitous photography, such an understanding is near inescapable. Social media have invited users to adopt a sort of documentary vision, through which the present is always apprehended as a potential past. This is most triumphantly exemplified by Instagram’s faux-vintage filters.</p>
  467. <p>There’s always tension between experience-for-itself and experience-for-documentation, but social media have brought that strain to its breaking point. Temporary photography is in part a response to social-media users’ feeling saddled with the distraction of documentary vision. It rejects the burden of creating durable proof that you are here and you did that. And because temporary photographs are not made to be collected or archived, they are elusive, resisting other museal gestures of systemization and taxonomization, the modern impulse to classify life according to rubrics. By leaving the present where you found it, temporary photographs feel more like life and less like its collection.</p>
  468. <p>The photograph, for all its promised immortality, always hinted at death. This was central to Roland Barthes’s analysis in <em>Camera Lucida</em>, that the enduring image “produces Death while trying to preserve life.” Documenting the present as a future past, as conventional photographs do, asserts the facts of change, impermanence, and mortality. The temporary photograph does the opposite: It interrupts the traditional photographic fixation of the present as impending history by positing a present moment that’s not concerned with the past or the future. As such, the temporary photograph is necessarily less sentimental and nostalgic. By being quick, the temporary photograph is a tiny protest against time.</p>
  469. <p align="center">***</p>
  470. <p align="center"><a href="http://thenewinquiry.com/app/uploads/2013/02/www.flickr.com_photos_nompourflickr_3388457464_in_set-72157626122411854_.jpg"><img class="size-full wp-image-34514" title="www.flickr.com_photos_nompourflickr_3388457464_in_set-72157626122411854_" src="http://thenewinquiry.com/app/uploads/2013/02/www.flickr.com_photos_nompourflickr_3388457464_in_set-72157626122411854_.jpg" alt=""/></a>
  471. </p>
  472. <p align="center">Let’s face it, much of photography was already becoming Snapchat even before Snapchat existed. While much is justifiably, if hyperbolically
  473. </p>
  474. <p>
  475. , made of “the death of privacy” in the age of information immortality, the likely fate of the vast majority of images today is to be briefly consumed and quickly forgotten. As well as offering relief from deepening documentary vision, the temporary photograph also responds to this photographic abundance, which has deflated the value of images. As making more and more photos becomes easier, each individual shot means less and less. Snapchat is an attempt at re-inflation.
  476. </p>
  477. <p>In their scarcity, photographs can age like wine, with grace and importance. In their abundance, photos can sometimes curdle, spoil, and rot. But from the beginning, technological innovation in photography has driven toward creating visual abundance. Daguerre is widely credited as inventing photography, in 1839, in part because earlier mechanical image-capturing techniques — most famously Niepce’s so-called heliography — did not create as many images as quickly and reliably. In subsequent decades, major advances shortened exposure times and made images even more easily reproducible, chiefly through replacing photographic plates with paper. Photography democratized dramatically with the introduction of Kodak’s small, cheap, and easy-to-use personal cameras at the turn of the 20th century. The ads proclaimed, “You press the button, we do the rest.” And then there is the rise of digital photography and smartphone cameras that make taking, duplicating, and viewing photos something many people do almost anytime and anywhere.</p>
  478. <p>As photographic technology expanded photography’s user base, the photograph went from a rare prized possession to common keepsake to a nuisance that clutters our visual memories. <a href="http://thefrailestthing.com/2013/01/25/from-memory-scarcity-to-memory-abundance/">Writing</a> of this visual oversaturation, Michael Sacasas worries that</p>
  479. <blockquote><p>digital photography and sites like Facebook have brought us to an age of memory abundance. The paradoxical consequence of this development will be the progressive devaluing of such memories and severing of the past’s hold on the present. Gigabytes and terabytes of digital memories will not make us care more about those memories, they will make us care less.</p></blockquote>
  480. <p>By simulating the aesthetic of photographic scarcity, Instagram works as a response to (or overcompensation for) this fear — the enchanting landscape, disarming portrait, the bold statements and delicate textures look like moments captured from the past for posterity. These are the visual cues of photography pre-digital-devaluation, right down to the warm colors, faded glow, and false paper scratches and borders. Instagram’s faux-vintage filters, <a href="http://thesocietypages.org/cyborgology/2011/05/14/the-faux-vintage-photo-full-essay-parts-i-ii-and-iii/">as I argued previously</a>, reassure that present lives are just as authentic and worthy of nostalgia as the life captured in the seemingly scarce images from the analog past. <em>Photographs are becoming too easy, so, dammit, here’s my life framed like it’s 1942</em>.</p>
  481. <p>But having an Instagram account is like having an abundance of money in a dead currency. So much nostalgia and meaning have been shoveled at us that the aesthetic has lost much of its ability to affect. Merely making your photos evocative of photo scarcity doesn’t make them actually scarce or make others covet them. There’s a deep mismatch between the aesthetic language of Instagram and the affordances of the network. Despite all the manufactured nostalgia, your photo disappears down the stream, largely unnoticed.</p>
  482. <p>So whereas Instagram merely evokes the look of scarcity, temporary photography by definition enforces a certain rarity that imbues the image with a heightened aura of meaningfulness. Snapchat inspires memory because it welcomes the possibility of forgetting. Instead of being shared with a large number of people on a popular website, temporary photographs are taken specifically for and shared with one other person or a small group of people. The meaning of the photo doesn’t rest just in its content but in the choice to restrict its consumption — the choice to send that particular image to that particular person at that particular time, to the exclusion of other images, other recipients, and other times.</p>
  483. <p>The ephemerality sharpens viewers’ focus: Once received, a Snapchat count-down is a kind of time-bomb that demands an urgency of vision, a challenge to exhaust the meaning from the image before the clock runs out. Unlike a paper photo that fades slowly over the years, the temporary photo disappears suddenly. Given only a peek, you look hard.</p>
  484. <p>The temporary photo will wrongly be called <a href="http://www.peasantmuse.com/2013/02/ephemerality-is-snap.html">frivolous</a> or trivial — after all, only unimportant images could be so easily parted with. But as we have seen, there is meaning in witnessing ephemerality itself, an appreciation of impermanence for its own sake. By carving a space away from the growing necessity to record and collect life into database museums, temporary photography encourages an appreciation of the importance of experiencing the present for its own sake.</p>
  485. <p>We might be witnessing an extraordinarily rare, even if minor, countertrend to photography’s increasing abundance — a sort of photographic population control. In this way, the rise of self-deleting photographs might be as much about reinstating the importance of nontemporary photos as it is the enactment of photographic disposability.</p>
  486. <p>If everyday photography becomes temporary photography — if more people switch to apps like Snapchat and Poke — photos saved to more permanent locations like Facebook will become correspondingly more scarce and perhaps seem more important. Photographs taken and shared as temporary will impart more meaning to those chosen to be permanent. In the age of digital abundance, photography desperately needs this introduction of intentional and assured mortality, so that some photos can become immortal again.</p>
  487. </article>
  488. </section>
  489. <nav id="jumpto">
  490. <p>
  491. <a href="/david/blog/">Accueil du blog</a> |
  492. <a href="https://thenewinquiry.com/pics-and-it-didnt-happen/">Source originale</a> |
  493. <a href="/david/stream/2019/">Accueil du flux</a>
  494. </p>
  495. </nav>
  496. <footer>
  497. <div>
  498. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  499. <p>
  500. Bonjour/Hi!
  501. 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>
  502. 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>).
  503. </p>
  504. <p>
  505. 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>.
  506. </p>
  507. <p>
  508. Voici quelques articles choisis :
  509. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  510. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  511. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  512. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  513. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  514. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  515. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  516. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  517. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  518. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  519. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  520. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  521. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  522. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  523. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  524. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  525. </p>
  526. <p>
  527. 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>.
  528. </p>
  529. <p>
  530. Je ne traque pas ta navigation mais mon
  531. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  532. conserve des logs d’accès.
  533. </p>
  534. </div>
  535. </footer>
  536. <script type="text/javascript">
  537. ;(_ => {
  538. const jumper = document.getElementById('jumper')
  539. jumper.addEventListener('click', e => {
  540. e.preventDefault()
  541. const anchor = e.target.getAttribute('href')
  542. const targetEl = document.getElementById(anchor.substring(1))
  543. targetEl.scrollIntoView({behavior: 'smooth'})
  544. })
  545. })()
  546. </script>