GYM Search にも「del.icio.us」「はてなブックマーク」「livedoor clip」「Yahoo!ブックマーク」の各ブックマーク数を表示したんだけど、それぞれ表示される画像の仕様や呼び出し方が異なっていて戸惑いました。
「ブックマーク数画像表示API」はブログに簡単に貼付けられてナンボだと思うので、この仕様のバラバラさ加減はどうかと思うわけです。そこで、取りあえず各SBMサービスの仕様をまとめて調べてみました。
(ブックマーク数画像呼び出しの部分だけにフォーカスしてますので、周辺情報省略しています。ご了承下さい。)
まずは、ブックマーク数画像を表示するためのURLを調べました。
1)del.icio.us ブックマーク数画像呼び出しURL
[2008/08/24 追記]
Deliciousのリニューアルに伴い、旧画像APIが使用できなくなりました。
手前味噌ですが、新Deliciousに対応したAPIを作りましたのでそちらをご利用下さい。
・Delicious2.0 の被ブックマーク数画像取得APIを作りました
del.icio.us には公式の画像APIが用意されていませんが、非公式(非サポート?)で画像を呼び出す事ができます。
参考: del.icio.us でのブックマーク数を画像で取得できるようになったらしい – HsbtDiary (2007-03-22)
参考: del.icio.us でのブックマーク数を画像で取得できるようになったらしい(2) – HsbtDiary (2007-03-24)
<img src="http://del.icio.us/feeds/img/savedcount/{MD5_HASH(URL)}?aggregate" />
リダイレクト先の数字画像URL
http://images.del.icio.us/static/img/feeds/savedbyothers/{万の位}/{千の位}/{百の位}/{十の位}/{ブックマーク数5桁}.gif
重要なポイントとしては、URLをMD5ハッシュに変換してから渡さなければいけない事があります。
MD5はJavaScript(md5.js)でも、Perl(Digest::MD5)でも、Ruby(Digest::MD5)でも、PHP(md5)でも関数で比較的簡単に変換可能ですが、ちょっと面倒ですねぇ。
それからリダイレクト先の画像URLも工夫がみられます。物理的なファイル置き場を一つのディレクトリに最大100個までになるように桁毎にディレクトリを自動で分割しています。
また、ブックマーク数のファイル名は5桁に満たない場合は左に0埋めされています。(「1」の場合は「00001.gif」な感じ)
2)はてなブックマーク ブックマーク数画像呼び出しURL
はてなブックマークでは公式に3つのサイズの画像が用意されています。
参考: ブックマーク数を画像で取得する API の公開について – はてなブックマーク日記 – 機能変更、お知らせなど
<img src="http://b.hatena.ne.jp/entry/image/{URL}" /> <!-- デフォルトはnormal --> <img src="http://b.hatena.ne.jp/entry/image/large/{URL}" /> <!-- 大 --> <img src="http://b.hatena.ne.jp/entry/image/normal/{URL}" /> <!-- 中 --> <img src="http://b.hatena.ne.jp/entry/image/small/{URL}" /> <!-- 小 --> ※URLに「#」を含む場合は、「%23」に変換が必要です。
リダイレクト先の数字画像URL
http://b.hatena.ne.jp/images/users/large/{ブックマーク数5桁}.png http://b.hatena.ne.jp/images/users/normal/{ブックマーク数5桁}.png http://b.hatena.ne.jp/images/users/small/{ブックマーク数5桁}.png
3サイズ用意されている事と、URLをそのまま渡すのが特徴です。
リダイレクト先の画像はdel.icio.usと違って1ディレクトリにあるようですね(内部でさらに細かいディレクトリにリダイレクトしている可能性はありますが)。既に「ls」コマンドきかないんじゃ…。
ブックマーク数のファイル名は5桁に満たない場合は左に「0埋め」されています。(「1」の場合は「00001.png」な感じ)
3)livedoor clip ブックマーク数画像呼び出しURL
livedoor clip では公式に3つのサイズの画像が用意されています。
参考: クリップ数を画像で取得する API – livedoor クリップ まとめサイト – livedoor Wiki(ウィキ)
<img src="http://image.clip.livedoor.com/counter/{URL}" /> <!-- デフォルトはsmall --> <img src="http://image.clip.livedoor.com/counter/large/{URL}" /> <!-- 大 --> <img src="http://image.clip.livedoor.com/counter/medium/{URL}" /> <!-- 中 --> <img src="http://image.clip.livedoor.com/counter/small/{URL}" /> <!-- 小 --> ※URLに「#」を含む場合は、「%23」に変換が必要です。
リダイレクト先の数字画像URL
http://image.clip.livedoor.com/img/users/large/{ブックマーク数5桁}.png http://image.clip.livedoor.com/img/users/medium/{ブックマーク数5桁}.png http://image.clip.livedoor.com/img/users/small/{ブックマーク数5桁}.png
詳細ははてなブックマークと一緒なので割愛します。
4)Yahoo!ブックマーク ブックマーク数画像呼び出しURL
Yahoo!ブックマーク では公式に3つのサイズの画像が用意されています。
参考: 便利ツール : 「ブックマーク人数表示」画像 – Yahoo!ブックマーク
参考: 各社ブログ向けYahoo!ブックマークのブログパーツ設置方法 – Yahoo!ブックマーク スタッフブログ
<img src="http://num.bookmarks.yahoo.co.jp/image/large/{URL}" /> <!-- 大 --> <img src="http://num.bookmarks.yahoo.co.jp/image/medium/{URL}" /> <!-- 中 --> <img src="http://num.bookmarks.yahoo.co.jp/image/small/{URL}" /> <!-- 小 -->
リダイレクト先の数字画像URL
http://thumbnail.yimg.jp/number/large/{ブックマーク数} http://thumbnail.yimg.jp/number/medium/{ブックマーク数} http://thumbnail.yimg.jp/number/small/{ブックマーク数}
Yahoo!ははてななどと違って、ブックマーク数画像のファイル名を「0埋め」しません。
5)buzzurl ブックマーク数画像呼び出しURL
buzzurl では公式に画像が用意されています。
参考: ECナビ デベロッパー ネットワーク: ブックマークユーザー数イメージ取得API
参考: Buzzurl [バザール] / ソーシャルブックマーク
<img src="http://api.buzzurl.jp/api/counter/v1/image?url={URL}" /> あるいは <img src="http://api.buzzurl.jp/api/counter/{URL}" />
リダイレクト先の数字画像URL
http://cdn.buzzurl.jp/static/image/num/{ブックマーク数}.gif
Yahoo!と同じく、ブックマーク数画像のファイル名を「0埋め」しません。
(CDN使ってるんですね・・・当たり前か)
6)fc2ブックマーク ブックマーク数画像呼び出しURL
fc2ブックマーク では公式に画像が用意されています。(公式の説明ページは見つかりませんでした)
参考: Fブ カウンターを設置:ポエツ | poets
<img src="http://bookmark.fc2.com/image/users/{escape(URL)}" /> ※URLはURLエンコードを推奨しています
リダイレクト先の数字画像URL
http://bookmark.fc2.com/icons/{ブックマーク数5桁}.png
はてな、livedoorのようにブックマーク数が5桁になるように「0埋め」します。
各SBMの ブックマーク数画像スタイル比較
次に、表示されたブックマーク数画像の見た目について表形式で比較してみます。
サービス名 | 画像 | 種類 | 高さ | 色 |
---|---|---|---|---|
del.icio.us | GIF | 17px | フォント=白/背景=青 数による変化なし |
|
はてなブックマーク(大) | PNG | 15px | [1〜9] フォント=薄い赤/背景:薄いピンク [10〜] フォント=濃い赤/背景:濃いピンク |
|
はてなブックマーク(中) | PNG | 13px | ||
はてなブックマーク(小) | PNG | 11px | ||
livedoor clip(大) | PNG | 20px | [1〜2] フォント=薄い青/背景:薄い水色 [3〜9] フォント=濃い紫/背景:薄い紫 [10〜] フォント=濃い赤紫/背景:薄い赤紫 |
|
livedoor clip(中) | PNG | 16px | ||
livedoor clip(小) | PNG | 12px | ||
Yahoo!ブックマーク(大) | PNG | 20px | [1〜] フォント=黒/背景:ピンク〜赤 無段階に背景色の赤が濃くなる |
|
Yahoo!ブックマーク(中) | PNG | 17px | ||
Yahoo!ブックマーク(小) | PNG | 15px | ||
Buzzurl | GIF | 12px | [1〜2] フォント=青(細)/背景:白 [3〜9] フォント=青(太)/背景:薄い水色 [10〜] フォント=青(太)/背景:濃い水色 |
|
FC2ブックマーク | PNG | 12px | [1〜2] フォント=青/背景:薄い水色 [3〜9] フォント=青/背景:中くらいの水色 [10〜] フォント=青/背景:濃い水色 |
del.icio.usは呼び出し方も特徴的ながら、画像も一つだけ白抜きのタイプで独特。
はてな、LD、Y!は仲良く3サイズ選べます、微妙にサイズが違う。
それから、各サービスとも色の濃淡で人気度を表していますが、概ね10以上を人気としているようです。
LD、Buzzurl、FC2は[1~2]でもさらにグラデーションさせてますが、これはユーザ総数が少ないために一桁usersのエントリーがたくさんあるための対処と思われます。
色の濃淡は一覧で見た方が分かりやすいので、別ページに並べてみましたのでご参考下さい。
調べて思った事
調べた中では、Yahoo!とBuzzurl以外はブクマ数が5桁までしかないので仕組み上最大値は「99999」って事になってしまいます。
実際、かなりブクマ数が多いと思われるFlickrのdel.icio.usでのブクマ数は「40000」(2008/01/24現在)ちょいだった。
まあ、大丈夫だろうという考え方もあるけど、物理的に足りなくなった時にどうするんだろ。
その点、Yahoo!は後進ながらもスゴいと思った。
呼び出し方もIMGとSCRIPT両方が用意されていたり、人気を表す背景色が無段階(だと思う)にグラデーションしていたり。
何よりもともと囲っているユーザ数のアドバンテージを活かしてか、もの凄い数のブクマ数がすでにある。例えば、Yahoo!Japanのトップページは「100000」人越えてます(2008/01/24現在)。桁が一個違うのです。
まとめ
このエントリー書くのに1週間くらいかかっている気がするorz
そもそもなんでこんな事調べたかっていうと、冒頭に書いた各SBMのバラバラなAPIを統一するサービス(リダイレクターというかプロキシというか)ができないかなぁと思ったわけで。
って作る前からネタばらししたら誰か先に作っちゃうかもしれないけど。
いや、非常に便利だろうと予想できるし、自分自身がそういうサービス欲しいんだけど、パフォーマンスが求められるので今のレンサバじゃキツいだろうなぁとか漠然と思っていたりして。
そんなわけで、気が向いたら誰か作っちゃって下さいw
それから、同じようにSBMのまとめエントリーは何個かあって参考にさせてもらいました。
この場を借りて感謝します。
・Big Sky :: 個人的ソーシャルブックマークサービスの歩き方
・ソーシャル・ブックマーク・サービスの被ブックマーク数取得まとめ/楽
お邪魔します。
おかげで Y! ブックマークの人数表示うまくできました!
ありがとうございました。
>らぶさん
どもども。
お!問題解決しましたか。お役に立てて何よりです♪
SBMチェッカー(ブックマーク数表示ツール)
ツール・サイト > SBMチェッカー(ブックマーク数表…
ソーシャルブックマークに対応
ソーシャルブックマークに対応してみました。 とりあえず以下に対応 – はてなブックマーク – livedoorクリップ – Yahoo!ブックマーク – …
実用! 画像でブックマーク数を返すSBMからブックマーク数を数値で取得
こんにちは! この前会社のCentOS4のサーバをyumったらPerl5.8.5…
[WEB制作] ブックマークされている件数を表示する(はてなブックマーク、Yahooブックマーク、Livedoorクリップ)
ブログなどで、ブックマークしている人が何人いるかを表示したい場合のやり方。 はてなブックマークの場合 以下のように書けばいい。はてブの場合はブログのトッ…
WordPress用:ソーシャルブックマークボタンの設置とブックマーク数を表示する方法
はてなやnewsingをのヘルプを見ると、MT用のソースはあってもWordPressのソースって書いてなくて、不親切だなぁと思い、
Wor…
SBSの被リンク数を表示させる【成功】
長い道のりでした。
自分で確認したのは、はてなだけですが無事にいくつかのSBSにおいて、お気に入り登録してくれた人のユーザ数を表示させるようにしました。
…