本部分我將介紹另一個常用的microformats:hCalendar。它是一個用於標記事件的microformats。如果你使用過 Yahoo的Upcomming ,你一定會覺得它是個具有不錯概念的web 2.0網站,將所有的事件聚合在一起,非常強大。是的,我談到了聚合,你想到了什麼?完全正確。Microformats。事實上,Upcomming已經將每一個具體事件標記為microformats了,而這個microformats就是hCalendar。如果你在Firefox浏覽器上安裝了我 上一篇教程 所說的 Operator 插件,那麼在Upcomming中某一個事件頁面上,你就能夠直接將該事件導入你的Google日歷、Yahoo日歷和Firefox書簽上了。
當你要標記一個事件時,那麼就要在你的root element上添加一個 class="vevent" 。
<div class="vevent"> ... </div>
以上標記將完成 一個事件 的標記。僅有以上root element是不夠,一個 合法 的hCalendar 至少包含 兩個內容:
事件名
事件開始日期
事件名的標記使用 class="summary" ,事件開始日期的標記使用 class="dtstart" title="20070206" ,這和hCard中標記出生日期的模式類似,如果我們要標記一個合法的hCalendar,那麼我應當至少提供這些信息。
<div class="vevent">
<span class="summary">D2前端技術論壇</span>
<abbr title="20080426" class="dtstart">2008年4月26日</abbr>
</div>
以上提供了一個合法的hCalendar的必要信息,但是hCalendar還能夠包含許多具體信息。
常用hCalendar信息參考 語意 Html 事件具體描述 class="description" 事件結束日期 class=“dtend” title=“20080427” 事件網站 class="url" 事件地址 class="location" 聯系方式 class="vcard contact"
注意:以上擴展信息中的 聯系方式 中使用了 上一篇教程中提到的 vcard ,所以該信息中將包含主辦機構名稱、具體地址、聯系電話等重要信息。
以 D2前端論壇 為例,較完整event應該如下:
<div class="vevent">
<h3 class="summary"><a class="url" href="http://d2forum.cn/index.Html">D2前端技術論壇</a></h3>
<p class="description">現代前端技術在網站中的應用</p>
<p>開始日期:<abbr title="20080426" class="dtstart">2008年4月26日</abbr></p>
<p>結束日期:<abbr title="20080428" class="dtend">2008年4月27日</abbr></p>
<p>地址:<span class="location">北京國安賓館3層會議廳</span></p>
<div class="vcard contact">
<span class="fn org"><abbr title="Designer and Developer">D2</abbr></span>
<p>電子郵件:<a href="mailto:chengzhi@taobao.com">chengzhi@taobao.com</p>
</div>
</div>
注意以上“結束日期”的title中必須增加一天。
完成一個事件的標記是不是很簡單呢?如果你要連續標記多個事件,那麼可以將多個 class="vevent" 元素放在 vcalendar 中。
<div class="vcalendar">
<div class="vevent"> ... </div>
<div class="vevent"> ... </div>
<div class="vevent"> ... </div>
</div>
雖然 D2前端論壇 已經可以說是我國Web前端行業中的領先者了,但是他們的網站沒有使用Microformats標記該事件信息。這足以說明Microformats在我國還很少受到重視,更加不要說應用,不過我想Semantic Web的車輪很難被減緩,壓過我國的土地也只是時間問題。