為網(wǎng)頁內(nèi)容添加結(jié)構(gòu)和語義的hAtom微格式

發(fā)布時(shí)間：2010-01-01 18:13:16 作者：佚名

我們這次來討論hAtom微格式，這個(gè)微格式用來為網(wǎng)頁內(nèi)容添加結(jié)構(gòu)和語義從而使得網(wǎng)頁內(nèi)容或者局部內(nèi)容可以被廣播（syndication），比如博客日志或者新聞文章等。

來回顧一下我們之前討論過的微格式：rel-系列， XFN，hCard 和 hCalendar。

我們這次來討論hAtom微格式，這個(gè)微格式用來為網(wǎng)頁內(nèi)容添加結(jié)構(gòu)和語義從而使得網(wǎng)頁內(nèi)容或者局部內(nèi)容可以被廣播（syndication），比如博客日志或者新聞文章等。

歷史：Atom

hAtom微格式是建立在Atom XML同步格式基礎(chǔ)之上的。跟之前hCard和hCalendar不同，hCard和hCalendar都和傳統(tǒng)數(shù)據(jù)格式有著1:1的對(duì)應(yīng)關(guān)系，但是hAtom同Atom之間卻沒有這種直接的對(duì)應(yīng)關(guān)系。Atom是一個(gè)很穩(wěn)定的模型，能夠?yàn)閮?nèi)容廣播提供非常多的功能。而hAtom僅僅是提供必須的元素，因此更像是Atom的子集。由此說來，hAtom具有的屬性和子屬性也都是基于Atom原有的術(shù)語而來的。

微內(nèi)容（并不需要）廣播

盡管hAtom基于Atom，hAtom本身并不是一個(gè)廣播格式。hAtom的作者和編輯──David Janes──解釋說：

“… hAtom was never intended to be a “syndication format” nor to compete with Atom or RSS. It’s simply designed to describe the microcontent on webpages, such as blog posts. We used Atom because it provides a well-defined nomenclature for describing such elements.”（譯：hAtom從來都不是為了作為“廣播格式”存在，更不是為了同Atom或者RSS之間競爭。他就是用來描述網(wǎng)頁中的為內(nèi)容，比如博客日志。我們使用Atom是因?yàn)樗峁┝撕芎玫男g(shù)語可以描述這樣的元素。）

所以，hAtom不是專門為了那些需要廣播的網(wǎng)頁內(nèi)容的。不過，為了這篇文章的目的，我會(huì)在博客日志的基礎(chǔ)上討論，而博客日志通常是需要支持廣播的網(wǎng)頁內(nèi)容。

基礎(chǔ)知識(shí)

在討論hAtom細(xì)節(jié)之前，讓我們來看一下基礎(chǔ)的規(guī)則（同hCard和hCalendar類似）：

屬性和子屬性通過class值來表示
因?yàn)橥珹tom的關(guān)系，規(guī)范中的hAtom屬性和子屬性基本對(duì)應(yīng)Atom的元素
屬性和子屬性名稱大小寫敏感
“根”屬性不能和其他屬性或子屬性組合，因此<p class="hfeed author">是無效的

還是，對(duì)所有微格式適用：包含他們的標(biāo)記元素是什么不重要（雖然應(yīng)該是有效并且具有語義的）。Class的值（屬性或子屬性）決定了hAtom微格式。

Profile

如果您選擇使用hAtom，同樣應(yīng)該在網(wǎng)頁的<head>代碼中加上他的Profile說明：

對(duì)hCard和hCalendar，我提過使用組合Profile，可以覆蓋所有非提案微格式：

不過，hAtom是提案規(guī)范，他的Profile沒有涵蓋在組合Profile里面，所以，還是需要明確的指明他。如果您還引用組合Profile，可以簡單的添加hAtom Profile（W3C 允許多個(gè)profile值，使用空格隔開即可）：

示例：單一日志

背景信息差不多了，現(xiàn)在我們來看實(shí)際的hAtom，下面的hAtom信息是描述我的博客日志全文的：

