davidbgk
/
larlet-fr-david-cache
Watch 1
Star 0
Fork 0
Code Releases 0 Activity
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.
42 Commits
1 Branch
Tree: 2e4d51a7b7
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '2e4d51a7b7'
${ noResults }
larlet-fr-david-cache/cache/bd1d17b438ed65b58eb9ddc7268.../index.html

index.html 75KB
Raw Blame History

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379 
  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>Trente ans d’innovations, de scandales et de mèmes : une chronologie du Web (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. 

  28.   <meta name="robots" content="noindex, nofollow">

  29.   <meta content="origin-when-cross-origin" name="referrer">

  30.   <!-- Canonical URL for SEO purposes -->

  31.   <link rel="canonical" href="https://www.lemonde.fr/pixels/visuel/2019/03/13/trente-ans-d-innovations-de-scandales-et-de-memes-une-chronologie-du-web_5435444_4408996.html#date-2004">

  32. 

  33. <style>

  34. /* http://meyerweb.com/eric/tools/css/reset/ */

  35. html, body, div, span,

  36. h1, h2, h3, h4, h5, h6, p, blockquote, pre,

  37. a, abbr, address, big, cite, code,

  38. del, dfn, em, img, ins,

  39. small, strike, strong, tt, var,

  40. dl, dt, dd, ol, ul, li,

  41. fieldset, form, label, legend,

  42. table, caption, tbody, tfoot, thead, tr, th, td,

  43. article, aside, canvas, details, embed,

  44. figure, figcaption, footer, header, hgroup,

  45. menu, nav, output, ruby, section, summary,

  46. time, mark, audio, video {

  47.   margin: 0;

  48.   padding: 0;

  49.   border: 0;

  50.   font-size: 100%;

  51.   font: inherit;

  52.   vertical-align: baseline;

  53. }

  54. /* HTML5 display-role reset for older browsers */

  55. article, aside, details, figcaption, figure,

  56. footer, header, hgroup, menu, nav, section { display: block; }

  57. body { line-height: 1; }

  58. blockquote, q { quotes: none; }

  59. blockquote:before, blockquote:after,

  60. q:before, q:after {

  61.   content: '';

  62.   content: none;

  63. }

  64. table {

  65.   border-collapse: collapse;

  66.   border-spacing: 0;

  67. }

  68. 

  69. /* http://practicaltypography.com/equity.html */

  70. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */

  71. /* https://www.filamentgroup.com/lab/js-web-fonts.html */

  72. @font-face {

  73.   font-family: 'EquityTextB';

  74.   src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),

  75.        url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');

  76.   font-weight: 300;

  77.   font-style: normal;

  78.   font-display: swap;

  79. }

  80. @font-face {

  81.   font-family: 'EquityTextB';

  82.   src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),

  83.        url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');

  84.   font-weight: 300;

  85.   font-style: italic;

  86.   font-display: swap;

  87. }

  88. @font-face {

  89.   font-family: 'EquityTextB';

  90.   src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),

  91.        url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');

  92.   font-weight: 700;

  93.   font-style: normal;

  94.   font-display: swap;

  95. }

  96. 

  97. @font-face {

  98.   font-family: 'ConcourseT3';

  99.   src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),

  100.        url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');

  101.   font-weight: 300;

  102.   font-style: normal;

  103.   font-display: swap;

  104. }

  105. 

  106. 

  107. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */

  108. body {

  109.   /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */

  110.   font-family: "EquityTextB", Palatino, serif;

  111.   background-color: #f0f0ea;

  112.   color: #07486c;

  113.   font-kerning: normal;

  114.   -moz-osx-font-smoothing: grayscale;

  115.   -webkit-font-smoothing: subpixel-antialiased;

  116.   text-rendering: optimizeLegibility;

  117.   font-variant-ligatures: common-ligatures contextual;

  118.   font-feature-settings: "kern", "liga", "clig", "calt";

  119. }

  120. pre, code, kbd, samp, var, tt {

  121.   font-family: 'TriplicateT4c', monospace;

  122. }

  123. em {

  124.   font-style: italic;

  125.   color: #323a45;

  126. }

  127. strong {

  128.   font-weight: bold;

  129.   color: black;

  130. }

  131. nav {

  132.   background-color: #323a45;

  133.   color: #f0f0ea;

  134.   display: flex;

  135.   justify-content: space-around;

  136.   padding: 1rem .5rem;

  137. }

  138.   nav:last-child {

  139.     border-bottom: 1vh solid #2d7474;

  140.   }

  141.   nav a {

  142.     color: #f0f0ea;

  143.   }

  144.   nav abbr {

  145.     border-bottom: 1px dotted white;

  146.   }

  147. 

  148. h1 {

  149.   border-top: 1vh solid #2d7474;

  150.   border-bottom: .2vh dotted #2d7474;

  151.   background-color: #e3e1e1;

  152.   color: #323a45;

  153.   text-align: center;

  154.   padding: 5rem 0 4rem 0;

  155.   width: 100%;

  156.   font-family: 'ConcourseT3';

  157.   display: flex;

  158.   flex-direction: column;

  159. }

  160.   h1.single {

  161.     padding-bottom: 10rem;

  162.   }

  163.   h1 span {

  164.     position: absolute;

  165.     top: 1vh;

  166.     left: 20%;

  167.     line-height: 0;

  168.   }

  169.     h1 span a {

  170.       line-height: 1.7;

  171.       padding: 1rem 1.2rem .6rem 1.2rem;

  172.       border-radius: 0 0 6% 6%;

  173.       background: #2d7474;

  174.       font-size: 1.3rem;

  175.       color: white;

  176.       text-decoration: none;

  177.     }

  178. h2 {

  179.   margin: 4rem 0 1rem;

  180.   border-top: .2vh solid #2d7474;

  181.   padding-top: 1vh;

  182. }

  183. h3 {

  184.   text-align: center;

  185.   margin: 3rem 0 .75em;

  186. }

  187. hr {

  188.   height: .4rem;

  189.   width: .4rem;

  190.   border-radius: .4rem;

  191.   background: #07486c;

  192.   margin: 2.5rem auto;

  193. }

  194. time {

  195.   display: bloc;

  196.   margin-left: 0 !important;

  197. }

  198. ul, ol {

  199.   margin: 2rem;

  200. }

  201. ul {

  202.   list-style-type: square;

  203. }

  204. a {

  205.   text-decoration-skip-ink: auto;

  206.   text-decoration-thickness: 0.05em;

  207.   text-underline-offset: 0.09em;

  208. }

  209. article {

  210.   max-width: 50rem;

  211.   display: flex;

  212.   flex-direction: column;

  213.   margin: 2rem auto;

  214. }

  215.   article.single {

  216.     border-top: .2vh dotted #2d7474;

  217.     margin: -6rem auto 1rem auto;

  218.     background: #f0f0ea;

  219.     padding: 2rem;

  220.   }

  221.   article p:last-child {

  222.     margin-bottom: 1rem;

  223.   }

  224. p {

  225.   padding: 0 .5rem;

  226.   margin-left: 3rem;

  227. }

  228.   p + p,

  229.   figure + p {

  230.     margin-top: 2rem;

  231.   }

  232. 

  233. blockquote {

  234.   background-color: #e3e1e1;

  235.   border-left: .5vw solid #2d7474;

  236.   display: flex;

  237.   flex-direction: column;

  238.   align-items: center;

  239.   padding: 1rem;

  240.   margin: 1.5rem;

  241. }

  242.   blockquote cite {

  243.     font-style: italic;

  244.   }

  245.   blockquote p {

  246.     margin-left: 0;

  247.   }

  248. 

  249. figure {

  250.   border-top: .2vh solid #2d7474;

  251.   background-color: #e3e1e1;

  252.   text-align: center;

  253.   padding: 1.5rem 0;

  254.   margin: 1rem 0 0;

  255.   font-size: 1.5rem;

  256.   width: 100%;

  257. }

  258.   figure img {

  259.     max-width: 250px;

  260.     max-height: 250px;

  261.     border: .5vw solid #323a45;

  262.     padding: 1px;

  263.   }

  264. figcaption {

  265.   padding: 1rem;

  266.   line-height: 1.4;

  267. }

  268. aside {

  269.   display: flex;

  270.   flex-direction: column;

  271.   background-color: #e3e1e1;

  272.   padding: 1rem 0;

  273.   border-bottom: .2vh solid #07486c;

  274. }

  275.   aside p {

  276.     max-width: 50rem;

  277.     margin: 0 auto;

  278.   }

  279. 

  280. /* https://fvsch.com/code/css-locks/ */

  281. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  282.   font-size: 1rem;

  283.   line-height: calc( 1.5em + 0.2 * 1rem );

  284. }

  285. h1 {

  286.   font-size: 1.9rem;

  287.   line-height: calc( 1.2em + 0.2 * 1rem );

  288. }

  289. h2 {

  290.   font-size: 1.6rem;

  291.   line-height: calc( 1.3em + 0.2 * 1rem );

  292. }

  293. h3 {

  294.   font-size: 1.35rem;

  295.   line-height: calc( 1.4em + 0.2 * 1rem );

  296. }

  297. @media (min-width: 20em) {

  298.   /* The (100vw - 20rem) / (50 - 20) part

  299.      resolves to 0-1rem, depending on the

  300.      viewport width (between 20em and 50em). */

  301.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  302.     font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );

  303.     line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );

  304.     margin-left: 0;

  305.   }

  306.   h1 {

  307.     font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  308.     line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );

  309.   }

  310.   h2 {

  311.     font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  312.     line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );

  313.   }

  314.   h3 {

  315.     font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );

  316.     line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );

  317.   }

  318. }

  319. @media (min-width: 50em) {

  320.   /* The right part of the addition *must* be a

  321.      rem value. In this example we *could* change

  322.      the whole declaration to font-size:2.5rem,

  323.      but if our baseline value was not expressed

  324.      in rem we would have to use calc. */

  325.   p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {

  326.     font-size: calc( 1rem + .6 * 1rem );

  327.     line-height: 1.5em;

  328.   }

  329.   p, li, pre, details {

  330.     margin-left: 3rem;

  331.   }

  332.   h1 {

  333.     font-size: calc( 1.9rem + 1.5 * 1rem );

  334.     line-height: 1.2em;

  335.   }

  336.   h2 {

  337.     font-size: calc( 1.5rem + 1.5 * 1rem );

  338.     line-height: 1.3em;

  339.   }

  340.   h3 {

  341.     font-size: calc( 1.35rem + 1.5 * 1rem );

  342.     line-height: 1.4em;

  343.   }

  344.   figure img {

  345.     max-width: 500px;

  346.     max-height: 500px;

  347.   }

  348. }

  349. 

  350. figure.unsquared {

  351.   margin-bottom: 1.5rem;

  352. }

  353.   figure.unsquared img {

  354.     height: inherit;

  355.   }

  356. 

  357. 

  358. 

  359. @media print {

  360.   body { font-size: 100%; }

  361.   a:after { content: " (" attr(href) ")"; }

  362.   a, a:link, a:visited, a:after {

  363.     text-decoration: underline;

  364.     text-shadow: none !important;

  365.     background-image: none !important;

  366.     background: white;

  367.     color: black;

  368.   }

  369.   abbr[title] { border-bottom: 0; }

  370.   abbr[title]:after { content: " (" attr(title) ")"; }

  371.   img { page-break-inside: avoid; }

  372.   @page { margin: 2cm .5cm; }

  373.   h1, h2, h3 { page-break-after: avoid; }

  374.   p3 { orphans: 3; widows: 3; }

  375.   img {

  376.     max-width: 250px !important;

  377.     max-height: 250px !important;

  378.   }

  379.   nav, aside { display: none; }

  380. }

  381. 

  382. ul.with_columns {

  383.   column-count: 1;

  384. }

  385. @media (min-width: 20em) {

  386.   ul.with_columns {

  387.     column-count: 2;

  388.   }

  389. }

  390. @media (min-width: 50em) {

  391.   ul.with_columns {

  392.     column-count: 3;

  393.   }

  394. }

  395. ul.with_two_columns {

  396.   column-count: 1;

  397. }

  398. @media (min-width: 20em) {

  399.   ul.with_two_columns {

  400.     column-count: 1;

  401.   }

  402. }

  403. @media (min-width: 50em) {

  404.   ul.with_two_columns {

  405.     column-count: 2;

  406.   }

  407. }

  408. 

  409. .gallery {

  410.   display: flex;

  411.   flex-wrap: wrap;

  412.   justify-content: space-around;

  413. }

  414.   .gallery figure img {

  415.     margin-left: 1rem;

  416.     margin-right: 1rem;

  417.   }

  418.   .gallery figure figcaption {

  419.     font-family: 'ConcourseT3'

  420.   }

  421. 

  422. footer {

  423.   font-family: 'ConcourseT3';

  424.   display: flex;

  425.   flex-direction: column;

  426.   border-top: 3px solid white;

  427.   padding: 4rem 0;

  428.   background-color: #07486c;

  429.   color: white;

  430. }

  431.   footer > * {

  432.     max-width: 50rem;

  433.     margin: 0 auto;

  434.   }

  435.   footer a {

  436.     color: #f1c40f;

  437.   }

  438.   footer .avatar {

  439.     width: 200px;

  440.     height: 200px;

  441.     border-radius: 50%;

  442.     float: left;

  443.     -webkit-shape-outside: circle();

  444.     shape-outside: circle();

  445.     margin-right: 2rem;

  446.     padding: 2px 5px 5px 2px;

  447.     background: white;

  448.     border-left: 1px solid #f1c40f;

  449.     border-top: 1px solid #f1c40f;

  450.     border-right: 5px solid #f1c40f;

  451.     border-bottom: 5px solid #f1c40f;

  452.   }

  453. </style>

  454. 

  455. <h1>

  456.   <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>

  457.   Trente ans d’innovations, de scandales et de mèmes : une chronologie du Web (archive)

  458.   <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>

  459. </h1>

  460. <section>

  461.   <article>

  462.     <h3><a href="https://www.lemonde.fr/pixels/visuel/2019/03/13/trente-ans-d-innovations-de-scandales-et-de-memes-une-chronologie-du-web_5435444_4408996.html#date-2004">Source originale du contenu</a></h3>

  463.     <section class="date-1989"><div class="intro">

  464.     <h1>Trente ans d’innovations, de scandales et de mèmes : une chronologie du Web</h1>

  465.     <h2>1989-2019</h2>

  466.     <p>

  467.         Le 12 mars 1989, le scientifique Tim Berners-Lee présentait un projet qui allait changer le monde. Drôles ou politiques, techniques ou symboliques : 30 ans plus tard, retour sur les grandes étapes de cette révolution.

  468.     </p>

  469. </div>

  470. 

  471. <div class="article">

  472.     <div class="image">

  473.         <img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/tim.png" alt=""><!-- <pre>hhhdhhhdhddddddmmddddhyhhdmmmmmmy+++++++++++++++++++++o+++++oosoooossssssssssssyyysssssssooo+++o/yNNNmdhdmNNNNNNNNNmmddd

  474. hdddddddddhdddmmmmmmdddmdmmmmmmmhso+++o+o++ooooooooooooooosoyhyoyyyhysssssssssyyhhyyysssssoo+ooo/hNNNNNNNNmNNNNNNNNmmddd

  475. dmmmdddddddhddmmmmmmdddmmmNmmmNmhsoooooooooooooossssosssyhhyhhhyhhyyyyssoossssyyhmhhyyssssssysssohmNNNNNNNNMNNNNNMNNNmdd

  476. mmmmmmmmmmmdddmmmmmmmmmmNNNNNNNNdsssssssssssssssssssyyyyyhmhhhhhhhdyyyysoso+//+osyddhssyyoydNNNmmNNMMNNNNNMMNNNNMMMMMMNN

  477. mmmmmNNNmmmmmmmmdddddmmNNNNNNNNNdyyyyyyyyyyyyyyyyyyyyydddhhhhhyssyyhhs+///-.``...:/oy/yyoyhdNNNNNNMMMMNNNNNNNNNNNNMMMMMM

  478. mmmmmNNNmmmmmmmmmmmmmNNNmNNNNNNNmyhhhhyhhyhhhhhhhhhhhhhdhhyhysoso/+/:::::-...`.....`.-:y-ysdmNNNNNMMMMMMMMMNNNNNNNMMMMMM

  479. NmmNmmNNmNmmmmmmmmmmNNNNNNNNNMMNmhhdddhdhddddddddddddhhhyysoso/----.--..-+syhyyso+-`.`.-.:-:+hmNNNNNNMNMMMMNNNMMMMMMMMMM

  480. NNNNNmNNNNNNNNNNNNNNNNNNNNNNNNNNmdddddddddddddddddddddhhyo++/::---://-/+hmNmmmmmmdh:.:://:--.-++//+sydNNMMMMMMMMMMMMMMMM

  481. MMMNNNNNNNNNNNNNNNNNNNNNNNNNNNNNmddmdddddddmdmmmddddmhso+///////:://osdmNNNNNmmmmmmd-.--:/:/+/:..---:/+smMMMMMMMMMMMMMMM

  482. MMMMNNNNNMMNNNNNNNNNNNNNMNNMMMMMmdmmmmmmddmmmmmmmmdmmdo/--:/+++//+oymNMMMMNNNNNmmmmdh:.-:::::::/+/---/oymMMMMMMMMMMMNNNN

  483. MMMMMMMMMMMMMMNNNNNNNNNMMMMMMMMMmdmmmmmmddmmmmmmmmmmms----/+oo+oydmNNMMMMMMNNNNmmmmddy-`.---..-:::---:oyhMMMMMMNmhyyyyyy

  484. MMMMMMMMMNNMMMNNNMNNNMMMMMMMMMMNmmmmmmmmddmmmmmmmmmms.  `/ossyhdmNNNMMMMMMMNNNNmmddddho-.-`````..-:..-/ydMMMMMNy+++ooooo

  485. MNNMMMMMMNNNNNNNNMMMMMMMMMMMMMMNmmmmmmmmddmmmmmddddh.`  /syddmNNNNNNNMMMMMMNNNNmddddhhs+-```````.--```.:sNNMMNy:/ooooooo

  486. MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNmmmmmmmdddmmmmdmddds`  .yydmmNNNNNNNNNNNNNNNNNmmdhhhhys+-``   ` ````..`.+o+oo+--/+ooosos

  487. MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMmdmmmmddddddmmdddddds   ohhdmmNNNNNNNNNNMNNNNNmmmhhhhyys+-`       `  `.``+o+/:----+ooooss

  488. MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMmmmddddddddddddddddm+   syhddmNNNNNNNNNNMMNNNmmmdhhhhyyso/`       `  ``.-+o++/:---+ooooos

  489. NNNNNNNNNNNNNNNNNNNNNNNNNMMMMMNdmmddddddddddddddmdmo`  yhddmmNNNNNNNNNNNNNmNmmmddhyyyysso/`      .``.``.++/://---/oo+oss

  490. ++++++++++++++++++++++++yNMMMMMddddddddddddddddddddho` shddmmNNNNNNNmmdddhhhhdddddhyyyysso.      .-::: `--:-:/---/oo+oos

  491. ``````````````````::-:  mNMMMMMddddddddddddddddddddddo.syyhhdddmmmddhs/:-----://+ossyyssso:     `.:+++  .---:/:..:+o+ooo

  492. ----.............-h::s` dNMMMMMddddddddddddddddddddddhso+::::/oyyyss+:-..``````..-:+osssss/`   .`./oys. -::::/:..-/+++oo

  493. ----..-.......-...h//y` dNMMMMMddddddddddddddddhhdddhyy+/-.` ``-/shy+:...`-o/..+++++ssyyyyo/..---:-oyy``/++++/:-.-/+++oo

  494. /://+/-------:o...hdhm- hNMMMMMddddddddhhhdhhhhhhhhhhyy+/.:+````.hmNdysso++syyyyhhhhhyyhhysso+++-//sss`.//+++//-..:++++o

  495. ddhddmNNNNNNNNN-..yddd- ymMMMMMmhddddddhhhhhhhhhhhhhyyyy/+ss+++++dNNmdddmdddhhdddddhhyyhyyoo+ooo/shos-.////++//:-.:++++o

  496. NNNNNNNNNNNNNNM:..yddd/ smMMMMMdhhdddhhhhhhhhhhhhhyyysyysssssyhyymNmddddmNNNNNNNmmddhhyyyooooo+ossyy-`:+////+//:---/++++

  497. MMMNMMMMMMMMMMM+..sNmm/ omMMMMMmhhdhhhhhhhhhhhhhhyyyyyssoyhddddhhNMmdhhdmddmNNNNmdddhhyysossss/osy/.-/////////:...-/////

  498. MMMMMMMMMMMMMMMo--ommds +mMMMMMmhhhhhhhhhyhhhyyhyhhhhhyyshmmddhydNMmdmmmh/+syhdddhhhhyyysssssy--:/`--/////////. ```-////

  499. MMMMMMMMMMMMMMMs--oNNmy /mMMMMMNyhhhhyyyyyyyhdddddmmmmmmmdddhyoyhhddhyss+oso+oosssssysyyyssssyssoh-/-+////////+/oos+////

  500. MMMMMMMMMMMMMMMy--/soo+ :mNMMMMNyyyyyyyyyyyyhhhhhhhhhhhhdyyss++o++++:``-+yhhyyss+++ooossssssssyysd+Ns////////+ooyhNh:///

  501. MNNNNMMMMMMNNMMh-------`.mNMMMNNsyyyyyysyyyyhhhhhhhhhhhhhd+/ooo+:...``.:+o++/:+ossoo++oooooosoosyhyMMNs:////+ooshhmMd://

  502. MNMNMMMMMMMMMMMd-------``mNMMMMNsysyyssysyyyhhhhhhhhhhhhhhh///--:--..-::::-.````.+o+++++++ooo/+yyhMMMMMNmmdddyohmddNMd:/

  503. MMMMMMMMMMMMMMMm-------``mNMMMMMysysssssssysyhhhdhdhhhhhhhdy//...-:---:+osssoo+:-/+/:://++o+:/+ysNMMMMMMMMMMMMMMNddmNMm/

  504. MMMMMMMMMMMMMMMN-------` dNMNNNNysssssssssssyhhhhhhhhhhhhhhdy+/:++/:::-:///+oso+/::::///++:-:+oomMMMMMMMMMMMMMMMMMMMMMMd

  505. MMMMMMMMMMMMMMMN-------. hmMNNNNyssssoosooo+shhhhhhhhhhhhhhhhdo:/+o+////+osyyyo+////////-.-:++/mMMMMMMMMMMMMMMMMMMMMMMMM

  506. MMMMNNMNMMMMMMMM:------. ymMNNNNyoosooooo+:/yhhhhhhhhhhhhhhhhhhho+ssyyyhdddhhyyo+///::-...-//+NMMMMMMMMMMMMMMMMMMMMMMMMM

  507. MMMMMMMMMMMMMMMM:------. smNNNNNyoooooooo/:+yhhhhhhhhhhyyyhhhhhhds/oossossssoo++//:---...---yMMMMMMMMMMMMMMMMMMMMMMMMMMM

  508. NNNNNNNNNNNNNMMM:..-..-. omNNNNNy+ooooooo::oyhhhhhhhhhhsosyyysyhhds/::/:-----:::---....---/mMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  509. NNmNNNmNNmmNNNNN/....... odNNNNNh+++oo+++-``.+hhhhhhhhyoosyysosydmNNmhy+-.::-----....----sNMMMMMMMMMMMNMMMMMMMMMMMMMMMMM

  510. mNNmNNNNNNNNNNNN+....... +mNNNNNd/+++++oo:   /hhhhhhhs:/+osss+yNMMMMMNm/.../:---..--:--/dMMMMMMMMMMMMNMMMMMMMMMMMMMMMMMM

  511. mNNNNNNNNNNNNNNNo..-+++/ /dNNNNNm://////+o///shhhhhhh+--//::omMMMMMNNNh+-...:::-.-----sNMMMMMMMMMMMMNMMMMMMMMMMMMMMMMMMM

  512. NNNNNNNNNNNNNNNNs../dsyo :dNNNNNm-::::-:oooossyyhhhhy:./ho:yNMMMMMMMNmho:....:::--..:hmMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  513. NmmmNNNNNNNNNNNNh..:hsoo -dNNNNNm----``-/:////+syhhhy:`.:.+MMMMMMMMMMdhy/-./:`:::--/dhydMMMMMMMMNNNMMMMMMMMMMMMMMMMMMMMM

  514. mmNmmmmmNmmNddmNh`.-do+o .dNNNNNN-..```+hdhhhhhsyhyhs-```.NMMMMMMMMMMNmhy+-/+.`-::oddhyshMMMMMMMMNMMMMMMMMMMMMMMMMMMMMMM

  515. mNmmmmNmmNmmmNmNm`..h+/o``dNNNNNN`  -+/hNmdNNMNsyysys:...sMMMMMMMMMNNNNddhs:+: `.:/dddhhyyNMMNMNmMMMMMMMMMMMMMMMMMMMMMMM

  516. hyyyyssssoooo+++/...hyoy. dmNNNNN. `shsydyhmNmh+sysys-...NMMMMMMMMMNNNmdddh///-```.mddhhhyyNNNddMMMMMMMMMMMMMMMMMMMMMMMM

  517. ....................yoo+. hmNNNNNh/-hdyyhhhdmds//oss+---/MMMMMMMMMMNNNmmmmmyoss+:``dmdddmmddNmhNMMMMMMMMMMMMMMMMMMMMMMMM

  518. ................----+++/:-hdNNNNNy:.oso+++oooo/-::/..---sMMMNMMMMMMMNNNmmNNmmdhhhs-dmmmNNNNNmNMMMMMMMMMMMMMMMMMMMMMMMMMM

  519. osssyyyyhhhhhhhhddddddddmmmmNNNNN/`````.-::////ooos+:::-dMMMNMMMMMMMNNNNNNNNNmdddmdNNNNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  520. NNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNN/         `-syhhhddhysoNMMMMMMMMMMMMNNNNNNNNNNNNmNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  521. NNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNN+          .+shdmmmmddmMMMNMMMMMMMMMMNNNNNNNNMMMMNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  522. NNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNNo          `.-::+sdmmmMMNMNNMMMMMMMMMMNNNNNNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  523. NNNNNNNNNNNNNNNNNNNNNNdmNNNmmmmmm/     ``../+-```..-+hNNNNNNmNMMMMMMNMMMMMMMNNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  524. mmmmmmddddhhhhyyyssooo+++++//::-.  -::shmNmmNms:o/`..hNNNNmNNdNNMMMMNMMMMMMMMNNNMMMMMMMMNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  525. :-:-.....`````````` ````.-         -oosddhy/:/--/. `sNNNNmmmNmmNMMMNNNMMMMMMMNNNNMMMMMMNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  526. ``..````.`........-.---:/-          `.```     ````-oNNNNmmmddmdmMMNNNNMMMMMMMMNNNMMMMMMNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  527. --::://///-.........````                 ``.-:+++shNNNNmmmddhhddMMNNNNNNMMMMMMMNNMMNNNNmNMMMMMMNMMMMMMMMMMMMMMMMMMMMMMMM

  528. .-:/+oossso/-.`                 ```.-:/oosyhhhddhsdNNmmmmdddhyyyNMNNNNNNNMMMMMMMMMMMMMNmNNMMMMMMMMMMMNMMMMMMMMMMNMMMMMMM

  529. ``.-:/++osso+/:-``     `.---/+osyhhhdddddddyohNmmddhdddhhysomNNNNNNNNNNNMMMMMMMMMMNNNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM

  530. ````..--:/://+oshyyso++osyhhssoo+++++oyyyys+/yhydmmmhyyhyyys+yNNNNNNNNNNNNNNNMMMNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNN

  531. ``````-sssso+/+///yyyyyyhhdddddddhddddhyo/---...-/odmmdhyyyyso++NNNNNNNNNNmmmNNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNN

  532. `````.-shdddyddhsoo+oooossyhhhddddddhs+/-...------.`:hddhysssoo+:mNNmNNNNNNNNNNNMMMMMMNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMN

  533. -::+y+ohmmhy+yyhhhyysoo+oo++//::-.-.-..------::::::-``yhhhys+:/+:sNNNmNNNNNNNNNNMMMMMMNNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNN

  534. ////+sddhy/-.:yssyhyyysso+soo++/:::--::-----:-:::::--`/ssoo+/:/:::NNNNNNNNNNNNMMMNMMMMNNmmNNMMMMMMMMMMMMMMMMMMMMMMMMMMNN</pre> -->

  535. </div>

  536.     <div class="content">

  537.         <div class="date">Mars 1989</div>

  538.         <h2>Tim Berners-Lee présente l’idée du Web</h2>

  539.         <p>Tim Berners-Lee, scientifique au CERN, présente une idée pour publier et organiser de l'information à base de documents renvoyant les uns vers les autres grâce à des liens. Son supérieur hiérarchique annote la proposition d'un prémonitoire « vague, mais excitant ».</p>

  540.     </div>

  541. </div>

  542. 

  543. </section>

  544. 

  545. <section class="date-1990"><!-- <div class="date">1990</div>

  546. <div class="separator"></div> --><div class="article">

  547.     <div class="image">

  548.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image1-min.png" alt=""><figcaption>Image: CERN</figcaption></figure>

  549. </div>

  550.     <div class="content">

  551.         <div class="date">1990</div>

  552.         <h2>La première page Web</h2>

  553.         <p>Création du premier serveur Web <a target="_blank" href="https://home.cern/news/news/computing/dream-team-web-developers-recreate-line-mode-browser">et de la première page Web</a>. Cette dernière est <a target="_blank" href="https://www.wired.co.uk/article/first-web-page">remise en ligne en 2013</a>, dans une version de 1992. La première version n'a pas été retrouvée.</p>

  554.     </div>

  555. </div>

  556. 

  557. <div class="article">

  558.     <div class="content">

  559.         <div class="date">6 août 1991</div>

  560.         <h2>L’existence du Web est rendue publique</h2>

  561.         <p>Tim Berners-Lee rend le projet WorldWideWeb public dans un message <a target="_blank" href="https://www.w3.org/People/Berners-Lee/1991/08/art-6484.txt">posté sur Usenet</a>, un système de forum en ligne qui a fait les grandes heures du début d'Internet. Il s'agirait de <a target="_blank" href="https://www.forbes.com/sites/gilpress/2017/07/30/tim-berners-lee-launches-the-worlds-first-website/#20b37bb84c2a">la première mention publique du Web.</a></p>

  562.     </div>

  563. </div>

  564. 

  565. <div class="article">

  566.     <div class="image">

  567.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image2.jpg" alt=""><figcaption>Wikipédia</figcaption></figure>

  568. </div>

  569.     <div class="content">

  570.         <div class="date">1992</div>

  571.         <h2>Les images débarquent</h2>

  572.         <p>Quelle a été la première image publiée sur le Web ? Bien avant les premières images de chatons, la photo kitsch des Horribles Cernettes, un groupe de musique du CERN, a été mise en ligne. Mais son auteur, alors ingénieur dans le laboratoire, <a target="_blank" href="http://musiclub.web.cern.ch/MusiClub/bands/cernettes/disclaimer.html">a depuis démenti</a> qu’il puisse s’agir de la toute première. « <em>Personne ne sait quelle est la première photo du Web. Mais la nôtre (...) a ouvert le Web à la musique et à l’art, et à tout ce qui est fun !</em> » </p>

  573.     </div>

  574. 

  575. </div>

  576. 

  577. </section>

  578. 

  579. <section class="date-1993"><div class="date-title">1993</div>

  580. 

  581. <div class="article">

  582.     <div class="image">

  583.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image3-min.jpg" alt=""><figcaption>NCSA Mosaic beta version / history-computer.com</figcaption></figure>

  584. </div>

  585.     <div class="content">

  586.         <div class="date">Janvier</div>

  587.         <h2>Le navigateur Mosaic facilite l’accès au Web</h2>

  588.         <p>Ce n’est pas le premier navigateur Web mais son interface intuitive, son élégance typiquement « <em>années 1990</em> » et sa capacité à incorporer des images au fil du texte facilitent l’accès au Web, même pour des non-spécialistes.</p>

  589.     </div>

  590. </div>

  591. 

  592. <div class="article">

  593.     <div class="content">

  594.         <div class="date">30 avril</div>

  595.         <h2>Les technologies du Web entrent dans le domaine public</h2>

  596.         <p>Le CERN <a target="_blank" href="https://cds.cern.ch/record/1164399">décide de mettre</a> les technologies qui permettent au Web de fonctionner dans le domaine public. Ingénieurs, étudiants, véliplanchistes et même votre tonton : tout le monde peut désormais s’emparer et faire évoluer le Web (mais surtout les ingénieurs, quand même). Cela sera décisif pour son succès.</p>

  597.     </div>

  598. </div>

  599. 

  600. <div class="article">

  601.     <div class="image no-overlap">

  602.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image4.gif" alt=""><figcaption>https://www.cl.cam.ac.uk</figcaption></figure>

  603. </div>

  604.     <div class="content">

  605.         <div class="date">Novembre</div>

  606.         <h2>Une cafetière devient l’héroïne de la première webcam</h2>

  607.         <p>La technologie au service de l’humanité : pour savoir si du café est prêt, des chercheurs du laboratoire d’informatique de l’université de Cambridge <a target="_blank" href="https://www.cl.cam.ac.uk/coffee/qsf/coffee.html">braquent une caméra sur la cafetière du bâtiment</a>, qui envoie, trois fois par minute, une image de l’objet. Ils décident de la mettre sur le Web en 1993 – ce qui est souvent considéré comme la première webcam.</p>

  608.     </div>

  609. </div>

  610. 

  611. <div class="article">

  612.     <div class="content">

  613.         <div class="date">8 décembre</div>

  614.         <h2>Le premier article du New York Times évoquant le Web</h2>

  615.         <p>« <em>Imaginez une carte des trésors cachés de l’âge de l’information.</em> » <a target="_blank" href="https://www.nytimes.com/1993/12/08/business/business-technology-a-free-and-simple-computer-link.html?pagewanted=all&amp;src=pm">Cet article</a> de la version papier (forcément) du New York Times, qui fait la part belle au navigateur Mosaic, explique en quoi le Web permet d’accéder plus facilement aux informations disséminées sur Internet, sans avoir besoin d’être un spécialiste de l’informatique.</p>

  616.     </div>

  617. </div>

  618. 

  619. </section>

  620. 

  621. <section class="date-1994"><div class="date-title">1994</div>

  622. 

  623. <div class="article">

  624.     <div class="image no-overlap">

  625.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image5.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  626. </div>

  627.     <div class="content">

  628.         <div class="date">Janvier</div>

  629.         <h2>Création de Yahoo!</h2>

  630.         <p>Au départ, simple annuaire de sites Web tenu par deux étudiants de Stanford, Yahoo! est très vite devenu un portail incontournable offrant plusieurs services (e-mail, moteur de recherche, etc.) et l’un des sites les plus populaires au monde. Un quart de siècle et nombre de scandales plus tard, Yahoo! semble sur le point de sombrer dans l’oubli.</p>

  631.     </div>

  632. </div>

  633. 

  634. <div class="article">

  635.     <div class="image no-overlap">

  636.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image6-min.jpg" alt=""><figcaption>https://royal.pingdom.com/the-web-in-1996-1997/</figcaption></figure>

  637. </div>

  638.     <div class="content">

  639.         <div class="date">Mai</div>

  640.         <h2>Lancement du moteur de recherche Lycos</h2>

  641.         <p>« <em>Va chercher !</em> » Les Français se rappellent peut-être de ce spot publicitaire pour ce moteur de recherche très populaire dans les années 1990, qui avait un retriever pour mascotte. Lycos a changé plusieurs fois de propriétaire mais existe toujours – même si les fautes d’orthographe qui émaillent sa page de résultats confirment que son âge d’or est derrière lui.</p>

  642.     </div>

  643. </div>

  644. 

  645. <div class="article">

  646.     <div class="image no-overlap">

  647.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image7.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  648. </div>

  649.     <div class="content">

  650.         <div class="date">Juillet</div>

  651.         <h2>Création d’Amazon</h2>

  652.         <p>Jeff Bezos fonde Cadabra, qu’il renomme Amazon quelques mois plus tard. Le site ouvre ses portes en 1995, il ne vend alors que des livres, une curieuse technologie du XVe siècle sur le point de tomber en désuétude.</p>

  653.     </div>

  654. </div>

  655. 

  656. <div class="article">

  657.     <div class="image">

  658.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image8.gif" alt=""><figcaption>https://clintonwhitehouse1.archives.gov/</figcaption></figure>

  659. </div>

  660.     <div class="content">

  661.         <div class="date">Octobre</div>

  662.         <h2>La Maison Blanche ouvre son site Web</h2>

  663.         <p>« <em>Un espace sur l’autoroute de l’information où les gens peuvent trouver les informations dont ils ont besoin sur le gouvernement et où ils peuvent interpeller directement le président</em> » : c’est avec cette métaphore automobile qu’Al Gore, alors vice-président, <a target="_blank" href="https://clintonwhitehouse6.archives.gov/1994/10/1994-10-20-vice-president-unveils-white-house-internet-service.html">présentait le site</a> flambant neuf de la Maison Blanche.</p>

  664.     </div>

  665. </div>

  666. 

  667. <div class="article">

  668.     <div class="image no-overlap">

  669.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image9-min.jpg" alt=""><figcaption>https://www.arnnet.com.au/slideshow/557401/pictures-visual-history-netscape-navigator/</figcaption></figure>

  670. </div>

  671.     <div class="content">

  672.         <div class="date">Octobre</div>

  673.         <h2>Lancement du navigateur Netscape</h2>

  674.         <p>Netscape voulait supplanter Mosaic : mission accomplie. Il devint vite le principal navigateur de l’époque et reste aujourd’hui dans le cœur de nombreux internautes des années 1990. Pour l’anecdote, le nom de code du projet était « <em>Mozilla</em> » (mélange de « <em>Mosaic</em> » et « <em>Godzilla</em> »). Le navigateur Mozilla Firefox en est le descendant.</p>

  675.     </div>

  676. </div>

  677. 

  678. <div class="article">

  679.     <div class="image">

  680.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image10.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  681. </div>

  682.     <div class="content">

  683.         <div class="date">Novembre</div>

  684.         <h2>Naissance de Geocities</h2>

  685.         <p>Symbole de l’âge d’or des « <em>pages perso</em> », Geocities permettait aux internautes d’héberger gratuitement leurs sites Web. Il fallait pour cela choisir dans quelle « <em>zone</em> » virtuelle l’héberger, qui définissait une partie de l’URL. Si votre site parlait de technologies, la zone était « <em>Silicon Valley</em> ». S’il parlait de mangas, il était domicilié à « <em>Tokyo</em> ».</p>

  686.     </div>

  687. </div>

  688. 

  689. <div class="article">

  690.     <div class="content">

  691.         <div class="date">1994</div>

  692.         <h2>Création de Snopes.com</h2>

  693.         <p>Initialement voué à recenser le folklore d'Internet, il devient le premier site de vérification des rumeurs et des fausses informations.</p>

  694.     </div>

  695. </div>

  696. 

  697. <div class="article">

  698.     <div class="image no-overlap">

  699.         <figure><a target="_blank" href="http://3615pixels.cool/"><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/banniere1-min.jpg" alt=""></a>

  700.         </figure>

  701. </div>

  702.     <div class="content">

  703.         <div class="date">1994</div>

  704.         <h2>Première bannière publicitaire</h2>

  705.         <p>La première bannière publicitaire <a target="_blank" href="https://www.theatlantic.com/technology/archive/2017/04/the-first-ever-banner-ad-on-the-web/523728/">apparaît</a> sur le site Hotwired.com. La première d’une longue, très longue série.</p>

  706.     </div>

  707. </div>

  708. 

  709. </section>

  710. 

  711. <section class="date-1995"><div class="date-title">1995</div>

  712. 

  713. <div class="article">

  714.     <div class="content">

  715.         <div class="date">Avril</div>

  716.         <h2>Match.com, premier grand site de rencontres</h2>

  717.         <p>L’idée était de transposer les petites annonces des journaux sur le Web. Elle a fini par provoquer une révolution dans la façon de se rencontrer. Le site texan fait aujourd’hui partie du même groupe que Meetic, Tinder ou OkCupid.</p>

  718.     </div>

  719. </div>

  720. 

  721. <div class="article">

  722.     <div class="image">

  723.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image11.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  724. </div>

  725.     <div class="content">

  726.         <div class="date">Septembre</div>

  727.         <h2>Lancement d’eBay</h2>

  728.         <p>Initialement nommé AuctionWeb, le site de ventes aux enchères fondé par Pierre Omidyar a par la suite acheté PayPal.</p>

  729.     </div>

  730. </div>

  731. 

  732. <div class="article">

  733.     <div class="content">

  734.         <div class="date">Août</div>

  735.         <h2>Création du navigateur Internet Explorer</h2>

  736.         <p>Microsoft lance son propre navigateur. Livré par défaut avec Windows, il deviendra vite le navigateur le plus utilisé au monde avant d’être supplanté par Firefox et Chrome. Il a depuis été remplacé, sur Windows, par Edge.</p>

  737.     </div>

  738. </div>

  739. 

  740. <div class="article">

  741.     <div class="image">

  742.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image12.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  743. </div>

  744.     <div class="content">

  745.         <div class="date">Décembre</div>

  746.         <h2>Lancement du moteur de recherche AltaVista</h2>

  747.         <p>Il resta pendant plusieurs années leader du marché, avant d’être détrôné par Google. AltaVista embarquait alors une fonctionnalité précieuse : un module de traduction de textes, baptisé « <em>Babel Fish</em> », en référence au poisson Babel polyglotte des romans de Douglas Adams. Racheté par Yahoo! en 2003, Babel Fish est désormais utilisé par Microsoft sous le nom de Bing Translator.</p>

  748.     </div>

  749. </div>

  750. 

  751. </section>

  752. 

  753. <section class="date-1996"><div class="date-title">1996</div>

  754. 

  755. <div class="article">

  756.     <div class="image">

  757.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image13-min.jpg" alt=""><figcaption>The Nokia 9000 Communicator in its open configuration / AllAboutSymbian</figcaption></figure>

  758. </div>

  759.     <div class="content">

  760.         <div class="date">15 août</div>

  761.         <h2>Nokia 9000 Communicator, premier mobile à aller sur le Web</h2>

  762.         <p>Avec son grand écran monochrome et son large clavier, le Communicator faisait fantasmer au point que le héros du film Le Saint, incarné par Val Kilmer, l’utilisait pour sauver le monde. A l’époque, l’Internet mobile était encore très lent, il fallait plusieurs secondes pour charger une toute petite image.</p>

  763.     </div>

  764. </div>

  765. 

  766. <div class="article">

  767.     <div class="content">

  768.         <div class="date">Octobre</div>

  769.         <h2>Lancement d’Internet Archive</h2>

  770.         <p>L’Américain Brewster Kahle lance la bien nommée Fondation Internet Archive, avec <a target="_blank" href="https://www.lemonde.fr/pixels/article/2016/10/26/vingt-ans-d-archivage-du-web-un-projet-titanesque_5020433_4408996.html">un projet à l’objectif aussi clair qu’ambitieux : archiver le Web</a>. Aujourd’hui, il est possible de retourner dans le passé du Web, grâce à <a target="_blank" href="https://archive.org/web/">la précieuse Wayback Machine</a>, sa machine à remonter dans le temps.</p>

  771.     </div>

  772. </div>

  773. 

  774. <div class="article">

  775.     <div class="image no-overlap">

  776.         <div class="video-responsive">

  777.             <iframe width="560" height="315" src="https://www.youtube.com/embed/_9nh6QoUsVU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

  778.         </div>

  779.     </div>

  780.     <div class="content">

  781.         <div class="date">Automne</div>

  782.         <h2>La vidéo dancing baby devient un des premiers mèmes</h2>

  783.         <p>Un nourrisson en images de synthèse se trémoussant bizarrement sur fond noir : ce GIF, issu d’une vidéo, fut massivement partagé sur le Web et est souvent considéré comme l’un des premiers contenus viraux.</p>

  784.     </div>

  785. </div>

  786. 

  787. </section>

  788. 

  789. <section class="date-1997"><div class="date-title">1997</div>

  790. <div class="article">

  791.     <div class="image">

  792.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image14-min.png" alt=""><figcaption>http://www.jeuxvideo.com/dossiers/00011660/les-debuts-de-jeuxvideo-com-mars-1997-lancement-de-jeuxvideo-com-003.htm</figcaption></figure>

  793. </div>

  794.     <div class="content">

  795.         <div class="date">Mars</div>

  796.         <h2>Le site français Jeuxvideo.com est lancé</h2>

  797.         <p>Ses forums, dont <a target="_blank" href="http://www.jeuxvideo.com/forums/0-51-0-1-0-1-0-blabla-18-25-ans.htm">le célèbre « 18-25 »</a>, sont aujourd’hui les plus populaires en France. Dès le départ considérés comme turbulents, voire intenables, ces espaces de discussion majoritairement fréquentés par des adolescents et de jeunes adultes se sont attiré les foudres des autorités en 2017 après <a target="_blank" href="https://www.lemonde.fr/pixels/article/2018/07/03/harcelement-en-ligne-deux-hommes-juges-pour-des-menaces-contre-nadia-daam_5324963_4408996.html">une campagne de harcèlement à l’encontre de la journaliste Nadia Daam.</a></p>

  798.     </div>

  799. </div>

  800. 

  801. <div class="article">

  802.     <div class="content">

  803.         <div class="date">1997</div>

  804.         <h2>Naissance du terme « <em>weblog</em> »</h2>

  805.         <p>L’apparition de ce terme est attribuée à John Barger, un développeur qui avait donné ce nom à son site, sur lequel il publiait quotidiennement des liens vers ses lectures en ligne. « <em>Weblog</em> » est la combinaison de « <em>Web</em> »  et de « <em>log</em> », qu’on peut traduire par « <em>registre</em> ». On parle aujourd’hui plus simplement de « <em>blog</em> », et même aujourd’hui de « <em>vlogs</em> » vidéos.</p>

  806.     </div>

  807. </div>

  808. 

  809. <div class="article">

  810.     <div class="image">

  811.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image15-min.jpg" alt=""><figcaption>https://www.blogdumoderateur.com/journee-type-internet-en-1999/</figcaption></figure>

  812. </div>

  813.     <div class="content">

  814.         <div class="date">Octobre</div>

  815.         <h2>Lancement de Caramail</h2>

  816.         <p>ASV ? La petite messagerie, fondée par les créateurs du moteur de recherche Lokace, est devenue un géant du Web français, en regroupant des services e-mail, mais aussi des tchatrooms très fréquentées, des forums ou des annuaires de sites. Son rachat en 2000 par Spray Network et les nouvelles interfaces signeront le début de la fin.</p>

  817.     </div>

  818. </div>

  819. 

  820. </section>

  821. 

  822. <section class="date-1998"><div class="date-title">

  823. <span>1</span><span>9</span><span>9</span><span>8</span>

  824. </div>

  825. 

  826. <div class="article">

  827.     <div class="content">

  828.         <div class="date">17 janvier</div>

  829.         <h2>Le site américain Drudge Report sort l’affaire Clinton-Lewinsky</h2>

  830.         <p>Pour la première fois, un site Internet est à l’origine d’un énorme scoop, qui ébranle l’Amérique : le président américain Bill Clinton a entretenu une relation extraconjugale avec une stagiaire, Monica Lewinksy.</p>

  831.     </div>

  832. </div>

  833. 

  834. <div class="article">

  835.     <div class="image">

  836.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image16.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  837. </div>

  838.     <div class="content">

  839.         <div class="date">4 septembre</div>

  840.         <h2>Google est fondé dans un garage californien</h2>

  841.         <p>Deux étudiants de Stanford, Larry Page et Sergey Brin, se lancent dans un projet de moteur de recherche qui rencontrera ce qu’il n’est pas exagéré de qualifier de joli petit succès. Ironiquement, Google, aujourd’hui critiqué pour ses intrusions dans la vie privée de ses utilisateurs, s’est, à ses débuts, moins fait remarquer pour la précision de ses recherches que pour la sobriété de sa page d’accueil, dépourvue de fioritures… et de publicités.</p>

  842.     </div>

  843. </div>

  844. 

  845. </section>

  846. 

  847. <section class="date-1999"><div class="date-title">1999</div>

  848. 

  849. <div class="article">

  850.     <div class="content">

  851.         <div class="date">10 février</div>

  852.         <h2>En France, le Web au cœur d’une polémique</h2>

  853.         <p>La justice française <a target="_blank" href="https://www.liberation.fr/ecrans/1999/02/26/altern-le-debat-est-la-reactions-des-lecteurs-apres-la-condamnation-du-fournisseur-d-hebergement_266043">condamne l'entreprise Altern</a> pour avoir hébergé, parmi des milliers d'autres, un site diffusant des photos d'Estelle Hallyday nue, lançant un vaste débat sur la responsabilité et la liberté d'expression sur le Web.</p>

  854.     </div>

  855. </div>

  856. 

  857. </section>

  858. 

  859. <section class="date-2000"><div class="date-title">2000</div>

  860. 

  861. <div class="article">

  862.     <div class="content">

  863.         <div class="date">21 août</div>

  864.         <h2>Premier forfait Internet illimité en France</h2>

  865.         <p>A l’époque où chaque heure de connexion Internet était payante, l’arrivée du premier forfait illimité libère les usages. Lancé par le fournisseur d’accès AOL, il est facturé 200 francs, soit environ 30 euros, et fonctionne à la vitesse très lente des modems 56 kbit/s de l’époque. L’année 2000 voit également émerger l’ADSL, bien plus rapide (512 kbit/s), illimité également, mais réservé à quelques communes au départ.</p>

  866.     </div>

  867. </div>

  868. 

  869. <div class="article">

  870.     <div class="content">

  871.         <div class="date">20 novembre</div>

  872.         <h2>Yahoo! visé par la justice française à cause d’objets nazis</h2>

  873.         <p>La justice française <a target="_blank" href="https://www.zdnet.fr/actualites/yahoocom-bannit-les-objets-nazis-de-ses-encheres-2061986.htm">ordonne à Yahoo!</a> de retirer de sa plate-forme de vente les objets nazis, estimant que le droit américain, qui autorisait cette vente, ne pouvait s'appliquer sur le territoire français.</p>

  874.     </div>

  875. </div>

  876. 

  877. </section>

  878. 

  879. <section class="date-2001"><div class="date-title">2001</div>

  880. 

  881. <div class="article">

  882.     <div class="image">

  883.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image17.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  884. </div>

  885.     <div class="content">

  886.         <div class="date">15 janvier</div>

  887.         <h2>Lancement de Wikipédia</h2>

  888.         <p>L’encyclopédie collaborative lancée par Jimmy Wales et Larry Sanger est <a target="_blank" href="https://www.lemonde.fr/pixels/article/2016/01/15/rencontre-avec-les-petites-mains-anonymes-qui-font-wikipedia_4847756_4408996.html">l’un des projets les plus ambitieux et réussis du Web</a>. Elle rassemble aujourd’hui plus de 40 millions d’articles dans plus de 300 langues et a déjà permis à des milliards d’élèves (à la louche) de bâcler leurs devoirs.</p>

  889.     </div>

  890. </div>

  891. 

  892. <div class="article">

  893.     <div class="content">

  894.         <div class="date">2001</div>

  895.         <h2>Explosion de la bulle spéculative d’Internet</h2>

  896.         <p>Les réussites de certaines grandes entreprises du numérique ont rendu euphoriques les investisseurs qui ont considérablement misé sur ce secteur. Problème : les résultats concrets n’étaient pas à la hauteur des estimations. La bulle, qui concernait aussi bien les acteurs du Web que les valeurs multimédias en général, a fini par éclater en 2001.</p>

  897.     </div>

  898. </div>

  899. 

  900. </section>

  901. 

  902. <section class="date-2002"><div class="date-title">2002</div>

  903. 

  904. <div class="article">

  905.     <div class="content">

  906.         <div class="date">Décembre</div>

  907.         <h2>La radio Skyrock lance les Skyblogs</h2>

  908.         <p>En France, la radio Skyrock a l’idée de lancer sa propre plate-forme de blogs, qui devient rapidement la plus populaire auprès des adolescents, alors même que les blogs deviennent une phénomène de société.</p>

  909.     </div>

  910. </div>

  911. 

  912. <div class="article">

  913.     <div class="image no-overlap">

  914.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image18.gif" alt=""></figure>

  915. </div>

  916.     <div class="content">

  917.         <div class="date">Décembre</div>

  918.         <h2>Naissance des licences Creative Commons</h2>

  919.         <p>Ces licences, imaginées par le professeur de droit américain Lawrence Lessig, permettent aux créateurs de diffuser leurs œuvres sur Internet, en définissant eux-mêmes ce que les autres peuvent faire ou non avec leurs œuvres. Très populaires, elles ont été <a target="_blank" href="https://www.lemonde.fr/technologies/article/2007/01/25/creative-commons-la-liberte-d-autoriser-plutot-que-d-interdire_858769_651865.html">adaptées en 2004 au droit français.</a></p>

  920.     </div>

  921. </div>

  922. 

  923. </section>

  924. 

  925. <section class="date-2003"><div class="date-title">2003</div>

  926. 

  927. <div class="article">

  928.     <div class="image">

  929.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image19.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  930. </div>

  931.     <div class="content">

  932.         <div class="date">Mai</div>

  933.         <h2>Création du CMS Wordpress, qui équipe un nombre considérable de sites</h2>

  934.         <p>Ce logiciel open source est rapidement devenu le plus populaire des CMS (content management system), ces outils permettant de créer et gérer des sites en ligne. Personnalisable à l’infini, il a notamment été plébiscité par les blogueurs qui se sentaient à l’étroit dans les plates-formes de blogs trop uniformes.</p>

  935.     </div>

  936. </div>

  937. 

  938. <div class="article">

  939.     <div class="image">

  940.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image20.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  941. </div>

  942.     <div class="content">

  943.         <div class="date">Août</div>

  944.         <h2>MySpace débarque</h2>

  945.         <p>Entre la plate-forme de blogs et le réseau social, MySpace est particulièrement prisé par le milieu de la musique. C’est le site le plus cool du monde : tout le monde, anonymes comme stars, se doit d’y avoir sa page. MySpace s’impose, en quelques mois, comme un incontournable, colossal, clairement là pour durer. Il se fera pourtant balayer par la déferlante Facebook.</p>

  946.     </div>

  947. </div>

  948. 

  949. <div class="article">

  950.     <div class="image">

  951.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image21.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  952. </div>

  953.     <div class="content">

  954.         <div class="date">Septembre</div>

  955.         <h2>Lancement du site controversé The Pirate Bay</h2>

  956.         <p>Ce site suédois répertorie des liens permettant de télécharger des contenus (films, séries, musiques, etc.) en peer to peer, souvent illégalement. The Pirate Bay est devenu le symbole de la lutte entre partisans de l’accès libre à la culture et ayants droit, dont il est la bête noire. Plusieurs de ses fondateurs ont été emprisonnés.</p>

  957.     </div>

  958. </div>

  959. 

  960. <div class="article">

  961.     <div class="content">

  962.         <div class="date">Octobre</div>

  963.         <h2>Les débuts de 4chan</h2>

  964.         <p>Lancé par un ado new-yorkais à partir de sa chambre, 4chan devient l’un des forums les plus populaires au monde. <a target="_blank" href="https://www.lemonde.fr/pixels/article/2015/09/23/chats-mignons-stars-nues-et-anonymous-la-folle-saga-du-controverse-forum-4chan_4768319_4408996.html">Terreau de la culture Web</a>, pour le meilleur et pour le pire, ce temple de l’anonymat aura, en vrac, été le berceau du mouvement Anonymous, mais aussi le lieu où ont été postés <a target="_blank" href="https://www.lemonde.fr/pixels/article/2014/09/01/comment-des-photos-de-celebrites-peuvent-se-retrouver-piratees_4480030_4408996.html">les photos volées de star nues</a> et les <a target="_blank" href="https://www.lemonde.fr/pixels/article/2017/05/06/piratage-d-en-marche-les-questions-qui-se-posent_5123507_4408996.html">fameux MacronLeaks.</a></p>

  965.     </div>

  966. </div>

  967. 

  968. </section>

  969. 

  970. <section class="date-2004"><div class="date-title">2004</div>

  971. 

  972. <div class="article">

  973.     <div class="image">

  974.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image22.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  975. </div>

  976.     <div class="content">

  977.         <div class="date">4 février</div>

  978.         <h2>Création de Facebook</h2>

  979.         <p>Dans un dortoir de Harvard, le jeune Mark Zuckerberg code un trombinoscope en ligne. <a target="_blank" href="https://www.thecrimson.com/article/2004/2/9/hundreds-register-for-new-facebook-website/">Succès immédiat de thefacebook.com</a> avec la suite que l'on sait.</p>

  980.     </div>

  981. </div>

  982. 

  983. <div class="article">

  984.     <div class="content">

  985.         <div class="date">21 juin</div>

  986.         <h2>Une loi définit le droit français de l’Internet</h2>

  987.         <p>Promulgation de la loi pour la confiance dans l'économie numérique, pierre angulaire pendant plus d'une décennie du droit français de l'Internet, qui permet aux hébergeurs de ne pas être directement responsables des contenus postés par leurs utilisateurs.</p>

  988.     </div>

  989. </div>

  990. 

  991. <div class="article">

  992.     <div class="content">

  993.         <div class="date">5 octobre</div>

  994.         <h2>Une conférence parle pour la première fois de « <em>Web 2.0</em> »</h2>

  995.         <p>Elle <a target="_blank" href="http://web.archive.org/web/20040602111547/http://web2con.com/">réunit notamment à San Francisco</a> des chefs d’entreprise comme Jeff Bezos (Amazon) et des grands penseurs du Web comme Lawrence Lessig. Le Web 2.0 désigne alors un Web moins statique, plus interactif et participatif. Des start-upeurs plus ou moins mythomanes et des communiqués de presse excessivement enthousiastes parlent, parfois, aujourd’hui de Web 3.0, voire 4.0, mais c’est vraiment n’importe quoi.</p>

  996.     </div>

  997. </div>

  998. 

  999. <div class="article">

  1000.     <div class="content">

  1001.         <div class="date">9 novembre</div>

  1002.         <h2>Sortie du navigateur Firefox</h2>

  1003.         <p>Emanation du logiciel Mozilla, qui trouve ses racines dans le développement de Netscape Navigator, Firefox se consacre, quant à lui, uniquement à la navigation Web. Sa version 1.0 <a target="_blank" href="https://blog.mozilla.org/press/2004/11/mozilla-foundation-releases-the-highly-anticipated-mozilla-firefox-1-0-web-browser/">sort en 2004</a>. Plus performant et plus dépouillé que ses concurrents, libre et gratuit, il a très rapidement du succès.</p>

  1004.     </div>

  1005. </div>

  1006. 

  1007. </section>

  1008. 

  1009. <section class="date-2005"><div class="date-title">2005</div>

  1010. 

  1011. <div class="article">

  1012.     <div class="image no-overlap">

  1013.         <div class="video-responsive">

  1014.             <iframe width="560" height="315" src="https://www.youtube.com/embed/jNQXAC9IVRw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

  1015.         </div>

  1016.     </div>

  1017.     <div class="content">

  1018.         <div class="date">23 avril</div>

  1019.         <h2>La première vidéo est postée sur YouTube</h2>

  1020.         <p>Publiée par le cofondateur de YouTube Jawed Karim, la vidéo s’intitule « <em>Me at the zoo</em> » (« <em>moi au zoo</em> ») et le montre face à des éléphants. Image pourrie, son pourri, contenu pourri : certaines vidéos YouTube ont fait bien du chemin depuis. La plate-forme appartient désormais à l’empire Google.</p>

  1021.     </div>

  1022. </div>

  1023. 

  1024. <div class="article">

  1025.     <div class="content">

  1026.         <div class="date">Printemps</div>

  1027.         <h2>Le Web s’invite dans le référendum européen</h2>

  1028.         <p>Si les principaux médias font campagne pour le « <em>oui</em> » au référendum européen, un débat vif et dense passionne les internautes. Et il penche, lui, plutôt en faveur du non. C'est cette seconde option qui l'emportera, faisant entrer le Web sur la scène politique européenne.</p>

  1029.     </div>

  1030. </div>

  1031. 

  1032. <div class="article">

  1033.     <div class="image no-overlap">

  1034.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image24.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  1035. </div>

  1036.     <div class="content">

  1037.         <div class="date">Juin</div>

  1038.         <h2>Arrivée de Reddit, la « <em>page d’accueil d’Internet</em> »</h2>

  1039.         <p>Sur Reddit, on poste de tout : une photo de chiot mignon, un lien vers une actualité sérieuse, une histoire personnelle, de la pornographie… Les internautes votent selon l’intérêt de la publication. Peu enclin à la modération, Reddit, devenu l’un des forums les plus populaires du Web, <a target="_blank" href="https://www.lemonde.fr/pixels/article/2015/06/11/reddit-entre-en-guerre-contre-ses-utilisateurs-abusifs_4652252_4408996.html">a fini par intégrer des règles</a>, au grand dam de sa communauté.</p>

  1040.     </div>

  1041. </div>

  1042. 

  1043. </section>

  1044. 

  1045. <section class="date-2006"><div class="date-title">2006</div>

  1046. 

  1047. <div class="article">

  1048.     <div class="content">

  1049.         <div class="date">Janvier</div>

  1050.         <h2>Google censure ses résultats en Chine</h2>

  1051.         <p>L’entreprise annonce une version censurée de son moteur de recherche pour répondre aux exigences de Pékin. Il finira en 2010 par se retirer du pays. Huit ans plus tard, un nouveau projet de moteur de recherche pour la Chine <a target="_blank" href="https://www.lemonde.fr/pixels/article/2018/08/20/un-projet-de-moteur-de-recherche-pour-la-chine-declenche-une-fronde-interne-chez-google_5344103_4408996.html">provoquera une fronde chez Google.</a></p>

  1052.     </div>

  1053. </div>

  1054. 

  1055. <div class="article">

  1056.     <div class="image no-overlap">

  1057.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image23.png" alt=""><figcaption>https://www.webdesignmuseum.org/</figcaption></figure>

  1058. </div>

  1059.     <div class="content">

  1060.         <div class="date">21 mars</div>

  1061.         <h2>Le premier tweet</h2>

  1062.         <p>Jack Dorsey, alias @jack, le cofondateur de Twitter, publie le <a target="_blank" href="https://twitter.com/jack/status/20">tout premier message de la plate-forme</a> : « just setting up my twttr » (« en train de configurer mon Twitter »). Savait-il alors que ces petits messages de 140 signes allaient provoquer une révolution dans la diffusion de l’information ?</p>

  1063.     </div>

  1064. </div>

  1065. 

  1066. <div class="article">

  1067.     <div class="content">

  1068.         <div class="date">Avril</div>

  1069.         <h2>Création du site français Leboncoin</h2>

  1070.         <p>Ce service gratuit de petites annonces locales va si bien fonctionner qu’il va porter un terrible coup au business des petites annonces, jusque-là surtout cantonnées au papier, notamment dans la presse locale. Avec son look un peu fauché et son interface passablement moche, Leboncoin cultive (volontairement ?) une image vieillotte presque rassurante sur un Web de plus en plus glacé.</p>

  1071.     </div>

  1072. </div>

  1073. 

  1074. <div class="article">

  1075.     <div class="image">

  1076.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image26-min.jpg" alt=""></figure>

  1077. </div>

  1078.     <div class="content">

  1079.         <div class="date">Août</div>

  1080.         <h2>Création de YouPorn</h2>

  1081.         <p>Le YouTube de la pornographie est aujourd’hui le site X le plus populaire au monde. Il appartient à l’entreprise MindGeek, également propriétaire de PornHub et RedTube.</p>

  1082.     </div>

  1083. </div>

  1084. 

  1085. </section>

  1086. 

  1087. <section class="date-2007"><div class="date-title">2007</div>

  1088. 

  1089. <div class="article">

  1090.     <div class="image no-overlap">

  1091.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image25-min.jpg" alt=""><figcaption>Apple</figcaption></figure>

  1092. </div>

  1093.     <div class="content">

  1094.         <div class="date">9 janvier</div>

  1095.         <h2>Steve Jobs dévoile l’iPhone</h2>

  1096.         <p>« <em>Aujourd’hui, Apple réinvente le téléphone.</em> » Cette fois, la jolie formule n’est pas qu’une promesse marketing. Lors d’une « <em>keynote</em> » historique, Steve Jobs présente l’iPhone, son premier smartphone. Il révolutionnera l’accès au Web, désormais dans la poche des utilisateurs.</p>

  1097.     </div>

  1098. </div>

  1099. 

  1100. <div class="article">

  1101.     <div class="content">

  1102.         <div class="date">4 mars</div>

  1103.         <h2>L’Estonie organise les premières élections législatives en ligne</h2>

  1104.         <p>Le pays balte est <a target="_blank" href="https://www.lemonde.fr/europe/article/2007/03/04/l-estonie-organise-le-premier-scrutin-legislatif-sur-internet_878721_3214.html">le premier au monde</a> à autoriser le vote électronique pour un scrutin de cette importance. Douze ans plus tard, les votes de ce genre continuent de provoquer leur lot de polémiques.</p>

  1105.     </div>

  1106. </div>

  1107. 

  1108. </section>

  1109. 

  1110. <section class="date-2008"><div class="date-title">2008</div>

  1111. 

  1112. <div class="article">

  1113.     <div class="content">

  1114.         <div class="date">Septembre</div>

  1115.         <h2>Le navigateur Chrome s’apprête à écraser ses concurrents</h2>

  1116.         <p>Il aura fallu attendre 2008 pour que Google lance son propre navigateur Web. Il finira par écraser tous les autres.</p>

  1117.     </div>

  1118. </div>

  1119. 

  1120. </section>

  1121. 

  1122. <section class="date-2009"><div class="date-title">2009</div>

  1123. 

  1124. <div class="article">

  1125.     <div class="image no-overlap">

  1126.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image27-min.jpg" alt=""><figcaption>JANIS KRUMS / TWITTER</figcaption></figure>

  1127. </div>

  1128.     <div class="content">

  1129.         <div class="date">15 janvier</div>

  1130.         <h2>Un tweet révolutionne la transmission de l’information</h2>

  1131.         <p>« <em>Il y a un avion dans l’Hudson.</em> » Le 15 janvier 2009, un avion amerrit d’urgence sur la rivière qui longe Manhattan. Sur l’un des ferrys alentour, <a target="_blank" href="https://www.lemonde.fr/pixels/article/2019/01/15/il-y-a-un-avion-dans-l-hudson-il-y-a-dix-ans-un-tweet-revolutionnait-la-transmission-de-l-information_5409381_4408996.html">Janis Krums prend une photo avec son iPhone</a>, qu’il publie sur Twitter – un geste encore relativement rare à l’époque. L’image fera le tour du monde, grillant au passage la politesse aux médias traditionnels, ahuris.</p>

  1132.     </div>

  1133. </div>

  1134. 

  1135. <div class="article">

  1136.     <div class="image no-overlap">

  1137.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image28.gif" alt=""></figure>

  1138. </div>

  1139.     <div class="content">

  1140.         <div class="date">Février</div>

  1141.         <h2>Facebook introduit le bouton « j’aime »</h2>

  1142.         <p>Le petit pouce bleu dépasse vite les frontières de Facebook pour s’inviter sur d’innombrables sites – et récupérer, au passage, des données sur les internautes qui les fréquentent. On « like » la dernière vidéo de Beyoncé comme on « like » des images d’ours polaires en détresse. Pour remédier à ce souci, Facebook ajoutera en 2016 <a target="_blank" href="https://www.lemonde.fr/pixels/article/2016/02/24/triste-grrr-j-adore-facebook-deploie-des-alternatives-au-bouton-j-aime_4870924_4408996.html">d’autres boutons de réaction</a> : énervé, triste, surpris, mort de rire et cœur.</p>

  1143.     </div>

  1144. </div>

  1145. 

  1146. </section>

  1147. 

  1148. <section class="date-2010"><div class="date-title">2010</div>

  1149. 

  1150. <div class="article">

  1151.     <div class="image no-overlap">

  1152.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image33-min.png" alt=""></figure>

  1153. </div>

  1154.     <div class="content">

  1155.         <div class="date">25 juillet</div>

  1156.         <h2>WikiLeaks publie des documents militaires américains secrets</h2>

  1157.         <p>C’est le premier gros coup médiatique de l’organisation cofondée par Julian Assange, qui met en ligne, en lien avec des médias comme le <em>New York Times</em>, le <em>Guardian</em> ou encore <em>Le Monde</em> des dizaines de milliers de documents secrets de l’armée américaine.</p>

  1158.     </div>

  1159. </div>

  1160. 

  1161. </section>

  1162. 

  1163. <section class="date-2011"><div class="date-title">2011</div>

  1164. 

  1165. <div class="article">

  1166.     <div class="image no-overlap">

  1167.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image32-min.jpg" alt=""><figcaption>Place Tahrir au Caire, le 6 février 2011. AFP PHOTO/MOHAMMED ABED </figcaption></figure>

  1168. </div>

  1169.     <div class="content">

  1170.         <div class="date">Printemps</div>

  1171.         <h2>Les réseaux sociaux, témoins et moteurs du « printemps arabe »</h2>

  1172.         <p>Le Web, et surtout les réseaux sociaux comme Facebook et Twitter, <a target="_blank" href="https://www.lemonde.fr/idees/article/2017/10/14/comment-internet-a-fait-les-printemps-arabes_5201063_3232.html">ont joué un rôle dans les révoltes du monde arabe</a>. Permettant la diffusion d’informations en contournant la censure, ils ont aussi été un espace d’organisation des protestations.</p>

  1173.     </div>

  1174. </div>

  1175. 

  1176. <div class="article">

  1177.     <div class="content">

  1178.         <div class="date">Juin</div>

  1179.         <h2>Lancement de Twitch</h2>

  1180.         <p>D’abord baptisé Justin.tv, ce site de streaming sert aujourd’hui principalement à diffuser des parties de jeux vidéo en direct. Extrêmement populaire, notamment auprès des adolescents et jeunes adultes, il est racheté en 2014 par Amazon et continue, aujourd’hui encore, son ascension. En février 2019, des ministres français sont venus <a target="_blank" href="https://www.lemonde.fr/pixels/article/2019/02/18/grand-debat-dix-ministres-seront-mardi-en-direct-sur-twitch-la-plate-forme-de-diffusion-de-jeux-video_5424997_4408996.html">y porter les idées du gouvernement</a> dans le cadre du grand débat national voulu par Emmanuel Macron.</p>

  1181.     </div>

  1182. </div>

  1183. 

  1184. </section>

  1185. 

  1186. <section class="date-2012"><div class="date-title">2012</div>

  1187. 

  1188. <div class="article">

  1189.     <div class="image no-overlap">

  1190.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image29.jpg" alt=""></figure>

  1191. </div>

  1192.     <div class="content">

  1193.         <div class="date">18 janvier</div>

  1194.         <h2>Mobilisation contre les lois SOPA et PIPA</h2>

  1195.         <p>Ces deux projets de loi américains durcissant la répression contre le téléchargement illégal ont été décriés, car considérés comme une façon de censurer Internet. Le 18 janvier, Wikipédia a fermé pour vingt-quatre heures et d’autres énormes sites ont participé à la mobilisation. Ces lois sont finalement tombées aux oubliettes.</p>

  1196.     </div>

  1197. </div>

  1198. 

  1199. <div class="article">

  1200.     <div class="content">

  1201.         <div class="date">4 octobre</div>

  1202.         <h2>Facebook franchit le cap du milliard d’utilisateurs actifs</h2>

  1203.         <p>Un <a target="_blank" href="https://www.lemonde.fr/technologies/article/2012/10/04/facebook-franchit-la-barre-du-milliard-d-utilisateurs_1770255_651865.html">chiffre considérable</a>, d’autant plus qu’il ne s’agit pas des utilisateurs inscrits, mais des utilisateurs actifs – c’est-à-dire qui se connectent au moins une fois par mois à Facebook.</p>

  1204.     </div>

  1205. </div>

  1206. 

  1207. <div class="article">

  1208.     <div class="image no-overlap">

  1209.         <div class="video-responsive">

  1210.             <iframe width="560" height="315" src="https://www.youtube.com/embed/9bZkp7q19f0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

  1211.         </div>

  1212.     </div>

  1213.     <div class="content">

  1214.         <div class="date">21 décembre</div>

  1215.         <h2>Gangnam Style devient la première vidéo à franchir le cap du milliard de vues</h2>

  1216.         <p>Le clip de cette chanson, signée du Sud-Coréen Psy, devient un tube international grâce à YouTube. Elle cumule aujourd’hui plus de 3 milliards de visionnages. La vidéo actuellement la plus vue est un autre clip, celui de la chanson Despacito, avec plus de 6 milliards de visionnages.</p>

  1217.     </div>

  1218. </div>

  1219. 

  1220. </section>

  1221. 

  1222. <section class="date-2013"><div class="date-title">2013</div>

  1223. 

  1224. <div class="columns">

  1225.     <div class="article red">

  1226.         <div class="image no-overlap">

  1227.             <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image30.jpg" alt=""><figcaption>PERETZ PARTENSKY / CC BY 2.0</figcaption></figure>

  1228. </div>

  1229.         <div class="content">

  1230.             <div class="date">11 janv.</div>

  1231.             <h2>Mort d’Aaron Swartz</h2>

  1232.             <p>Le Web ne serait pas tout à fait le même sans <a target="_blank" href="https://www.lemonde.fr/pixels/article/2017/03/23/quatre-ans-apres-son-suicide-l-esprit-d-aaron-swartz-plane-toujours-sur-le-web_5099539_4408996.html">ce génie américain</a>, qui a participé à l’émergence de Reddit, des licences Creative Commons, du RSS et s’est battu pour les libertés numériques. Poursuivi par le FBI pour avoir téléchargé en masse des articles scientifiques issus d’une plate-forme payante, il s’est donné la mort en 2013.</p>

  1233.         </div>

  1234.     </div>

  1235. 

  1236.     <div class="article purple">

  1237.         <div class="content">

  1238.             <div class="date">5 juin</div>

  1239.             <h2>Edward Snowden révèle un système de surveillance de masse du Web</h2>

  1240.             <p>Cet ancien sous-traitant de la NSA révèle, avec le Guardian et le Washington Post, <a target="_blank" href="https://www.lemonde.fr/pixels/article/2015/06/05/deux-ans-apres-snowden-ce-qui-a-change-pour-la-surveillance-de-masse_4648014_4408996.html">l’ampleur de la surveillance exercée par les Etats-Unis et leurs alliés</a> sur les internautes. Il vit, depuis, réfugié en Russie.</p>

  1241.         </div>

  1242.     </div>

  1243. 

  1244.     <div class="article blue">

  1245.         <div class="content">

  1246.             <div class="date">2013</div>

  1247.             <h2>Démantèlement de Silk Road, l’eBay de la drogue</h2>

  1248.             <p>Premier gros coup dur pour le Dark Web : le site Silk Road, supermarché de la drogue en ligne, est démantelé <a target="_blank" href="https://www.lemonde.fr/pixels/article/2014/09/09/comment-le-fbi-a-fait-tomber-silk-road_4484272_4408996.html">après une longue enquête du FBI</a>. Son fondateur a été <a target="_blank" href="https://www.lemonde.fr/pixels/article/2017/06/01/le-fondateur-de-silk-road-le-supermarche-de-la-drogue-definitivement-condamne-a-la-prison-a-vie_5137343_4408996.html">condamné en 2017 à la prison à vie</a> et quelques agents fédéraux <a target="_blank" href="https://www.lemonde.fr/pixels/article/2015/10/21/un-agent-federal-condamne-dans-l-affaire-silk-road-le-supermarche-de-la-drogue-en-ligne_4793886_4408996.html">ont été, depuis, éclaboussés, eux aussi, par l’affaire.</a></p>

  1249.         </div>

  1250.     </div>

  1251. </div>

  1252. 

  1253. </section>

  1254. 

  1255. <section class="date-2014"><div class="date-title">2014</div>

  1256. 

  1257. <div class="article cyan">

  1258.     <div class="content">

  1259.         <div class="date">Sept.</div>

  1260.         <h2>1 milliard de sites Web</h2>

  1261.         <p>Tim Berners-Lee <a target="_blank" href="https://twitter.com/timberners_lee/status/511988109211627520">annonce</a> que la barre du milliard de sites Web a été franchie.</p>

  1262.     </div>

  1263. </div>

  1264. 

  1265. </section>

  1266. 

  1267. <section class="date-2015"><div class="date-title">2015</div>

  1268. 

  1269. <div class="article green">

  1270.     <div class="content">

  1271.         <div class="date">13 nov.</div>

  1272.         <h2>Attentats en région parisienne, les autorités haussent le ton face aux plates-formes</h2>

  1273.         <p>L’utilisation par des djihadistes de grands réseaux sociaux comme Facebook ou Twitter pour recruter et diffuser leur propagande préoccupe les gouvernements de plusieurs pays occidentaux, qui menacent de légiférer.</p>

  1274.     </div>

  1275. </div>

  1276. 

  1277. </section>

  1278. 

  1279. <section class="date-2016"><div class="date-title">2016</div>

  1280. 

  1281. <div class="article yellow">

  1282.     <div class="content">

  1283.         <div class="date">8 nov.</div>

  1284.         <h2>Fin d’une campagne présidentielle américaine marquée par des tentatives d’ingérence</h2>

  1285.         <p>Le Kremlin a exploité les réseaux sociaux comme Facebook pour influencer l’électorat américain. La victoire de Donald Trump met aussi en lumière <a target="_blank" href="https://www.lemonde.fr/pixels/article/2018/04/24/comment-les-reseaux-sociaux-accentuent-l-enfermement-dans-ses-idees_5289874_4408996.html">l’effet de « <em>bulle de filtre</em> »</a> : les utilisateurs y sont enfermés par des algorithmes qui leur proposent des contenus conformes à leurs idéologies.</p>

  1286.     </div>

  1287. </div>

  1288. 

  1289. </section>

  1290. 

  1291. <section class="date-2017"><div class="date-title">2017</div>

  1292. 

  1293. <div class="article orange">

  1294.     <div class="content">

  1295.         <div class="date">27 juin</div>

  1296.         <h2>Facebook passe la barre des 2 milliards d’utilisateurs actifs</h2>

  1297.         <p>Sur 7,5 milliards d’humains, <a target="_blank" href="https://www.lemonde.fr/pixels/article/2017/06/27/facebook-passe-la-barre-des-2-milliards-d-utilisateurs_5152063_4408996.html">c’est pas mal.</a></p>

  1298.     </div>

  1299. </div>

  1300. 

  1301. </section>

  1302. 

  1303. <section class="date-2018"><div class="date-title">2018</div>

  1304. 

  1305. <div class="article">

  1306.     <div class="image no-overlap">

  1307.         <figure><img src="//s1.lemde.fr/mmpub/edt/zip/2019/03/13/123823523-50d37b293d925f932d6b69d8103b1583689f38fb/images/articles/image31.jpg" alt=""><figcaption>NDREW HARNIK / AP</figcaption></figure>

  1308. </div>

  1309.     <div class="content">

  1310.         <div class="date">10 avril</div>

  1311.         <h2>Le patron de Facebook est entendu par le Congrès américain</h2>

  1312.         <p>Mark Zuckerberg <a target="_blank" href="https://www.lemonde.fr/pixels/article/2018/04/11/face-aux-senateurs-americains-mark-zuckerberg-assure-ne-pas-etre-hostile-a-une-regulation-de-l-internet_5284142_4408996.html">a dû s’expliquer</a> après <a target="_blank" href="https://www.lemonde.fr/pixels/video/2018/03/23/affaire-cambridge-analytica-pourquoi-c-est-grave-pour-facebook-et-ses-utilisateurs_5275633_4408996.html">le scandale Cambridge Analytica</a>. Plusieurs médias américains ont révélé, quelques semaines plus tôt, que les données de plus de 80 millions d’utilisateurs de Facebook avaient été indirectement aspirées par cette entreprise spécialiste de l’influence politique et proche de Donald Trump.</p>

  1313.     </div>

  1314. </div>

  1315. </section>

  1316.   </article>

  1317. </section>

  1318. 

  1319. 

  1320. <nav id="jumpto">

  1321.   <p>

  1322.     <a href="/david/blog/">Accueil du blog</a> |

  1323.     <a href="https://www.lemonde.fr/pixels/visuel/2019/03/13/trente-ans-d-innovations-de-scandales-et-de-memes-une-chronologie-du-web_5435444_4408996.html#date-2004">Source originale</a> |

  1324.     <a href="/david/stream/2019/">Accueil du flux</a>

  1325.   </p>

  1326. </nav>

  1327. 

  1328. <footer>

  1329.   <div>

  1330.     <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">

  1331.     <p>

  1332.       Bonjour/Hi!

  1333.       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>

  1334.       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>).

  1335.     </p>

  1336.     <p>

  1337.       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>.

  1338.     </p>

  1339.     

  1340.     <p>

  1341.       Voici quelques articles choisis :

  1342.       <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,

  1343.       <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,

  1344.       <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,

  1345.       <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,

  1346.       <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,

  1347.       <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,

  1348.       <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,

  1349.       <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,

  1350.       <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,

  1351.       <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,

  1352.       <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,

  1353.       <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,

  1354.       <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,

  1355.       <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,

  1356.       <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,

  1357.       et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>

  1358.     </p>

  1359.     <p>

  1360.       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>.

  1361.     </p>

  1362.     <p>

  1363.       Je ne traque pas ta navigation mais mon

  1364.       <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>

  1365.       conserve des logs d’accès.

  1366.     </p>

  1367.   </div>

  1368. </footer>

  1369. <script type="text/javascript">

  1370.   ;(_ => {

  1371.     const jumper = document.getElementById('jumper')

  1372.     jumper.addEventListener('click', e => {

  1373.       e.preventDefault()

  1374.       const anchor = e.target.getAttribute('href')

  1375.       const targetEl = document.getElementById(anchor.substring(1))

  1376.       targetEl.scrollIntoView({behavior: 'smooth'})

  1377.     })

  1378.   })()

  1379. </script>