2008年12月10日 23:35

はてなブックマークエントリページに飛ぶ前にワンクッションを置く

スポンサードリンク

Web作っていると「はてなブックマーク」の「被ブックマークカウンタ」を取り付けていることが多いのですけれども、この画像をクリックしたらエントリページに飛んで行かせたくなるのが心情。でも、はてなブックマークが浸透していない対象向けのページを作っている場合、「クリックしたらワケワカランホームページが出たぞ！」とか言って、苦情も言わず二度とアクセスして頂けないというのも悲しすぎます。

というわけで、とかの画像をクリックしてもすぐにはてなブックマークのエントリページに飛ばないで、確認ダイアログを表示するようにしましょう。

<a href="http://b.hatena.ne.jp/entry/http://dtpwiki.jp/"
  target="_blank"
  onclick="return confirm('外部サービス「はてなブックマーク」に移動し、ブックマークしたユーザーの一覧や、評価を表示します。移動しますか？');"
  ><img style="vertical-align: middle;"
    src="http://b.hatena.ne.jp/entry/image/normal/http://dtpwiki.jp/"
    alt="はてなブックマーク"
    title="外部サービス「はてなブックマーク」で評価を見る"
  /></a
>

実行例：

こんな感じにします。これで、不用意にリンクをクリックしてしまったことでよくわからないサイトに飛んでいってしまったという不満を減らすことができます。はてなブックマークのエントリページ自体、「このページがなんであるか」の説明が不足しているので、ジャンプする前に適切な解説を表示するのがいいと思います。

onclickに直書きするのがイヤな人は、attachEventでもaddEventでもEvent.observeでもお好きなように。

2008.12.10 23:35 投稿　大野義貴 [Web] | 固定リンク |