【鄭州分院第一百零四期】微格式

microformat

1.背景介紹

由于HTML中缺少相應的元素,很難突出顯示人池充、地點或日期等類型的信息警绩。為了解決這個問題,有一組開發(fā)人員決定開發(fā)一套標準的命名約定盒標記模式來表示這些數(shù)據(jù)远豺。這些命名約定基于vCard(電子名片)和iCalendar(日歷數(shù)據(jù)交換)等現(xiàn)有的數(shù)據(jù)格式,現(xiàn)在稱為微格式(microformat)坞嘀。

2.知識剖析

2.1 ? microformat定義

建立在已有的躯护、被廣泛采用的標準基礎之上的一組簡單的、開放的數(shù)據(jù)格式(microformats.org官方定義)丽涩。是把語義嵌入到HTML以便有助于分離式開發(fā)而制定的一些簡單約定棺滞,是兼顧人機可讀性設計的數(shù)據(jù)表達方式,對Web網(wǎng)頁進行語義注解的方法矢渊。

2.2 ?微格式在實際應用中的意義和作用又是什么呢继准?

微格式按照某種已有的被廣泛應用的標準,通過對內(nèi)容塊的語義標記昆淡,可以讓外部應用程序锰瘸、聚合程序和搜索引擎能夠做以下事情:

1、在捉取Web內(nèi)容時昂灵,能夠更為準確地識別內(nèi)容塊的語義避凝;

2、對內(nèi)容進行操作眨补,包括提供訪問管削、校對,還可以將其轉(zhuǎn)化成其他的相關格式撑螺,提供給外部程序和Web服務使用含思。

2.3 簡單的微格式

我們從上面的描述知道,微格式實際就是為現(xiàn)有的(X)HTML元素添加元數(shù)據(jù)和其他屬性甘晤,增強語義含潘。那么我們就來看一個簡單的微格式應用吧。

以前我們是這樣寫一個鏈接到首頁的代碼的:

而現(xiàn)在我們要為這個代碼元素a加上rel屬性线婚。

上面的鏈接標記a包括rel=”homepage”屬性遏弱,該屬性顯示鏈接的目標頁面是該網(wǎng)站的首頁。通過為已有的鏈接元素添加語義化屬性塞弊,就為這個鏈接添加了具體的結(jié)構(gòu)和意義漱逸。

2.4?hCard 微格式

hCard是一種微格式,用來發(fā)布個人游沿,公司饰抒,組織,地點等詳細的聯(lián)系信息诀黍。

它可以使分析器(比如其他網(wǎng)站袋坑,F(xiàn)irefox的Operator插件)獲得詳細的信息,并通過別的網(wǎng)站或者地圖工具進行顯示眯勾,或者載入到地址簿等其他程序咒彤。

2.5?示例一

加入微格式后疆柔,成為:

這里,正式名稱(class=”fn”)镶柱,組織(class=”org”)旷档,電話號碼(class=”tel”)和url(class=”url”)分別用相應的class標示;同時歇拆,所有內(nèi)容都包含在class="vcard"里鞋屈。

2.6?示例二

這里是維基媒體基金會的聯(lián)系方式,可以作為hCard的一個真實示例:

Wikimedia Foundation Inc.

200 2nd Ave. South #358

St. Petersburg, FL 33701-4313

USA

Phone: +1-727-231-0101

Email: info@wikimedia.org

Fax: +1-727-258-0207

加入微格式后故觅,成為:

2.7?其他常用的hCard屬性包括:

bday – 生日

email

honorific-prefix -(西式)名字前的尊稱厂庇,例如:博士(Dr.)、牧師(Rev.)等输吏,在東方會放在名字的后方权旷。

honorific-suffix -(西式)名字后的尊稱,一般都是封銜贯溅,例如:太平紳士(JP)拄氯、大紫荊勛章(GBM),一般詳列在名字的最后方它浅。

logo

nickname – 昵稱译柏、愛稱或外號。西方人的名字一般都有簡寫姐霍,有時這些昵稱或外號就用來分辨同名的人鄙麦。例如:William “Bill” Gates 中間的”Bill”。

note

目前已具備完整規(guī)范的微格式還包括:hCard镊折、hCalendar胯府、XOXO、XFN恨胚、VoteLinks和3個“rel-”微格式:rel- license骂因、rel-nofollow和rel-tag。

三.常見問題

你可能會問与纽,既然 hCard 對網(wǎng)頁的瀏覽者是完全透明的侣签,那我們?yōu)槭裁从忠M神費力地在網(wǎng)頁中添加 hCard 呢塘装?

目前看來急迂,這似乎是一件費力不討好的事情,因為 hCard 等微格式尚未得到瀏覽器和終端設備的良好支持蹦肴。但是一旦這些不足得到了改善僚碎,hCard 就會為我們的數(shù)字生活帶來很大的便利。