<div class=”hentry”>
<h3 class=”entry-title”>Web Accessibility Is Important</h3>
<abbr class=”published” title=”2008-08-28T13:14:37-07:00″>Aug 28, 2008</abbr>
<p class="category"><a href="http://www.ablognotlimited.com/articles/category/commentaries/" rel=”tag”>Commentaries</a></p>
<p><a href="#commentForm" title="Post your own comment">Got something to say?</a></p>
<div class=”entry-content”>
<p>The National Federation of the Blind v. Target lawsuit was settled this past Wednesday on the following key terms:</p>
…
</div>
<dl>
<dt>Tags:</dt>
<dd><a href="http://www.ablognotlimited.com/articles/tag/accessibility/" rel=”tag”>accessibility</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/standards/" rel=”tag”>standards</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/web+design/" rel=”tag”>web design</a></dd>
</dl>
</div>

根屬性：hfeed

hAtom的根屬性是hfeed，他可以包含一個(gè)或者更多條目（在上面例子上，條目就是博客日志）。這個(gè)根屬性是可選的。如果沒有明確包含根屬性，默認(rèn)假設(shè)他已經(jīng)存在于頁面中了，上面的例子中就沒有包含根屬性。如果必要的話，頁面中可以包含多個(gè)hfeed。

必要屬性：hentry

每個(gè)條目必須包含在hentry屬性中。如之前提過的，可以應(yīng)用一個(gè)或多個(gè)hentry屬性。上面例子中，只有一個(gè)hentry是因?yàn)檫@個(gè)實(shí)現(xiàn)是應(yīng)用在顯示博客某一日志全文的頁面中。我會(huì)在文章后面討論如何使用多個(gè)條目。

hentry屬性包括了條目的所有信息。

必要子屬性：entry-title

entry-title是必需的子屬性之一，用來說明條目的題目。在上面例子中，我為<h3>應(yīng)用了entry-title屬性，因?yàn)樽鳛轭}目，把他放在“頭條”結(jié)構(gòu)中是具有一定語義信息的。

必要子屬性：author

author是另一條必需的子屬性，用來說明條目的作者。根據(jù)規(guī)范說米功能，包含在author子屬性中的內(nèi)容必須使用標(biāo)記上hCard的<address>元素。

注意：不要顯示作者名字

但是，也還有很多實(shí)際操作的例子中，發(fā)布者并不在意列舉出作者名字，包括我的博客。hAtom的規(guī)范默認(rèn)了這種情況并允許可以不在hentry屬性中包含作者信息，不過是在當(dāng)頁面本身已經(jīng)包括了hCard的信息，并含有指定class="author"子屬性的<address>元素。這個(gè)方案也在hAtom 的FAQ中作了解釋。

因?yàn)槲以谖宜许撁娴捻撃_中都包括了hCard實(shí)現(xiàn)，所以，我沒有在hAtom信息中包含author子屬性，這樣做是有效的。對(duì)于那些多作者協(xié)作的博客，如果他們不希望顯示作者名字，目前還沒有有效的方案。author必須出現(xiàn)在hentry屬性中。我可以想象使用CSS方案來取消顯示（display:none）可能也是可以接受的。

注意：address和hCard

上面的討論涉及到另外一個(gè)問題：實(shí)現(xiàn)hCard時(shí)使用<address>。

在第三部分討論中曾經(jīng)提到過，為hCard使用<address>元素只有在hCard是文檔擁有者時(shí)才有效。hCard的FAQ中也強(qiáng)烈建議不要在hCard不是文檔擁有者時(shí)候使用<address>。因此，如果hAtom的條目由不是文檔擁有者創(chuàng)作的話，<address>不是合適的語義元素。

這個(gè)問題目前還在討論中。目前的建議是取消<address>的限制。

必要子屬性：updated

updated子屬性也是必需的，他表明條目最后被修改和更新的日期/時(shí)間。這里也有需要注意的事情：如果updated子屬性沒有被定義，子屬性published將會(huì)用來表明日志更新的日期/時(shí)間。在上面的例子中，您會(huì)注意到我并沒有包含updated子屬性，不過使用了published。

可選子屬性：published

published是可選的子屬性，基本上同updated的語義是一致的，都是表明條目的更新時(shí)間。盡有的區(qū)別在于，published更傾向于描述條目第一次發(fā)布的時(shí)間，而updated可以是發(fā)布的時(shí)間或者是條目后來更新的時(shí)間。如果同時(shí)包含published和updated來描述條目的日期時(shí)間信息也是有效的：

