JSON-LD 簡介

Tags
My-slides
Date
Aug 24, 2014
https://www.slideshare.net/bobo52310/json-ldby-bobo

Json ld 簡介 [slides]

1. JSON-LD簡介 @ KKBOX Presented by Bobo
2. 大綱 • 前情提要 • 現今網路遇到的問題 • 語義網 (Semantic Web) • 結構化標記(Structured Data Markup)的方法 • RDF(Resource Description Framework) • JSON-‐LD • 簡介 • 實作的套件 • 驗證與測試的工具
3. 現今網路遇到的問題 • 資訊爆炸! • 巨量資料不斷地在網路上產生 多到看不完啦!
4. 搜尋引擎 • 幫忙過濾一些資訊 • 可是… 其實搜尋引擎也看不懂這些文件…|| 這些資訊好像很有趣,但是我看不懂 耶…
5. 如果能讓電腦看得懂文件 • 可以了解語意內涵,而能進一步替使用者作更精確的 資料判斷與處理。 • 許多的知識與智慧將有更好的連結與應用 • 以及更多新的應用可能! • 電腦,巨量資料就交給你看囉~(人類:我下班看電影去XD)
6. 語義網(Semantic Web) • WWW 之父 Tim Berners-‐Lee 指出下一代網路的可能性 • Web 3.0 Concepts • 跟電腦約定好溝通的語言,並把資料作適當標記 • 讓電腦自己看得懂這些巨量資料 • 許多知識與智慧將有更好的連結與應用
7. 有哪些好處?(以搜尋為例) • Google 真正“知道”更多關於這些資料,更有效整合相 關的服務,以及更多應用的可能 • Website 提高 SEO,帶來更多且精準的流量,以及更多 應用的可能 • User 獲得更優質的體驗,搜尋有更佳的深度與廣度, 以及更多應用的可能
8. 首先要把資料做個標記 • 結構化標記(structured data markup)的方法 : • Microformats:漸漸非主流,架構在 XHTML 標準上且使用 CSS的 class 來標記內容 • RDFa: HTML5 支援, 主流搜尋引擎最愛 • Open Graph:Facebook 所提出的規範 • Microdata:HTML5支援, 主流搜尋引擎最愛, 較簡單 • JSON-‐LD:最新現在最夯,待會跟你介紹
9. 結構化標記的方法之一 Open Graph • Facebook 使用,透過 Og meta tag 讓 FB 可以解析此網 頁的結構化標記。 • 常見應用:Facebook 插件(按讚、分享...等) 。
10. 結構化標記的方法(續) • 哪一種方法比較簡潔明瞭呢?
11. 各家山頭林立,誰來一統江湖? • 語義網的概念默默地躺在理論知識殿堂許久 • 直到這幾年… 某個盒子被打開 • 冒出許多大傢伙都想要建立想像中的語義網…
12. Google 知識圖譜
13. Facebook • Open Graph protocol • Graph Search • 下列句子,現今有哪個搜尋引擎看得懂你的意思? • Music my friends like. • People who like Cycling. • People who like Cycling and live in Taipei. • 試試看 Facebook 的Graph Search Demo 好像很厲害耶!
14. Facebook表示 • 閃開!~讓專業的來! HHVM 也是~ 冏 • 好像也只有 FB 有這個本錢這樣搞 • 難道未來網路規範要被這傢伙統一了嗎? 別怕…我們還有…
15. • 強大到連 Microsoft 都得…IE表示…
16. W3C推薦 RDF (Resource Description Framework) • 一個用於描述網路資源的框架 • 資源包含:圖片、文章、活動、人物、....等 • 被設計用來給電腦閱讀與理解 • 規範了資料的模型(Model)與語法(Syntax ) • 網路圖譜概念,設計用來整合不同資料來源
17. W3C推薦 (續) RDF (Resource Description Framework) • 最新版 RDF1.1 (2014-‐02-‐25,與上一版隔了10年) • 把資源連起來就是 Linked Data (LD, 鏈結資料) • 語法格式有:RDFa, RDF/XML, N -‐Triples, Turtle...等 • 在 RDF1.1 還新增了 JSON-‐LD 格式 (就是今天介紹的主 角啦)
18. 好多新名詞喔 來複習一下
19. • 用我們熟悉的 JSON 物 件 { } 把 LD 包起來就是 • 連圖示也那麼優雅簡單! 願景 規範 標記資源 資料交換規格
20. 今日重要名詞複習 • Linked Data (LD, 鏈結資料) 把這些電腦看得懂有意義的東西(資源)連結起來 • 使用 URIs(Uniform Resource Identifier)作為名稱來標示物件。 • 使用 HTTP 做為查詢及傳送URI的機制,使人或電腦可以查詢特 定URI所代表之物件的相關資訊。 • 可以連結到其他 URIs 使其可以發掘更多的資訊 • JSON-‐LD 最新最夯的結構化標記方法,讓電腦讀的懂你的資料 Data is messy and disconnected. JSON-‐LD organizes and connects it, creating a better Web.
21. 所以 JSON-‐LD 是? • 一種輕量化的 Linked Data 格式 • 使用 JSON 格式來表示 Linked Data • 但是我只聽過 JSON 耶…沒關係,就是你熟悉的JSON 再加上 Linked Data 就是 • 講完了…
22. JSON-‐LD 很重要 • 是 RDF 1.1 最新支援的結構化資料方法 • Google, Microsoft...等,旗下各項服務也開始支援 • Drupal 8 拋棄 RDFa 等其他格式開始支援 JSON-‐LD • 多種結構化資料格式可以被正規化為 JSON-‐LD • 與目前 API 交換格式的主流 JSON 完全相容 • 才進得去某某 box 公司(誤)
23. JSON-‐LD帶來的好處 • 降低網站 debug 困難,原本 RDFa/Microdata 嵌在 HTML內,而 JSON 的 key/value 閱讀相對容易。 • 不需要特別學習 RDFa/Microdata 屬性內容與標記語法 • 結構化資料可以儲存在 Database 例如 MongoDB • 完全相容現有的 JSON 程式,確保現有的 parsers 和 libraries 可以繼續使用
24. JSON-‐LD範例 • 這是一個 JSON-‐LD,描述一個”人”的資源 • 接下來讓我們看看如何將 JSON 描述成 JSON-‐LD
25. 1.單純的 JSON 形式的描述 • 這物件是在描述甚麼呢? • 因為有看到人名,我們很容易直覺判定這個東西是一個人 • 缺點:但機器就沒有這個天分了,這樣的格式描述有些不 足且模糊不清
26. 2.使用 IRIs 來作為 key 值定義格式, 並且使用 schema.org 字彙庫 • 其中 @id 關鍵字表示這個值是 IRI 標記 • 缺點:這樣的描述有些冗長...有比較偷懶的方法嗎? • IRI (Internationalized Resource Identifiers)為支援Unicode 的 URI (僅支援 ASCII)
27. 3.加入 Context 前後文的概念 • 使用前後文的概念,先將我們要用到的部分做個語意環境 定義 • 缺點:還是有些冗長,而且人這個東西應該已經定義過了 吧?
28. 4.使用參照來定義人這個東西 • 簡潔明瞭,請對照 1.單純 JSON 形式來看,我們在此 使用了 @context 來作為參照 • 如此即可在不改變原有 JSON 格式之下,使 JSON 文件 解析為 JSON-‐LD。
29. 補充:schema.org 共用字彙庫 • 由 Google、Yahoo、Bing 等搜尋龍頭共同組成 • 建立描述網頁資料的常用詞彙和標記語法,藉此改善網路 瀏覽體驗 • 鼓勵網站管理員在 HTML 內容上使用這些詞彙與 JSON-‐LD 格式進行標記 • 讓搜尋引擎、Gmail等服務更容易了解網頁內容 • Microdata 和 JSON-‐LD 皆使用此詞彙 • 搜尋引擎較愛,但如果要給 FB 用記得加上 og meta tag
30. PHP實作 JSON-‐LD 的套件 • PHP implementation of a JSON-‐LD Processor and API • JSON-‐LD processor for PHP • Drupal JSON-‐LD Extend
31. 驗證與測試 JSON-‐LD 的工具 • JSON-‐LD Playground JSON-‐LD 格式檢驗工具 • Google 結構化資料測試工具、驗證 Emai 標記 • RDF Translator 多種格式轉換的工具,包含 RDFa, microdata, JSON-‐LD, RDF/XML, RDF/JSON 等 • Microdata/JSON-‐LD sniffer Chrome 插件用來檢測該頁 面是否有 Microdata 或 JSON-‐LD,有的話會顯示圖示 來提醒。
32. 參考資料: • What’s New in RDF 1.1 by W3C • JSON-‐LD 1.0 by W3C • JSON-‐LD: JSON for Linked Data by Gregg Kellogg • JSON-‐LD: Linked Data for Web Apps by Gregg Kellogg • JSON-‐LD and MongoDB by Gregg Kellogg • JSON-‐LD and Why I Hate the Semantic Web • Structured Data on the Web • json-‐ld.org
33. THANK YOU~ 有這個東西嗎?? (驚) @ KKBOX Presented by Bobo Q A Let’s music !

Loading Comments...