四.解決方案

來看幾個例子

當我用手機瀏覽某公司的網(wǎng)站時阴幌,手機瀏覽器識別出了網(wǎng)頁中的 hCard 信息勺阐。這個 hCard 標記了該公司的多種聯(lián)絡方式卷中,手機瀏覽器很聰明地提示我“是否保存到通訊錄”,于是我很經(jīng)松地保存了我所需要的信息渊抽。

手機瀏覽器還可以將頁面中的 hCard 導出為 VCF 文件蟆豫,我將 VCF 文件用藍牙傳輸?shù)酵碌氖謾C上,他們也輕松保存了這些聯(lián)系信息懒闷,同時也可以方便地同步到電腦上的通訊錄軟件中十减。

此外,F(xiàn)irefox 的 Operator 擴展還提供了一些針對微格式的在線應用愤估,比如“使用 Google 地圖查找”帮辟、“添加至雅虎通訊錄”等等,有效地豐富了 hCard 的應用范圍玩焰。

五.編碼實戰(zhàn)

見上面的知識剖析

六.拓展思考

大家知道的微格式或者用過的微格式有哪些由驹?

七.更多討論

說到“微格式”,有人力捧昔园,有人質(zhì)疑蔓榄。盡管如此,而作為網(wǎng)站開發(fā)者和個人站長蒿赢,你對“微格式”的應用仍在觀望之中嗎润樱?

八.參考文獻

什么是微格式及經(jīng)典實例演示_網(wǎng)頁設計

為網(wǎng)頁添加hCard微格式

PPT鏈接:https://ptteng.github.io/PPT/PPT/css-Microformat.html#/4

視頻鏈接:https://v.qq.com/x/page/w0501o0at82.html

文本鏈接:http://www.jnshu.com/daily/22509


microformat微格式_騰訊視頻
最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市羡棵,隨后出現(xiàn)的幾起案子壹若,更是在濱河造成了極大的恐慌,老刑警劉巖皂冰,帶你破解...
    沈念sama閱讀 217,084評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件店展,死亡現(xiàn)場離奇詭異,居然都是意外死亡秃流,警方通過查閱死者的電腦和手機赂蕴,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,623評論 3 392
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來舶胀,“玉大人概说,你說我怎么就攤上這事∠ィ” “怎么了糖赔?”我有些...
    開封第一講書人閱讀 163,450評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長轩端。 經(jīng)常有香客問我放典,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,322評論 1 293
  • 正文 為了忘掉前任奋构,我火速辦了婚禮壳影,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘弥臼。我一直安慰自己宴咧,他們只是感情好,可當我...
    茶點故事閱讀 67,370評論 6 390
  • 文/花漫 我一把揭開白布径缅。 她就那樣靜靜地躺著悠汽,像睡著了一般。 火紅的嫁衣襯著肌膚如雪芥驳。 梳的紋絲不亂的頭發(fā)上柿冲,一...
    開封第一講書人閱讀 51,274評論 1 300
  • 那天,我揣著相機與錄音兆旬,去河邊找鬼假抄。 笑死,一個胖子當著我的面吹牛丽猬,可吹牛的內(nèi)容都是我干的宿饱。 我是一名探鬼主播,決...
    沈念sama閱讀 40,126評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼脚祟,長吁一口氣:“原來是場噩夢啊……” “哼谬以!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起由桌,我...
    開封第一講書人閱讀 38,980評論 0 275
  • 序言:老撾萬榮一對情侶失蹤为黎,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后行您,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體铭乾,經(jīng)...
    沈念sama閱讀 45,414評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,599評論 3 334
  • 正文 我和宋清朗相戀三年娃循,在試婚紗的時候發(fā)現(xiàn)自己被綠了炕檩。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,773評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡捌斧,死狀恐怖笛质,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情捞蚂,我是刑警寧澤妇押,帶...
    沈念sama閱讀 35,470評論 5 344
  • 正文 年R本政府宣布,位于F島的核電站洞难,受9級特大地震影響舆吮,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜队贱,卻給世界環(huán)境...
    茶點故事閱讀 41,080評論 3 327
  • 文/蒙蒙 一色冀、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧柱嫌,春花似錦锋恬、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,713評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至嘉抓,卻和暖如春索守,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背抑片。 一陣腳步聲響...
    開封第一講書人閱讀 32,852評論 1 269
  • 我被黑心中介騙來泰國打工卵佛, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人敞斋。 一個月前我還...
    沈念sama閱讀 47,865評論 2 370
  • 正文 我出身青樓截汪,卻偏偏與公主長得像,于是被迫代替她去往敵國和親植捎。 傳聞我的和親對象是個殘疾皇子衙解,可洞房花燭夜當晚...
    茶點故事閱讀 44,689評論 2 354

推薦閱讀更多精彩內(nèi)容