在我的例子中，僅僅使用published就符合我的目的了，所以我選擇只使用他。

日期時(shí)間設(shè)計(jì)模式

對(duì)于updated和published，hAtom推薦使用的時(shí)間和日期格式跟我們之前討論的日期時(shí)間設(shè)計(jì)模式相同：

<abbr class=”published” title=”2008-08-28T13:14:37-07:00″>Aug 28, 2008</abbr>

該模式定義容器元素為<abbr>，在title屬性中指定機(jī)器可讀的日期/時(shí)間信息，而在內(nèi)容中指定人類可讀的日期/時(shí)間信息。而且，在title中包含的時(shí)間日期信息應(yīng)該遵循ISO 8601格式要求。

可選子屬性：entry-summary

entry-summary是可選的子屬性。他說明條目的摘要信息。這個(gè)子屬性可以在hentry中多次使用。在我的博客中，我沒有為文章生成這樣的摘要，所以我沒有提供這個(gè)子屬性的實(shí)現(xiàn)。

可選子屬性：entry-content

entry-content是另一個(gè)可選的子屬性，用來說明條目的全文內(nèi)容。在上面的例子中，所有的文章內(nèi)容都被包含在<div class="entry-content">元素中。同樣，可以在hentry中使用多次entry-content屬性。

可選：rel-bookmark

hAtom還定義了一個(gè)rel屬性值來說明條目的永久鏈接：bookmark。在第一部分中，我們討論了很多基于rel-的微格式，用來表明鏈接（<a>）和文檔之間的關(guān)系。rel-bookmark也是用來描述鏈接關(guān)系的，不過不能作為微格式單獨(dú)使用。必須作為hAtom的屬性存在，描述文檔內(nèi)容的永久鏈接。

使用hAtom，您可以簡單的在條目的永久鏈接上添加rel="bookmark"：

<a href="http://www.ablognotlimited.com/articles/web-accessibility-is-important/" rel=”bookmark”>Web Accessibility Is Important</a>

您可能會(huì)注意到，在我的例子中沒有提供永久鏈接。這是因?yàn)槲彝ǔＷ裱粭l規(guī)則：不在頁面中提供本文鏈接（Nielsen’s #10 of the Ten Most Violated Homepage Design Guidelines）。而且因?yàn)閞el-bookmark是可選的，所以我的實(shí)現(xiàn)是有效的。如果hentry沒有指明永久鏈接，那么就會(huì)缺省認(rèn)為本頁鏈接為條目永久鏈接。如果hentry中定義了id屬性，該值會(huì)被拼接到URL后面來為條目定義唯一值。

組合微格式來定義分類

之前我們在第一部分中討論過rel-tag 微格式。他用來添加到鏈接（<a>）) 說明網(wǎng)頁──或者網(wǎng)頁的局部內(nèi)容──是關(guān)于什么內(nèi)容的?；緛碚f，通過標(biāo)簽來組織/分類已經(jīng)在博客中廣泛使用。hAtom可以充分發(fā)揮rel-tag的作用，只需要在hfeed和hentry中做出實(shí)現(xiàn)：

在hfeed中包含指定rel="tag"的鏈接，但鏈接在hentry之外的，會(huì)被認(rèn)為是“feed的分類”
在hentry中包含指定rel="tag"的鏈接表明是“條目的分類”

在前面的例子中，我在hentry中使用了rel-tag鏈接：

<p class="category"><a href="http://www.ablognotlimited.com/articles/category/commentaries/” rel=”tag”>Commentaries</a></p>

<dd><a href="http://www.ablognotlimited.com/articles/tag/web+design/” rel=”tag”>web design</a></dd>

注意就是rel-tag規(guī)范中要求鏈接目的地址（href）中必須包括“標(biāo)簽”的值作為URL的最后一段，這被設(shè)計(jì)為“標(biāo)簽空間”。

例子：多日志

上面已經(jīng)討論了hAtom的大部分細(xì)節(jié)，應(yīng)該給出一個(gè)例子說明如何應(yīng)用在多日志的頁面中。在我的博客上，在首頁中添加了hAtom信息，用來描述我最近的三篇日志：

