Web語義化

學術屆將web語義化稱爲Web3.0的核心，目標是將當前的網頁提升爲計算機能夠“理解”和處理的網頁。 核心思想是標註網頁對象使其對應本體中的實體，並通過邏輯等手段進行自動推理。 作用在於更好整合網絡上的資源，使計算機能夠處理分佈於不同位置的信息，自動產生問題的解決方案

簡言之，web語義化的目的是提高計算機和人對web代碼的可讀性。

網上的解釋很多，個人總結分三個階段比較容易理解。 1、原始的一些有實際含義的標籤定義。瀏覽器和W3C組織推出的如h1~h6、thead、ul、ol的HTML標籤，用於在Web頁面中組織對應的內容，如網頁標題、表頭、無序、有序列表，以達到更方便的協作及傳播互聯網內容。搜索引擎很好的利用了這些語義化標籤抓取內容，又鑑於搜索引擎的巨大流量推薦，Web前端不得不考慮SEO，從而兩者實現有益的循環，共同推進着語義化標籤的使用。

2、前端開發人員自定義的標籤。但Web的發展超乎想象，起初定義的HTML語義化標籤，不足以實現對Web頁面各個部分的功能或位置描述，所以Web前端人員利用HTML標籤的id和class屬性，進一步對HTML標籤進行描述，如對頁腳HTML標籤添加如id="footer"或者class="footer"的屬性（值），以“無聲”的方式在不同的前端程序員或者前後端程序員間實現交流。

3、在第二步的推動下結合新技術出現的一些標籤。W3C組織意識到了之前HTML版本的不足，推出的HTML5進一步推進了Web語義化發展，採用了諸如footer、section等語義化標籤，彌補了採用id="footer"或者class="footer"形式的不足，以更好的推動Web的發展。 正所謂：世上本沒有路，走的人多了，也便成了路。

什麼是語義化？其實簡單說來就是讓機器可以讀懂內容。

先隨便扯扯。對於當前的 Web 而言，HTML 是聯繫大多數 Web 資源的紐帶，也是內容的載體。在 Web 被剛剛設計出來的時候，Tim Berners-Lee 可能不會想到它現在會達到的規模以及深入到我們生活的那麼多方面。也許起初的想法很簡單：用來發布 Web 內容和資源的索引，方便人們查看。但是隨着 Web 規模的不斷擴大，信息量之大已經不在人肉處理的範圍之內了。這個時候人們開始用機器來處理 Web 上發佈的各種內容，搜索引擎就誕生了。再後來，人們又設計了各種智能程序來對索引好的內容作各種處理和挖掘。所以讓機器能夠更好地讀懂 Web 上發佈的各種內容就變得越來越重要。其實 HTML 在剛開始設計出來的時候就是帶有一定的「語義」的，包括段落、表格、圖片、標題等等，但這些更多地只是方便瀏覽器等 UA 對它們作合適的處理。但逐漸地，機器也要藉助 HTML 提供的語義以及自然語言處理的手段來「讀懂」它們從網上獲取的 HTML 文檔，但它們無法讀懂例如「紅色的文字」或者是深度嵌套的表格佈局中內容的含義，因爲太多已有的內容都是專門爲了可視化的瀏覽器設計的。面對這種情況，出現了兩種觀點：我們可以讓機器的理解能力越來越接近人類，人能看懂、聽懂的東西，機器也能理解；我們應該在發佈內容的時候，就用機器可讀的、被廣泛認可的語義信息來描述內容，來降低機器處理 Web 內容的難度（HTML 本身就已經是朝這個方向邁出的一小步了）。

<img data-rawheight="382" data-rawwidth="670" src="https://pic2.zhimg.com/01b4d93c152d2a9c2db734065be0f3f5_b.jpg" class="origin_image zh-lightbox-thumb" width="670" data-original="https://pic2.zhimg.com/01b4d93c152d2a9c2db734065be0f3f5_r.jpg">我畫的這個圖，意思是說，內容的語義表達能力和 AI 的智能程度決定了機器分析處理 Web 內容能力的高低。上面觀點 1 的方向是朝着人類水平的人工智能努力，而觀點 2 的方向正是萬維網創始人 Tim Berners-Lee 爵士提出的美好願景：語義網。語義網我就不多說了，簡單來說就是讓一切內容和包括對關係的描述都成爲 Web 上的資源，都可以由唯一的 URI 定義，語義明確、機器可讀。顯然，兩條路都的終極目標都很遙遠，第一條路技術上難以實現，而第二條路實施起來障礙太多。我認爲我們當前能夠看得見摸得着的 Web 語義化，其實就是在往第二條路的方向上，邁出的一小步，即對已經有的被廣泛認可的 HTML 標準做改進。我們剛開始意識到，我們必須迴歸內容本身，將內容本身的語義合理地表述出來，再爲不同的用戶代理設計不同的樣式描述，也就是我們說的內容與樣式分離。這樣我們在提供內容的時候，首先要做的就是將內容本身進行合理的描述，暫時不用考慮它的最終呈現會是什麼樣子。HTML 規範其實一直在往語義化的方向上努力，許多元素、屬性在設計的時候，就已經考慮瞭如何讓各種用戶代理甚至網絡爬蟲更好地理解 HTML 文檔。HTML5 更是在之前規範的基礎上，將所有表現層（presentational）的語義描述都進行了修改或者刪除，增加了不少可以表達更豐富語義的元素。爲什麼這樣的語義元素是有意義的？因爲它們被廣泛認可。所謂語義本身就是對符號的一種共識，被認可的程度越高、範圍越廣，人們就越可以依賴它實現各種各樣的功能。HTML5 並非 Web 語義唯一倚仗的規範，除了 W3C 和 WHATWG 外，還有其它的組織在爲擴展、標準化 Web 語義做着貢獻。只要有瀏覽器廠商、搜索引擎原意支持，它們的規範一樣可以成爲通用的基礎設施。例如 microformats 社區以及 http://Schema.org 上都有對 HTML 以及 Microdata（http://www.w3.org/TR/html5/microdata.html） 規範的擴展詞彙表，Google、Bing、Yahoo! 等搜索引擎以及各個主流瀏覽器都不同程度地接納了其中定義的語義擴展，並應用在了生產中。下面舉兩個 Google 應用擴展語義的例子。Google 的搜索結果，可以根據 microformats 的 hCard 語法從抓取的頁面識別出人物信息：<img data-rawheight="263" data-rawwidth="616" src="https://pic4.zhimg.com/f8ba9082973b5a7abcbfa969c02e3ce7_b.jpg" class="origin_image zh-lightbox-thumb" width="616" data-original="https://pic4.zhimg.com/f8ba9082973b5a7abcbfa969c02e3ce7_r.jpg">也可通過網頁內嵌的 Microdata 數據讀取作品評分等信息：<img data-rawheight="135" data-rawwidth="497" src="https://pic1.zhimg.com/3c5b54fb608597a098c13bac9a1b922c_b.jpg" class="origin_image zh-lightbox-thumb" width="497" data-original="https://pic1.zhimg.com/3c5b54fb608597a098c13bac9a1b922c_r.jpg">關於 HTML5 的各個元素語義的描述，我之前做過一份 slides，上面提到的例子都是那裏面的，也可以參考一下：Semantic HTML（http://justineo.github.com/slideshows/semantic-html/）。