hCard 范例

By:
On:
In: xml
Tagged: , , , , , , , , ,

这一篇hCard范例，ㄚ琪从去年八月翻到现在终于完工，由于实在不太了解微格，所以翻译特显困难，不过还是完成了，ㄚ琪也希望在自己的网站上加上一些hCard的使用，不过本文很多范例还是以作者的网站为例，改天有空再来改吧！

范例 hCards.

作者

译者

ㄚ琪

启发性的例子

网页和文章的作者

依据HTML4.01规格，作者应该使用<address>元素来表示"一篇文件或是一篇文件的主要部份的联络资讯"，例如： 

<address>
 <a href="http://tantek.com/">Tantek Celik</a>
</address>

增加hCard到这样已经存在的XHTML，你可以明确地表明这人的名称、网址等等： 

<address class="vcard">
 <a class="fn url" href="http://tantek.com/">Tantek Celik</a>
</address>

这可以这样显示： 

Tantek Celik

这不只整页可以这样做，页面的"主要部份"也可以，例如，部落格的文章。

见microformats.org部落格一个例子 (看原始码)，在microformats.org上的每篇文章的作者被标记为像上面显示的 <address class="vcard">元素。

人跟组织的参考

在部落格文章里一个典型的例子就是连结提到的人名到他们的部落格，且/或他们公司的首页。例如： 

<cite>
 <a href="http://meyerweb.com/">Eric Meyer</a>
</cite> 写了一篇文章
(<cite>
  <a href="http://meyerweb.com/eric/thoughts/2005/12/16/tax-relief/">
   Tax Relief
  </a>
 </cite>)
关于他从<a href="http://irs.gov/">Internal Revenue Service</a>.
收到的无意中幽默信

加入hCard到这样的标记里，你可以明确地用名字跟URL来表明这个人跟公司： 

<cite class="vcard">
 <a class="fn url" href="http://meyerweb.com/">Eric Meyer</a>
</cite>写了一篇文章
(<cite>
  <a href="http://meyerweb.com/eric/thoughts/2005/12/16/tax-relief/">
   Tax Relief
  </a>
 </cite>)
关于他从<span class="vcard">
 <a class="fn org url" href="http://irs.gov/">Internal Revenue Service</a>
</span>收到的无意中幽默信。

注意这个包围IRS的超连结上的类别名称"fn org url"，使用"fn"跟"org"相同的值（或这里元素）来表示hCard是描述一个组织而非一个人。

这也可以这样显示： 

Eric Meyer写了一篇文章 (Tax Relief)关于他从Internal Revenue Service收到的无意中幽默信。

在一个组织工作的人

人们通常会将他们工作的公司或组织联想在一起，例如： 

<span class="vcard">
 <span class="fn">Jeremy Keith</span>,
 <span class="org">Clearleft</span>
</span>

当然在这个时代里，几乎每个人都有他们自己跟他们公司的URL，要在上面的hCard例子中加入URL是容易的： 

<span class="vcard">
 <a class="fn url" href="http://adactio.com/">Jeremy Keith</a>,
 <span class="org">Clearleft</span>
</span>

但是加了一个URL到公司里，就没有"org-url"属性(也不应该有)，相反地，在公司自己里使用模组化跟巢状的hCard： 

<span class="vcard">
 <a class="fn url" href="http://adactio.com/">Jeremy Keith</a>,
 <span class="org vcard"><a class="url fn org" href="http://clearleft.com">Clearleft</a></span>
</span>

此外，假如这个人的hCard是在代表他们的页面上(例如，是一个representative hCard)，那么你也可以用超连结到公司的实验rel-group关系来表示这公司的这个人属于这一个"群组"。 

<span class="vcard">
 <a class="fn url" href="http://adactio.com/">Jeremy Keith</a>,
 <span class="org vcard"><a class="url fn org" rel="group" href="http://clearleft.com">Clearleft</a></span>
</span>

hCard跟XFN

部落格文章中人的参照

上面的例子里，一个人(部落客)正在参照另一个人(Eric Meyer)，除了使用hCard来明确标记这个人的参照外，部落客可以使用XFN (XHTML朋友网路)来表示他们跟Eric Meyer的关系，例如： 

