davidbgk
/
larlet-fr-david-cache
关注 1
点赞 0
派生 0
代码 版本发布 0 动态
A place to cache linked articles (think custom and personal wayback machine)
您最多选择25个主题 主题必须以字母或数字开头，可以包含连字符 (-)，并且长度不得超过35个字符
186 提交
1 分支
目录树: 5801502227
分支列表 标签列表
${ item.name }
创建分支 ${ searchTerm }
从 '5801502227'
${ noResults }
larlet-fr-david-cache/cache/6fc70f42971abed02d23097f074.../index.html

index.html 24KB
原始文件 Blame 文件历史

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539 
  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>Les technos du Web sémantique ont-elles tenu leurs promesses ? (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="http://www.lespetitescases.net/les-technos-du-web-semantique-ont-elles-tenu-leurs-promesses">

  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.   Les technos du Web sémantique ont-elles tenu leurs promesses ? (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="http://www.lespetitescases.net/les-technos-du-web-semantique-ont-elles-tenu-leurs-promesses">Source originale du contenu</a></h3>

  463.     <p>J’ai commencé à <strong><a href="http://www.lespetitescases.net/comprendre-le-principe-du-web-semantique-et-de-rdf">m’intéresser aux technologies du Web sémantique en 2005</a></strong> et j’ai fait <a href="https://archivesic.ccsd.cnrs.fr/sic_00137230">ma première communication</a> à ce sujet en 2006 lors de la <a href="http://www.allc-ach2006.colloques.paris-sorbonne.fr/AllcProgramme.htm">conférence Digital Humanities à Paris</a>. J’ai eu l’occasion de <a href="https://finerollshenry3.org.uk/redist/pdf/presentationAC.pdf">les</a> tester <a href="http://www.cidoc-crm.org/sites/default/files/vieira-ciula.pdf">grandeur nature</a> dès 2007 pour un <a href="https://finerollshenry3.org.uk/home.html">projet</a> mené par le CCH du King’s college, mais c’est au cours du <strong>projet <a href="http://www.bnf.fr/fr/professionnels/spar_systeme_preservation_numerique.html">SPAR de la Bibliothèque nationale de France</a> à partir de 2008</strong> que j’ai véritablement commencé à toucher du doigt <a href="https://pdfs.semanticscholar.org/aa05/70a2fec97b32b44f2ca69b9c9ceadfe122b1.pdf">les formidables promesses de ces technologies</a> ainsi que leurs limites, déjà… Entre 2008 et 2014, j’ai eu l’occasion de les déployer dans différents contextes pour répondre à des cas d’usage divers : <a href="http://data.culture.fr/thesaurus/page/servicesProducteurs/vocabulaires?serviceProducteur=Service+interminist%C3%A9riel+des+Archives+de+France">exposition des données</a>, <a href="https://www.rechercheisidore.fr/">récupération de données encodées au sein des pages Web</a>, <a href="http://ifla2014-satdata.bnf.fr/pdf/5_iflalld2014_ppt_electre_antidot.pdf">décloisonnement de silos internes et mise en cohérence de données</a>, <a href="http://www.rechercheisidore.fr">enrichissement </a><a href="http://www.mucem.org/collections/explorez-les-collections">de</a> <a href="http://www.vallesiana.ch">données </a>et <a href="http://labs.antidot.net/museesdefrance/">mashup</a>… J’ai œuvré à leur diffusion, du moins j’ai essayé, à <a href="http://www.lespetitescases.net/index355">travers ce blog</a> ou <a href="http://www.electrelaboutique.com/ProduitECL.aspx?ean=9782765414179">ailleurs</a>, et effectué quantité de formations sur le sujet en direction de <a href="https://www.inria.fr/actualite/agenda/document-numerique">publics </a><a href="https://fr.slideshare.net/AntidotNet/rdfa-comment-insuffler-un-peu-dintelligence-une-page-web">très </a><a href="https://www.huma-num.fr/formations/anf-websem-2014/programme">variés</a>. Pour résumer, j’y voyais alors <a href="https://www.lespetitescases.net/logique-applicative-contre-logique-informationnelle-des-si"><strong>le moyen de déployer un système</strong></a>  <a href="https://www.slideshare.net/AntidotNet/linked-enterprise-data-ou-comment-disposer-dune-vue-consolide-des-donnes">d’information orienté données</a><strong> et plus uniquement processus</strong> et d’une manière générale de renverser ce primat dans la manière d’aborder le développement d’une application informatique.</p>

  464. 

  465. <p><a href="http://www.lespetitescases.net/bilan-reflexion-sur-la-gestion-des-donnees-numeriques">Comme je l’ai déjà expliqué</a>, à l’issue de cette période, <strong>j’étais très dubitatif sur l’intérêt d’utiliser ces technologies</strong>. Dans la mesure où j’étais conscient de leurs apports mais aussi de leurs limites, elles étaient toujours <strong>présentes mais sans être jamais au cœur de ma réflexion à l’Ina</strong>, du moins directement. L’expérience accumulée et les bénéfices de ces technologies nourrissaient néanmoins des pans entiers de <a href="http://www.lespetitescases.net/comment-mettre-la-donnee-au-coeur-du-si">la stratégie que nous étions en train de déployer</a> sans même que j’en sois totalement conscient. </p>

  466. 

  467. <p>C’est peut-être la raison pour laquelle j’ai continué de les enseigner aussi bien dans le <a href="http://www.chartes.psl.eu/fr/cursus/master-technologies-numeriques-appliquees-histoire">Master « Technologies numériques appliquées à l’histoire »</a> de l’Ecole nationale des chartes que lors de <a href="https://www.ina-expert.com/formation-professionnelle/comprendre-le-web-semantique-et-le-web-de-donnees.html">formations pour Ina Expert</a>, parfois, il faut bien l’avouer, en traînant un peu les pieds. J’ai fait évoluer ma présentation en replaçant ces <a href="https://www.ina-expert.com/formation-professionnelle/comprendre-l-univers-des-datas.html">technologies et leur intérêt dans le contexte plus large du Big Data, de l’Open Data et maintenant de l’intelligence artificielle</a>. Finalement, je ne me suis jamais résolu à les abandonner totalement, <strong>partant du principe qu’une technologie ne disparaît pas, mais trouve sa juste place par rapport aux autres</strong>. De plus, je reste convaincu qu’elles restent<span class="c15 c5"> la meilleure technologie pour assurer l'interopérabilité des données, mais jusqu’à quel point en a-t-on vraiment؜ besoin ?</span></p>

  468. 

  469. <p>Plusieurs fois, à la lecture d’un article ou d’un tweet qui vantaient les mérites de ces technologies et du Linked Open Data ou web de données, j’ai voulu écrire pourquoi il fallait rester prudent (voire plus…), encore récemment autour de la <a href="https://teamopendata.org/t/les-donnees-ouvertes-au-musee/747">question de leurs usages au sein des musées</a>. Je l’ai même dit en <a href="http://www.dicen-idf.org/evenement/web-de-donnees/">conférence</a>, parfois, de manière abrupte, à la hauteur des désillusions que j’avais vécues. Aujourd’hui, sans avoir réussi à s’imposer largement, ces technologies ont indubitablement fait avancer notre réflexion sur la question de l’interopérabilité et force est de constater que certaines initiatives ont réussi à sortir du lot et à valider certains usages. Après avoir <strong>laissé passer le « ravin de la désillusion » et au moment où ces technologies semblent atteindre le plateau de la productivité du « </strong><strong><a href="https://fr.wikipedia.org/wiki/Cycle_du_hype">Hype cycle</a></strong><strong> »</strong>, c’est le bon moment de dresser un bilan.</p>

  470. 

  471. <p><span><img alt="" src="http://www.lespetitescases.net/files/image22.png" title=""/></span><br/><a href="https://commons.wikimedia.org/wiki/File:Gartner_Hype_Cycle.svg">Hype Cycle du Gartner</a>, Jérémy Kemp, CC-BY-SA</p>

  472. 

  473. <p>Alors, peut-être pour la dernière fois sur ce blog, je vous propose une plongée dans les entrailles des technologies du Web sémantique pour étudier quels en sont finalement <strong>les apports et les limites </strong>et<strong> l’écart entre les promesses et la réalité. </strong>Pour rendre les choses un peu plus digeste à lire et à appréhender, j’ai séparé ce bilan en quatre billets :</p>

  474. 

  475. <ul><li>Une introduction (le présent billet)&nbsp;;</li><li><a href="http://www.lespetitescases.net/les-technologies-du-web-semantique-entre-theorie-et-pratique">Les technologies du Web sémantique, entre théorie et pratique</a>&nbsp;;</li><li><a href="http://www.lespetitescases.net/au-dela-des-limites-que-reste-t-il-concretement-du-web-semantique">Au delà des limites, que reste-t-il concrètement du Web sémantique&nbsp;?</a></li><li><a href="http://www.lespetitescases.net/reflexions-et-questions-autour-du-web-semantique">Réflexions et questions autour du Web sémantique</a>.</li></ul>

  476.   </article>

  477. </section>

  478. 

  479. 

  480. <nav id="jumpto">

  481.   <p>

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

  483.     <a href="http://www.lespetitescases.net/les-technos-du-web-semantique-ont-elles-tenu-leurs-promesses">Source originale</a> |

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

  485.   </p>

  486. </nav>

  487. 

  488. <footer>

  489.   <div>

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

  491.     <p>

  492.       Bonjour/Hi!

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

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

  495.     </p>

  496.     <p>

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

  498.     </p>

  499.     

  500.     <p>

  501.       Voici quelques articles choisis :

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  518.     </p>

  519.     <p>

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

  521.     </p>

  522.     <p>

  523.       Je ne traque pas ta navigation mais mon

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

  525.       conserve des logs d’accès.

  526.     </p>

  527.   </div>

  528. </footer>

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

  530.   ;(_ => {

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

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

  533.       e.preventDefault()

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

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

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

  537.     })

  538.   })()

  539. </script>