DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 為網頁添加hCard微格式
為網頁添加hCard微格式
編輯:關於網頁技巧     

網頁制作poluoluo文章簡介:hCard 等微格式應用會令網頁中的信息更加精確和豐富,並為互聯網用戶帶來更多的便利。

說到“微格式”,有人力捧,有人質疑。歸根結底,我覺得還是浏覽器和終端設備的支持沒有跟上,沒有形成一個完整的應用流程。盡管如此,Yahoo、Google 等行業巨頭已經開始在各自的主流產品中應用微格式。而作為網站開發者和個人站長,你對“微格式”的應用仍在觀望之中嗎?

其實,微格式並不復雜,它離我們也並不遙遠。不妨現在就行動起來,試試在網頁中添加微格式吧!

在我看來,微格式最主打的應用非 hCard 莫屬。所以本文將著重介紹一些 hCard 的應用經驗。

vCard/VCF

在討論 hCard 之前,有必要先介紹一下 vCard。

vCard 是電子名片的文件格式標准,它可以存儲聯系人的姓名、公司名稱、職位、電話、地址、電子信箱、網站等信息。vCard 的文件擴展名通常為 .VCF,一個簡單的 VCF 文件看起來通常是這個樣子的:

BEGIN:VCARD
VERSION:2.1
N:Michael;Jackson
TEL:13912345678
END:VCARD

雖然對普通網友來說,VCF 文件似乎並不常見,但事實上它已經在眾多領域得到了廣泛的支持和應用。

我第一次接觸到 VCF 文件是在整理手機通訊錄時。當時我需要將手機中的通訊錄轉移到新手機中,我下載並試用了一些相關的工具軟件,比如 PC 端手機管理軟件 NOKIA PC Suite 與 Oxygen Phone Manager、通訊錄管理軟件 Outlook/Outlook Express、手機端通訊錄備份工具 SmartVCard 等等。我發現所有這些軟件都“不約而同”地支持 VCF 格式,NOKIA 智能手機甚至原生支持在手機端導入/導出 VCF 文件。

hCard

再來看看 hCard。我們知道 hCard 是一種微格式,通常應用在 HTML 等語言中,主要用於組織並標記網頁中的聯絡信息。hCard 直接采用 vCard 的屬性名稱作為自身的標記規則,這意味 hCard 與 vCard 有著天生的兼容性。這些特性令它成為最受關注的微格式應用。

和其它微格式一樣,hCard 對網頁的浏覽者是完全透明的。hCard 使用 HTML 標簽的 class 屬性來對數據進行標記。有時,當 HTML 文檔中現有的標簽不足以進行細致的標記時,可能需要增加額外的標簽(通常是不影響網頁外觀的 spandiv 標簽)。關於在網頁中添加 hCard(或將 vCard 轉換成 hCard)的具體方法,我不打算在此贅述,因為網上已經有了非常詳盡的參考資料,我會將它們列在本文的末尾。

在何處添加 hCard

在網頁的什麼地方添加 hCard 呢?其實從它的用途可以看出,網頁中凡是涉及到個人、網站或公司的聯系信息都可以采用 hCard 來進行標記。

以 CSS魔法 的首頁為例,涉及此類聯系信息的頁面元素有站點標題、“關於站長”、“友情鏈接”三塊區域,我們就可以分別以網站、站長、朋友為主體單獨設置 hCard。

為什麼要使用 hCard

你可能會問,既然 hCard 對網頁的浏覽者是完全透明的,那我們為什麼又要費神費力地在網頁中添加 hCard 呢?

目前看來,這似乎是一件費力不討好的事情,因為 hCard 等微格式尚未得到浏覽器和終端設備的良好支持。但是一旦這些不足得到了改善,hCard 就會為我們的數字生活帶來極大的便利。來看幾個理想中的例子:

  • 當我用手機浏覽某公司的網站時,手機浏覽器識別出了網頁中的 hCard 信息。這個 hCard 標記了該公司的多種聯絡方式,手機浏覽器很聰明地提示我“是否保存到通訊錄”,於是我很經松地保存了我所需要的信息。
  • 手機浏覽器還可以將頁面中的 hCard 導出為 VCF 文件,我將 VCF 文件用藍牙傳輸到同事的手機上,他們也輕松保存了這些聯系信息,同時也可以方便地同步到電腦上的通訊錄軟件中。
  • 更令我驚喜的是,手機浏覽器識別出了 hCard 中的地理位置信息(經緯度),並可將此信息傳遞給手機內的 GPS 導航軟件,這樣連出行道路都不需要我四處打聽了!

這些應用看起來似乎不錯吧?其實這些情景離我們已經越來越近了,目前 hCard 已經有了一些可行的應用流程。

現階段的 hCard 應用

現階段的 hCard 應用主要以桌面端為主,因為目前似乎還沒有支持微格式的手機端浏覽器。

目前可以識別微格式信息的浏覽器包括安裝了 Tails Export 或 Operator 擴展的 Firefox,以及安裝了 Safari Microformats Plugin 插件的 Mac 版 Safari 浏覽器。

安裝了 Tails Export 擴展的 Firefox

這些的浏覽器在識別出頁面中的 hCard 信息之後,通常都可以提供導出 VCF 文件的功能。這些導出的 VCF 文件可以很方便地添加到本機的通訊錄(Outlook 或 Address Book)中,隨後便可以通過 NOKIA PC Suite 或 Apple iTunes 等軟件將本機通訊錄同步到 NOKIA 手機或 iPhone/iPod 等便攜設備之中。

其中,Safari Microformats Plugin 插件可以直接將 hCard 中的聯系人信息導入本機(僅限 Mac OS)的通訊錄。

Safari Microformats Plugin (示意圖)

此外,Firefox 的 Operator 擴展還提供了一些針對微格式的在線應用,比如“使用 Google 地圖查找”、“添加至雅虎通訊錄”等等,有效地豐富了 hCard 的應用范圍。

安裝了 Operator 擴展的 Firefox

值得一提的是,還有一個完全在線的、與浏覽器無關的實現方案——Microformats Bookmarklet(微格式書簽)。雖然它的界面明顯借鑒自 Safari Microformats Plugin,但它實際上是跨浏覽器的(支持 Safari、Firefox 和 IE 等浏覽器)。它的使用很簡單,也很有趣,把這個鏈接“微格式書簽工具”拖放至書簽欄(或添加到收藏夾),就算是完成了“安裝”。此後在浏覽任何網頁時,只要點擊這個書簽項(或打開這個收藏夾項目),就可以識別並操作網頁中的微格式信息了。(不過這個工具需要調用 jQuery,可能會與網頁自身調用的 JS 庫相沖突,或者因 jQuery 加載失敗導致失效,不夠穩定。)

Microformats Bookmarklet (微格式書簽工具)

結語

雖然目前微格式尚未得到浏覽器和終端設備的良好支持,但我們相信,在不遠的將來,hCard 等微格式應用會令網頁中的信息更加精確和豐富,並為互聯網用戶帶來更多的便利。

相關閱讀

  • hCard 的官方資料
  • 中文維基百科: vCard
  • 中文維基百科: hCard

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