<cite class="vcard">
 <a class="fn url" rel="friend colleague met" href="http://meyerweb.com/">
  Eric Meyer
 </a>
</cite> wrote a post
(<cite>
  <a href="http://meyerweb.com/eric/thoughts/2005/12/16/tax-relief/">
   Tax Relief
  </a>
 </cite>)
about an unintentionally humorous letter he received from the
<span class="vcard">
 <a class="fn org url" href="http://irs.gov/">Internal Revenue Service</a>
</span>.

这会跟前面的例子有一样的显示。

部落格联播(Blogrolls)中人的参照

很多部落客正使用XFN(通常使用一个简单的使用者介面像是内建在WordPress)的那一种来明确表示在他们的部落格联播中跟这个人的关系: 

<ul>
 <li>
  <a href="http://meyerweb.com" rel="friend colleague met">Eric Meyer</a>
 </li>
 <li>
  <a href="http://photomatt.net" rel="friend colleague met">Matt Mullenweg</a>
 </li>
</ul>

将hCard标记加入到XFN朋友的部落格联播中，你可以明确表示这人的名称跟URL，除了他们的关系之外： 

<ul>
 <li class="vcard">
  <a class="fn url" href="http://meyerweb.com" rel="friend colleague met">Eric Meyer</a>
 </li>
 <li class="vcard">
  <a class="fn url" href="http://photomatt.net" rel="friend colleague met">Matt Mullenweg</a>
 </li>
</ul>

这样可能显示为：

这会参照为hcard-xfn-supporting-friends-lists，这也是social-network-portability关键组成的部份。

更多XFN的资讯，见XFN home page、joining XFN及XFN的背景.

这个技术用在WordPress的WP Microformatted Blogroll外挂中。

新型态的联系方式

自从vCard设计出来后，就有许多的其他的服务来提供个人的地址或其他方式的联系，例如，即时通、voip等等。

这意味着vCard(以及hCard)必须扩充到可以代表这些吗？

感谢URL属性的弹性，答案是No，不需任何的扩充，相反地，我们使用可以辨认服务（协定、机器且/或路径）服务的适当URL，然后置放个人的位址在里面。

  • vCard 已经扩充这个，我们是否应接受这个新的"IMPP"属性？ TobyInk 10:03, 17 Mar 2008 (PDT)

AOL Instant Messenger (AIM)

AOL Instant Messenger (AIM) ids 可以使用aim:协定来表现，很多人可以这样做可点击的网址来发布他们的AIM ids，例如： 

<a href="aim:goim?screenname=ShoppingBuddy">IM with the AIM ShoppingBuddy</a>

对于hCard，我们将接受这个现有的内容发布行为，并且简单地撷取它作为hCard另一个网址： 

<a class="url" href="aim:goim?screenname=ShoppingBuddy">IM with the AIM ShoppingBuddy</a>

Yahoo! 即时通

同样地，Yahoo! 即时通 (YIM) ids 可以使用ymsgr:协定来表现，同样地很多人可以这样做可点击的网址来发布他们的YIM ids，例如： 

<a href="ymsgr:sendIM?SomeYahooFriend">IM with SomeYahooFriend</a>

再一次，对于hCard来说，我们将接受这个现有的内容发布行为，并且简单地撷取它作为hCard另一个网址： 

<a class="url" href="ymsgr:sendIM?SomeYahooFriend">IM with SomeYahooFriend</a>

MSN Messenger

MSN Messenger (MSNIM) ids 可以使用msnim:协定来表现，并且同样地很多人可以这样做可点击的网址来发布他们的MSNIM ids，例如： 

<a href="msnim:chat?contact=joebob@hotmail.com">IM with joebob@hotmail.com</a>

对hCard来说，我们将接受这个现有的内容发布行为，并且简单地撷取它作为hCard另一个网址： 

<a class="url" href="msnim:chat?contact=joebob@hotmail.com">IM with joebob@hotmail.com</a>

见相关的议题。

XMPP (Jabber)

Extensible Messaging and Presence Protocol (XMPP) ids 可以使用xmpp:协定来表现，例如： 

<a class="url" href="xmpp:username@jabberservice.com">IM with username@jammerservice.com</a>

这个协定允许更多的URLs，见RFC4622。

目前有很多客户端支援这个协定。

Skype

IP电话服务Skype的帐户可以使用skype:协定来表现，它可以用来开启一个网路聊天室或是一个Skype呼叫。 

<a href="skype:echo-chinese?chat">IM with the Skype echo service (Chinese)</a>
<a href="skype:echo-chinese?call">Skype call to Skype echo service (Chinese)</a>

因此对于hCard来说，我们可以接受这个现有的内容发布行为，并且简单地撷取它作为hCard的另一个网址： 

<a class="url" href="skype:echo-chinese?chat">IM with the Skype echo service (Chinese)</a>
<a class="url" href="skype:echo-chinese?call">Skype call to Skype echo service (Chinese)</a>

ICQ

ICQ没有URL的结构，反而在web上ICQ的连结使用HTTP超连结来下载一种内容类型application/x-icq的资源，之后作业系统接着就会打开使用者的ICQ客户端。

因此我们可以标记那些有内容类型的HTTP超连结明确地设定来跟ICQ语义沟通： 

<a class="url"
   type="application/x-icq"
   href="http://www.icq.com/people/cmd.php?uin=[ICQNUMBER]&action=message">
 Contact with ICQ</a>

将[ICQNUMBER]取代为使用者真正的ICQ号码。

网站专页

部落客通常会在内容托管服务上使用网址到他们的首页、馈送或专页来显示他们的身份在这些服务上，他们透过标签作为URL属性，这些额外的身份也可以在hCard发布。

列出你其他的专页

列出其他个人资料的网站最常见的情况是部落客列出自己其他的个人资料，或网站允许使用者列出他在站上的个人资料，连结到其他人的个人资料，使用户要列出其个人资料在该网站上，链接到他或她的其他个人资料，由于很清楚地这个作者/使用者表示所有那些个人资料指德是同一个人，使用XFN的rel="me"将他们标记起来做明确的身份合并是最好的，例如，在Tantek的部落格或其他社交网路的个人资料的那些连结：

像这种明确以使用者为导向的身份合并也是建构social-network-portability区块的一个关键，这会在hcard-xfn-supporting-friends-lists这节有更多的解释。

典型的网站简介

网占有时后会对一个人有很多不同的页面作为"首页"，以及那个人的使用者个人资料页。

举Flickr的例子：

此外，网站通常有一个他个人典型的网址及几个备用网址。

如上所述，在hCard里连到这些网址的连结会表示那些人应该有classname "url"。

此外，在hCard里站上像这样的连结到一个人的典型网址应该也有"uid"这个classname，这个技术是Ryan King第一次在Social Network Portability Today lunchtime meetup提出。

上一节建构的例子：

这样的"url" + "uid"属性也被网站使用作为个人的OpenID网址。

这件工作已开发进representative hCards，到那里有最新这类的思维。

组织跟部门

部门使用"organization-unit"类别名称在"org"元素里，明确的"organization-name"标记可以与其他部门区隔： 

<div class="vcard">
 <div class="org fn">
  <div class="organization-name">Sprinkler Fitters U.A. Local 483</div>
  <div class="organization-unit">Apprenticeship Training Center</div>
 </div>
</div>

该部门也可以是位址的一部分，在这种情况下，你会想要明确的标记它作为除了"organization-unit"以外的"extended-address"。 

<div class="vcard">
 <div class="adr">
  <div class="org fn">
   <div class="organization-name">Sprinkler Fitters U.A. Local 483</div>
   <div class="organization-unit extended-address">Apprenticeship Training Center</div>
  </div>
  <div class="street-address">2531 Barrington Court</div>
  <span class="locality">Hayward</span>,
  <abbr title="California" class="region">CA</abbr>
  <span class="postal-code">94545</span>
 </div>
</div>

请注意在位址里的org的巢状结构，我们要避免有重复的部门名称。

组织列表

类似lists of people，组织列表（例如乐队）应该使用一个有列表项目跟超连结到各自的组织首页的列表（无序的，除非有理由要排序）。

例如，这个简单的POSH： 

<ul>
 <li>
  <a href="http://microformats.org/">microformats.org</a>
 </li>
 <li>
  <a href="http://technorati.com/">Technorati</a>
 </li>
 <li>
  <a href="http://www.w3.org/">World Wide Web Consortium</a>
  (W3C)
  </a>
 </li>
</ul>

可以很容易地使用hCard来加强： 

<ul>
 <li class="vcard">
  <a class="fn org url" href="http://microformats.org/">microformats.org</a>
 </li>
 <li class="vcard">
  <a class="fn org url" href="http://technorati.com/">Technorati</a>
 </li>
 <li class="vcard">
  <a class="fn org url" href="http://www.w3.org/">World Wide Web Consortium</a>
  (<span class="nickname">W3C</span>)
  </a>
 </li>
</ul>

hCard里RFC 2426的范例

见：hcard-examples-rfc2426

测试用例

这是hCard的例子，都被认为是在hCard分析器里在寻找错误时特别有用（例如X2V）。

BDAY资讯的问题

这个例子： 

    <!-- birthday -->
    <div class="bday">
    <dt>Birthday</dt>
    <dd>
        <abbr class="value" title="1985-10-27T00:00:00Z">October 27, 1985</abbr>
    </dd>
    </div>

应该产生"BDAY:1985-10-27T00:00:00Z"，但是它却产生"BDAY:Birthday October 27\, 1985" [在哪？这像叙述好像毫无意义]，有趣的是apple的通讯录还是希望接受这样的方式。

  • 也许造成HTML的解析错误，就像<dt>跟<dd>不允许作为 <div>子标签一样。

型态值不灵敏的例子
  • "home" vs. "Home"

这个例子在X2V可以运作： 

    <div class="tel">
    <dt>Phone (<span class="type">home</span>)</dt>
    <dd><span class="value">+438123418</span></dd>
    </div>

这不行，但是应该可以吧，它只会变成在vcard里没有的型态TEL。 

    <div class="tel">
    <dt>Phone (<span class="type">Home</span>)</dt>
    <dd><span class="value">+438123418</span></dd>
    </div>

GEO解析

下面的hCard： 

<div class="vcard">
  <span class="fn n">
     <a class="url" href="http://t37.net">
       <span class="given-name">Frederic</span>
       <span class="family-name">de Villamil</span>
     </a>
  </span>
  <span class="nickname">neuro</span>
  <a class="email" href="mailto:neuroNOSPAM@t37.net">
     <span class="type">pref</span><span>erred email</span>
  </a>
  <span class="org">Omatis</span>
  <span class="adr">
     <abbr class="type" title="dom">France</abbr>
     <span class="type">home</span> address
     <abbr class="type" title="postal">mail</abbr> and
     <abbr class="type" title="parcel">shipments</abbr>:
     <span class="street-address">12 rue Danton</span>
     <span class="locality">Le Kremlin-Bicetre</span>
     <span class="postal-code">94270</span>
     <span class="country-name">France</span>
  </span>
  <span class="geo">
     <abbr class="latitude" title="48.816667">N 48° 81.6667</abbr>
     <abbr class="longitude" title="2.366667">E 2° 36.6667</abbr>
  </span>
</div>

应该可以转换为下面的vCard： 

BEGIN:VCARD
VERSION:3.0
URL:http://t37.net
ORG:Omatis;;
NICKNAME:neuro
FN:Frederic de Villamil
N:de Villamil;Frederic;;Mr.;
EMAIL;TYPE=INTERNET,PREF:neuroNOSPAM@t37.net
ADR;TYPE=HOME:;;12 rue danton;le Kremlin-Bicetre;;94270;France
GEO:48.816667;2.366667
END:VCARD

X2V(2005-12-18)目前不能解析/汇出GEO属性。

相关网页

The hCard specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added. These thoughts, issues, and questions are kept in separate pages.