DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> XML學習教程 >> XML詳解 >> Microformats教程 第5部分:Microformats:hCalendar
Microformats教程 第5部分:Microformats:hCalendar
編輯:XML詳解     

本部分我將介紹另一個常用的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:[email protected]">[email protected]</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的車輪很難被減緩,壓過我國的土地也只是時間問題。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved