Big Sky

about: rel-bookmark戦争

『オレ、rel-bookmarkも嫌いなんだわー』とブツクサ言うsnj14 - otsune tumblr まとめサイト 画像保管庫Q
『オレ、rel-bookmarkも嫌いなんだわー』とブツクサ言うsnj14 - otsune tumblr まとめサイト 画像保管庫Q(追記)
3:14 - 『オレ、rel-bookmarkも嫌いなんだわー』とブツクサ言うsnj14

さて、私も少し考えてみた。

Basic HTML data types

Refers to a bookmark. A bookmark is a link to a key entry point within an extended document. The title attribute may be used, for example, to label the bookmark. Note that several bookmarks may be defined in each document.

http://www.w3.org/TR/REC-html40/types.html#h-6.12

mattn的に訳すと

Bookmarkについて。 bookmarkは広範囲に渡るドキュメント内の唯一のキーとなるエントリポイントへのリンクとなります。ブックマークをラベリングする際にはタイトル属性が使用され、ドキュメント内には幾らかのブックマークが定義され得る事に気をつけるべきでしょう。

そしてkuさんが言及している部分

Basic HTML data types

Authors may wish to define additional link types not described in this specification. If they do so, they should use a profile to cite the conventions used to define the link types. Please see the profile attribute of the HEAD element for more details.

http://www.w3.org/TR/REC-html40/types.html#h-6.12

訳すと

作者は本仕様では記述し得ないリンク型を別途定義したいと思うかもしれません。 であれば、リンク型を定義するのに一般的に用いられるprofileを使用すべきでしょう。 その他の詳細に関してはHEAD要素のprofile属性を参照して下さい。

そしてrel-bookmarkについて、microformats wikiでは

rel-design-pattern - Microformats

By convention (citation needed), this entry point also captures the notion of a "permalink".

http://microformats.org/wiki/rel-bookmark

訳すと

一般的には(言及が必要)、このエントリポイントとはpermalinkの概念で表現される物。

意訳過ぎたらごめんなさい
と言う事で

rel-bookmarkとは、それが含まれるドキュメントの内1点を指すべき物であり、rel-bookmarkがドキュメント内で実際のリンク先を指すべき、とまでは決めてない。あくまでpermalink扱い。

が私の考え。が上から読み取った私の解釈。
例えば末っ子の小学生が「姉ちゃん」と言えば「姉」を指し、60代サラリーマンが「姉ちゃん」と言えば「キャバクラの姉ちゃん」になる訳で...
つまりはそのテリトリ内で一意に現すことが出来る何か...がrel-bookmarkなのではないかと思った。

追記
検索順位が変ってしまったようです。

おそらくこれ、Technoratiがやりたかった事のはず。

- Yahoo! Search Results
http://www.yr-bcn.es/demos/microsearch/

microsearch [Wiki]

Using microformats

We support two kinds of microformats: hCard and hCalendar. hCard is used to add personal information to your webpage, hCalendar is used to add events. You can use the hCard creator and the hCalendar creator to create the code that you will need to insert into your webpage.

http://www.yr-bcn.es/dokuwiki/doku.php?id=microsearch#using_microformats

1段目の引用部にあるリンクで、「mattn」と検索してみて下さい。おそらく10秒から20秒程かかりますが検索結果が現れるかと思います。他の検索サービスと違う事に気付いた方、すばらしい。
そう、microformatsを使ってるのです。このサイト「Big Sky」に埋め込まれたmicroformatsの内、「hCard」と呼ばれる物(ここでは「Osaka, Japan」)を使用して地図上の大阪付近に「mattn」とプロットしているのです。

2段目の引用部

Using microformats

hCardとhCalendarという、2種類のmicroformatsをサポートしています: hCardとは、貴方のウェブページに個人情報を加えるのに用いられ、hCalendarはイベントを加えるのに使用されます。 これらをウェブページに追加するには挿入するにはhCard CreatorとFOAF-a-matic -- Describe yourself in RDFを使う事でコードを生成出来ます。

から、Yahooもmicroformatsに何かしらの期待を持っている事が伺えます。いずれ検索メタデータとして扱っていこうという事でしょうか。
リンク先には、今後GRDDLへの対応も予定されているので、ちょっとYahooが面白い事をやってくれそうな気がしてきました。

最近私もFirefox3を使い始めたのですが、Operator 0.9.1と組み合わせると、microformatsが「hCard」と「adr」だけになってしまい、少し困ってました。 何かのバグにしてはエラーコンソールに何も出ないし悩んでいたのですが、今日ソースを見て納得。
Firefox3からは、ブラウザ自身でmicroformatsを解析出来る仕組みが入ったのですが、その対応がOperatorに中途半端に入っている様です。
chromeからmicroformatsを扱う為には

Components.utils.import("resource://gre/modules/Microformats.js");

というコードが必要なのですが、この処理がコメントアウトされていました。
実際には

$(FIREFOX_PROFILE)/extensions/{95C9A302-8557-4052-91B7-2BB6BA33C885}/chrome/operator.jar

に含まれる

content/operator.js

が原因で、パッチで表すならば以下の様な感じ。

--- chrome/content/operator.js.orig Wed Mar 19 11:44:26 2008
+++ chrome/content/operator.js  Tue Mar 25 19:11:01 2008
@@ -77,7 +77,7 @@
     /* Attempt to use the Microformats module if available (Firefox 3) */
     if (Components.utils.import) {
       try {
-//        Components.utils.import("resource:///modules/Microformats.js");
+        Components.utils.import("resource:///modules/Microformats.js");
       } catch (ex) {
         /* Unable to load system Microformats - use builtin */
       }

おしいなぁ...作者。もしくは開発時はバギーだったかな？
実際の作業としては「operator.jar」を解凍し上記パッチを当てた(もしくは手編集)後に再度zip(拡張子jar)化すればOK。見事以前までのmicroformat Operatorが帰ってきました。
相変わらずウチのサイトはmicroformatsだらけですが...

ところでFirefox3で扱えるmicroformats、「Describing microformats in JavaScript - MDC」を見るとどうやら自前でmicroformatの定義が出来る様です。今後draftとして拡張されていくであろうmicroformatsへの配慮ですかね。せっかくmicrosummaryのOperatorプラグイン作ってたのに、こっちの方向で作り直しか？

で、さらにドキュメントの例を見ていると

var adr_definition = {
  mfVersion: 0.8,
  mfObject: adr,
  className: "adr",
  properties: {
    "type" : {
      plural: true,
      types: ["work", "home", "pref", "postal", "dom", "intl", "parcel"]
    },
    "post-office-box" : {
    },
    "street-address" : {
      plural: true
    },
    "extended-address" : {
    },
    "locality" : {
    },
    "region" : {
    },
    "postal-code" : {
    },
    "country-name" : {
    }
  }
};

という記述が...。これOperatorのソースコードのままだね。ってことはOperatorのソースをFirefox3に持ってったのかな？
とにかく簡単に拡張出来そうな仕組みなので、しばらく追ってみる。

otsuneさんがやってたので、まねしー。

なるべくblosxom.cgi本体を弄りたくなかったのもあって、本来はETagとかを返す為に用意されたlastmodified2プラグインを使う事にした。otsuneさんと同じく、もそもろの編集をした後 「Posted at」の部分を

Posted at <a href="$url$path/$fn.htm"><abbr class="updated" title="$lastmodified2::story_iso8601">$ti</abbr></a>

とした。とりあえずコノ辺で確かめてみたり、microformat Operatorで行けてそうだから、しばらく様子見。

ところで、microformat Operatorのプラグイン入れすぎで、ツールバーからはみ出してしまってるの、なんとかなりませんか...

↓コレ

前回はmicroformatsを簡単に説明する事で、microformatsとは何か？、microformatsで何が出来るのか？を説明しました。
今回は、microformatsを利用して実際にWebページにメタデータを埋め込む手順を示して行きます。
microformatsのメタデータ構造はXHTMLで記述され、microformatsを利用するアプリケーションはDOMを使用する事で簡単にメタデータを扱う事が出来る様になります。

前回の記事を書く時点で、この記事を記述する前に、以下のmicroformatsをこのサイトに埋め込みました。

• hCard
• rel-tag
• XFN

今回はその作った過程を説明していきます。

hCard

hCardの作成にはhCard Creatorや、hCard生成ツールでベースを作成し、自分のサイトのスタイルに合わせ修正するのが手っ取り早いです。
class属性には「class="fn"」といった単独の記述も出来れば、「class="url fn"」のように記述して

<a class="url fn" href="http://example.com/">ExAmPlE</a>

と組み合わせで記述する事も出来ます。

rel-tag

rel-tagは、そのサイトドキュメントが関連するタグを指し、ブログであれば各ブログツールによって生成されるものと思われます。利用するアプリケーション側は、このタグ情報を自身のサイトで抽出させたり、del.icio.usで検索させたりする事が出来ます。
このサイトでは、blosxomというブログツールのプラグインを使用してでタグを生成しており、本サイトの右側に表示されているタグ表示に使っています。
ただ、前回ご紹介したmicroformats Operatorでは、URLの最終部分をタグとして扱う仕様(technorati仕様)になっている為、例えば

<a href="http://example.com/weblog.cgi?tag=microformats" rel="tag">microformats</a>

等といったURLでOperatorを使うと、タグには「webblog.cgi」が表示されてしまいます。
これを回避するには

<a href="http://example.com/weblog.cgi?tag=microformats&-technorati-hack=/microformats" rel="tag">microformats</a>

という風に、無効なパラメータ(-technorati-hack)を使用して無理矢理フォルダ階層を作るの事でOperatorに扱わせる事が出来ます。(バッドノウハウ?)
このサイトでもblosxom.cgiというCGIがそのまま表示されますので、同様の修正で対応しています。

XFN

実は前回の記事には少し宜しくない部分があり、実際にはブログのエントリタイトルに対して「rel="bookmark"」を付けるべきだったと後で気づいた為、現在は修正してあります。
これから前回の記事を読む方は、記事本文を読み替えて下さい。

さて、今回は前回作成したmicroformatsに加え、「rel-license」を埋め込みました。
rel-licenseは、その文書の免責情報が記述されている文書へ、リンクを生成する際にrel属性に対して設定する値で、本記事のHTMLを参照して頂くと最下部あたりに

<a rel="license" href="http://example.com" title="...">rights reserved</a>

と書かれた部分が見当たるかと思います。
このリンクは、本サイトがCreative Commonsの指定の文書に従ってコピーライトされている事を意味しています。
例えば、皆さんが訪れたサイトがどんなライセンスなのかを見るには、このrel-license属性を見る事で確認する事が出来ます。
Creative Commons限定ですが、cc licenseというブックマークレットを使用すると、そのサイトがCreative Commonsライセンスなのかを確認する事が出来ます。
本サイトも、本記事をポストするにあたり、rel-licenseを追加したので、「cc license」でCreative Commonsライセンスである事が確認出来るようになっています。(bookmarklet)

microformatsには色んな拡張があり、現在も尚Draftへ新しい拡張が追加されていっています。

その中でも私が興味深いと思ったのは、「hPlaylist Profile」というXMDP(XHTML Meta Data Profiles)形式のmicroformatsを利用したプレイリスト公開フォーマットで、曲の

• タイトル
• 作者
• 注釈
• 情報
• 情報元URL
• 画像(おそらくジャケ写真?)
• プレイリスト公開日
• 属性
• その他トラック情報...

を格納する事が出来ます。例えばもしAmazonがこれに対応すると、CDの曲情報をmicroformatsで配信する事が出来るのでは？と思いました。
また、再生した曲目リストを公開する事で人と繋がりあうSNS、PLAYLOGもこれに対応する事で、現在のようなアルバム名、曲名、作者だけでなく、上記の補足情報(SONYに関連したものだけしか公開出来ないかもしれませんが...)を公開する事が出来るようになるかと思います。
未だ、私はhPlaylistを本格的に使ったサービス、アプリケーションを見つけられていませんが、AmazonでCDの紹介ページを閲覧した際にオフィシャルサイトへのリンクが表示されたり、ブログに現在再生曲情報を付加する「Now Playing」等で利用出来るのはないかと思います。

可能性が広がり、夢がありますね。

正直、microformatsは勉強してませんでした。
twitterでotsune氏がよく「microformats」についてコメントさえておられたのを聞いて、私もmicroformatsについて勉強しなきゃと少しだけですが勉強してみました。

microformatsとは？

microformatsとは、Web上にメタデータを付与し、言わば添付データとして二次利用可能なデータを指しています。
最近ではTechnoratiが盛んに注目しており、検索しようとしている人に対するマッチングに利用しようとしているみたいです。

microformatsを扱う上で何か覚えなくてはならないのか？

いえ、microformatsは現存のHTMLに対するクラス名、リンク属性の指定方法を特定の決まりに従い設定する事でそれをmicroformatsとして扱わせるものです。
ですから、現状の既に書いていたHTMLが実はmicroformatsに対応していた...なんて事もあるかもしれません。

microformatsで何が出来るのか？

詳しくはmicroformatsのオフィシャルサイトで確認して頂きたいのですがmicroformatsとして添付出来るデータの種別は以下の通りです。

• hCalendar
• hCard
• rel-license
• rel-nofollow
• rel-tag
• VoteLinks
• XFN
• XMDP
• XOXO

と多種に渡ります。例えばhCalendarにはイベント等を添付する事ができ、Webサイトを閲覧したユーザにイベント告知をする事も出来ます。
また、hCardはブログ等の記者、もしくはレビューワの身元情報を添付する事ができ、Webサイトを閲覧したユーザに連絡先を教える事が出来ます。

microformatsて実際どんなの？

このサイトのHTMLを見て下さい。
(HTML Validatorでエラーがいっぱい出るのは無視して下さい)
HTMLの中で「<!-- microformats」を検索してみて下さい。
コメントの「start」から「end」までがmicroformatsとなります。

<!-- microformats 'hCard' start -->
<div id="hcard-Yasuhiro-Matsumoto" class="vcard" style="display: none;">
  <img style="float:left; margin-right:4px" src="http://mattn.kaoriya.net/images/logo.png" alt="photo" class="photo"/>
 <span class="nickname">mattn</span>,
 <a class="url fn" href="http://mattn.kaoriya.net">MATSUMOTO Yasuhiro</a>

 <a class="email" href="mailto:mattn.jp[at]gmail.com">mattn.jp[at]gmail.com</a>
 <div class="adr">
  <span class="country-name">japan</span>
 </div>
</div>
<!-- microformats 'hCard' end -->

これがhCard情報になります。
Microformats Bookmarkletで確認すると



とこのサイトの作者情報が表示されます。(bookmarklet)
追記：名前を少し書き換えました。
また記事1件に対して1個ずつ以下のmicroformatsも追加してあります。

<!-- microformats 'xFolk' start -->
<div class="xfolkentry" id="xfolkentry-20070801190741" style="display: none;">
  <a class="taggedlink" href="http://mattn.kaoriya.net/software/linux/vim/20070801190741.htm">意外と知られていないvimのtips(calendar.vimの日記機能をGoogle Calendarと同期させる)</a>
</div>
<!-- microformats 'xFolk' end -->

これにより、記事1件に対してxFolk形式のmicroformatsが埋め込まれます。
こちらは、上記Microformats Bookmarkletでは確認出来ませんが、以下に示すmicroformats Operatorで確認出来ます。

microformatsを体験するにはどうしたらよい？

まず、Firefoxブラウザをお使いならばmicroformats Operatorを入れてOperatorツールバーでPermaLink一覧が表示されます。



このmicroformats Operatorでは各種microformatsが閲覧できたり、それに対するActionを設定出来ます。
例えばPermaLinkに対してSBMへ登録するメニューを設定したり、hCardをvCardファイルへ保存する事も出来ます。

まとめ

microformatsの可能性として、今後上記スキーマを利用したサードパーティアプリケーションが増えて来る事が想像出来ます。microformatsはHTMLに特化したものではなく、Feedに適応する事も出来ます。
言わばデジタル放送のサブストリームのようなイメージですね。デジタル放送でも本放送のサブストリームとしてニュースや番組情報を流したりしています。
スキーマも拡張可能なようですから、拡張次第ではCGI側ではてなブックマークコメントを流したりする事も出来るでしょう。

おまけ

今回microformats OperatorのActionとして、はてなブックマークActionを作成してみました。

ダウンロード：hatena_bookmark.js
注意：microformats Operator version 0.8b上で動作します。

これをmicroformats Operatorの「Options」画面の「User Scripts」タブから読み込み、「Actions」タブで「New」をクリックすると「Bookmark with Hatena Bookmark」が選択出来るようになります。



これでxFolkメニューから表示されるようになります。



後はそこに出てくる「Bookmark with Hatena Bookmark」を選択すると



とはてなブックマーク登録画面に遷移します。
よかったらmicroformatsの勉強にお役立て下さい。

また、個人的なまとめなので間違ってたらご指摘下さい。

リンク

microformats.org
Technorati Kitchen
microformats Operator

mattn the micromagick!