<div class=”hentry”>
<h3 class=”entry-title”><a href=”http://www.ablognotlimited.com/articles/web-accessibility-is-important/” rel=”bookmark”>Web Accessibility Is Important</a></h3>
<abbr class=”published” title=”2008-08-28T13:14:37-07:00″>Aug 28, 2008</abbr>
<p class="category"><a href="http://www.ablognotlimited.com/articles/category/commentaries/" rel=”tag”>Commentaries</a></p>
<div class=”entry-content”>
<p>The National Federation of the Blind v. Target lawsuit was settled this past Wednesday on the following key terms:</p>
…
</div>
<p><a href="http://www.ablognotlimited.com/articles/web-accessibility-is-important/" rel=”bookmark”>Continue Reading</a></p>
<dl>
<dt>Tags:</dt>
<dd><a href="http://www.ablognotlimited.com/articles/tag/accessibility/" rel=”tag”>accessibility</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/standards/" rel=”tag”>standards</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/web+design/" rel=”tag”>web design</a></dd>
</dl>
</div>
<div class=”hentry”>
<h3 class=”entry-title”><a href=”http://www.ablognotlimited.com/articles/plateau/” rel=”bookmark”>Plateau</a></h3>
<abbr class=”published” title=”2008-08-27T13:59:51-07:00″>Aug 27, 2008</abbr>
<p class="category"><a href="http://www.ablognotlimited.com/articles/category/commentaries/" rel=”tag”>Commentaries</a></p>
<div class=”entry-content”>
<p>As I posted previously, I'm doing the one hundred push ups challenge: a six-week program designed to get me able to do 100 consecutive push ups. I am now on my seventh week.</p>
</div>
<p><a href="http://www.ablognotlimited.com/articles/plateau/" rel=”bookmark”>Continue Reading</a></p>
<dl>
<dt>Tags:</dt>
<dd><a href="http://www.ablognotlimited.com/articles/tag/exercise/" rel=”tag”>exercise</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/fitness/" rel=”tag”>fitness</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/push+ups/" rel=”tag”>push ups</a></dd>
</dl>
</div>
<div class=”hentry”>
<h3 class=”entry-title”><a href=”http://www.ablognotlimited.com/articles/getting-semantic-with-microformats-introduction/” rel=”bookmark”>Getting Semantic With Microformats, Introduction</a></h3>
<abbr class=”published” title=”2008-09-05T07:05:34-07:00″>Sep 5, 2008</abbr>
<p class="category"><a href="http://www.ablognotlimited.com/articles/category/commentaries/" rel=”tag”>Commentaries</a></p>
<div class=”entry-content”>
<p>I'm an organizer with a sometimes frustrating need to pay attention to the smallest details.</p>
…
</div>
<p><a href="http://www.ablognotlimited.com/articles/getting-semantic-with-microformats-introduction/" rel=”bookmark”>Continue Reading</a></p>
<dl>
<dt>Tags:</dt>
<dd><a href="http://www.ablognotlimited.com/articles/tag/French+translation/" rel=”tag”>French translation</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/hAtom/" rel=”tag”>hAtom</a></dd>
<dd><a href="http://www.ablognotlimited.com/articles/tag/hCalendar/" rel=”tag”>hCalendar</a></dd>
…
</dl>
</div>

在這個(gè)例子中，我使用了多個(gè)hentry實(shí)例，每一個(gè)用來描述一篇日志。并且，我為每一篇日志都指定了永久鏈接，因?yàn)樗麄儾]有指向當(dāng)前頁面。除了上出兩個(gè)不同之外，hAtom基本上跟我之前的例子是一樣的。

可能的實(shí)現(xiàn)

除了我上面的兩個(gè)例子，還有很多可以實(shí)現(xiàn)hAtom的頁面：

在存檔頁面中的日志列表
條目的搜索結(jié)果
電子布告欄
評(píng)論

我正在考慮在存檔和搜索結(jié)果頁面中實(shí)現(xiàn)hAtom（還包括評(píng)論頁面，因?yàn)槟抢镄枰猦Card實(shí)現(xiàn)）。

提案狀態(tài)

在這個(gè)系列中提及的微格式中，hAtom是最難的一個(gè)。我個(gè)人覺得這是因?yàn)檫@個(gè)微格式還是一個(gè)提案狀態(tài)的規(guī)范。不過，我遇到的實(shí)現(xiàn)困難還都是很小的，不過也有點(diǎn)小挫?。?/p>

關(guān)于hAtom和他的屬性/子屬性只有很少的信息
有一系列問題還處于討論階段，比如<address>的使用
支持hAtom的工具和資源還相對(duì)較少
現(xiàn)在已有的hAtom生成器目前還沒有跟上規(guī)范的進(jìn)度，還沒有包括一些上面提到的注意問題，除了author和rel-bookmark

所以，從個(gè)人角度，我認(rèn)為畢竟他還處于提案狀態(tài)，還需要被修改和討論。但我并不認(rèn)為就不去實(shí)現(xiàn)hAtom，最起碼也可以先熟悉熟悉他。只要注意他還在提案狀態(tài)就可以了。

工具和資源

雖然前面提過現(xiàn)在支持hAtom的工具和資源還很少，我們還是可以列舉一些：

WordPress Sandbox主題是一個(gè)可以自定義的框架主題，他支持hAtom
Frances Berriman寫了一個(gè)hAtom PHP WordPress循環(huán)可以被添加到現(xiàn)有的WP主題中
Michael Kaply為Firefox的附加組件Operator寫了hAtom用戶腳本。該腳本可以為hentry的出現(xiàn)添加書簽功能
還有hAtom轉(zhuǎn)換器可以從頁面中提取hAtom信息并自動(dòng)轉(zhuǎn)化為XML文件，作為廣播的Atom源
hAtom2Atom使用XSLT把hAtom轉(zhuǎn)換為Atom格式的XML
Luke Arno寫的使用hAtom2Atom的代理，還有來自Chris Casciano的使用hAtom2Atom的過濾腳本
Optimus 是支持hAtom的微格式轉(zhuǎn)換器，此外，他還提供支持hAtom的驗(yàn)證器
hAtom transcoder是另一個(gè)轉(zhuǎn)換器，不僅僅支持輸出Atom 1.0，還支持輸出RSS 2.0

好處

(X)HTML廣播

我想hAtom最酷的一個(gè)好處就是他為XHTML廣播帶來的潛力。在工具和資源列表中，我提到了幾個(gè)轉(zhuǎn)換器，他們利用XSLT把帶有hAtom的XHTML轉(zhuǎn)換為XML，從而提供Atom或者RSS的源。這意味著不需要再為了廣播去生成或者維護(hù)單獨(dú)的Atom或者RSS的XML文件。簡單的利用hAtom和這些轉(zhuǎn)換器就可以完成廣播XML的自動(dòng)生成。

自己試試吧。需要做的僅僅是在包含hAtom信息的URL前面拼接這些轉(zhuǎn)換器（http://transformr.co.uk/hatom/）：

<a href="http://transformr.co.uk/hatom/http://www.ablognotlimited.com/“>Atom feed for A Blog Not Limited</a>

產(chǎn)生的鏈接會(huì)自動(dòng)生成Atom格式的XML：

Google Reader subscription page for A Blog Not Limited using hAtom transformer

我還沒有為我的站點(diǎn)實(shí)現(xiàn)這個(gè)轉(zhuǎn)換，因?yàn)槲沂褂?a >自定義的RSS源。不過這些轉(zhuǎn)換器絕對(duì)在我的實(shí)驗(yàn)列表中。

語義

您不會(huì)認(rèn)為我忘了這點(diǎn)吧？

借助于已有的標(biāo)準(zhǔn)（XHTML元素和屬性），微格式為網(wǎng)絡(luò)內(nèi)容添加結(jié)構(gòu)和語義。語義能夠同時(shí)幫助人類和機(jī)器來處理、搜索和理解互聯(lián)網(wǎng)。微格式鼓勵(lì)您使用互聯(lián)網(wǎng)標(biāo)準(zhǔn)……標(biāo)記內(nèi)容的標(biāo)準(zhǔn)化方法，應(yīng)用class信息，還包括開發(fā)的正確流程。

語義很棒。標(biāo)準(zhǔn)很棒。微格式很棒。

譯注：Syndication翻譯為“廣播”不知道合適不合適，以前一直提RSS，但是還真從來沒想過或者查過如何翻譯合適。

Tag：hAtom 微格式

欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片