OTCHY.NET

はてブエントリーページを旧仕様っぽくする Greasemonkey である、はてブエントリーページ旧仕様化 を公開しました。

リリース直後から、様々な非難を受けていた現仕様のはてブエントリーページですが、あれほどの反応にもかかわらず、リリースから 2 ヶ月経っても、旧仕様を選べるようにするなどの対応は取られていないようです。

個人的な感想で言うと、旧仕様の時もスターの数を頼りに流し読みする事もあったし、完全否定という立場ではないのですが、はてブの伸びを表すグラフとか良く見てたので、それが見れないのと、やはり多くの指摘にあるように、時系列でブコメを追いたい時にいちいち違うページを開くのが面倒という思いがありました。

そして 2 ヶ月。1 クリックごとのフラストレーションが、徐々に溜まり続けました。

2 ヶ月経ってもはてなからは特に動きが無いので、これはもう「こっち (運営) でやる気はないから、どうにかしたいならそっち (ユーザ) で何とかしな！」というはてなからの挑戦だと受け取り、上記のスクリプトを書きました。

単に、「すべてのブックマークを見る」にリダイレクトするのではなく、現状のエントリーページの中に、全てのブックマークをスムーズに統合して、出来る限り (記憶にある限り) 旧仕様に近づけているのが特徴です。
「人気のブックマークコメント」情報はあっても良いかと思ったので、項目自体は残しつつ、不要な時は閉じられるように配慮しています。

当初、もう少し簡単に出来るかなと思っていた部分が、案外難しく、はてブ側のスクリプトの中にまで手を入れて実現している機能とかがあります。
はてなで作って使っている JavaScript のライブラリに妙に詳しくなったりしつつ、試行錯誤を繰り返し、ようやく公開出来るレベルにまでなりました。

現仕様のエントリーページに苦々しい思いを持っている方は、是非おためし下さい。

はてなの方へ

上で色々と生意気な事を書きましたが、公式に対応して旧仕様を選べるようにしてもらえるのがベストに決まっています。
公式に対応されればこちらでもアナウンスして、公式機能の利用を促すようにするので、サーバに負荷をかける部分もあって恐縮ですが、公式対応までの間はお目こぼし頂けるととても嬉しいです。

参考にしたページなど

2011-04-05 – はてなブックマーク日記 – 機能変更、お知らせなど
はてなブックマークのエントリーページ改良が何を狙っているのか – 没個性テーマパーク
はてブのエントリーページ“改良”に疑問の声 – さまざまなめりっと
はてなブックマークのUIが大幅リニューアル(個人的に改悪)な件 – y-kawazの日記
新しいはてブが不評と聞いたので、全てのブックマークを見るグリモンスクリプトを作ったよ！（使えるかもしれないものが出来たので追記あり） – 不動産屋のラノベ読み

旧版である、Greasemonkey で 超お手軽に jQuery を使うスニペット は Firefox で使用する分には問題ないのですが、Chrome ではセキュリティ上の都合か、Greasemoneky 上における unsafeWindow が unsafe では無いようで (？) unsafeWindow.jQuery などに Greasemoneky からアクセスすることが出来ません。

そこで、Chrome 対応版のスニペットを用意しました。
ただ、いわば Chrome のセキュリティを回避した書き方になるため、旧版にあった、「該当ページですでに jQuery が読み込まれていればそれを利用」という特徴が失われてしまっています。
逆に言えば、常に自分で指定したバージョンを利用できるので、jQuery の新しい機能を使ったスクリプトを書く場合などは、こちらのほうが優れています。

スクリプト

(function (d, func) {
    var h = d.getElementsByTagName('head')[0];
    var s1 = d.createElement("script");
    s1.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js");
    s1.addEventListener('load', function() {
        var s2 = d.createElement("script");
        s2.textContent = "jQuery.noConflict();(" + func.toString() + ")(jQuery);";
        h.appendChild(s2);
    }, false);
    h.appendChild(s1);
})(document, function($) {
    // ここにメインの処理を書く
    $('#button').click(function(){
        alert('clicked!');
    });
});

Facebook は Google を廃業に追い込めない。いや、そもそもそんな必要はなく、Facebook は Google の領域を侵食することなく、自身のビジネスを伸ばしていく事ができる。

その事は歴史を見れば明白で、IBM → Microsoft → Google と IT ビジネスの覇者が移り行く中で、Microsoft は IBM を廃業に追い込んではいないし、Google が隆盛を誇る今も、Microsoft の売り上げは依然として高いままだ。

この覇者の移り変わりは、IT ビジネスの主戦場が、ハード → ソフト → ウェブ、と移り変わって来た事に合致する。
それぞれの分野における (当時の) 覇者がすなわち IT の覇者であったという事にすぎない。
そしてそれら、IT ビジネスの新しい領域は以前の領域を土台として発展している事もまた明白で、ハードがなければソフトは動かないし、ソフトがなければウェブもまた動かないのだ。

過去の覇者が覇者たり得たのは、決して以前の覇者を追い落としたからではなく、従来は無かった、もしくはビジネスにならなかった領域を切り開き、覇権を握ったという事だ。
もちろん、IBM、Microsoft、Google それぞれで競合する分野はあるし、過去の覇者はその資金力を活かして新分野にも攻め込みはする。
だが、結局のところ新たな覇者にはなれないし、売上比率は自分が覇者だった領域が一番高い。
(IBM は、2 世代分の時間をかけてハードからソフトへの転換を図っているが。)

翻って Facebook はどうか。

Facebook が見ているのは、ウェブに続く次の領域、パーソナル (なネットワーク) 分野に他ならない。
これは言わずもがな、ウェブを土台として発展した新しい領域だ。

この新領域で勝負していくのなら、Google を追い込む必要などなく、新しいビジネスの領域を切り開いて行けば良い。

そもそも、Facebook でウェブページを「いいね！」する時、友達の紹介じゃなく最初に「いいね！」した人は、どこでそれを見つけたんだっけ？
Google 検索？Google ニュース？Google リーダー？
もし Google が全く存在しない世の中だったら、今ほど Facebook が盛り上がる事などあり得ただろうか？

IBM はハードを売った。
Microsoft はソフトを売った。
Google は広告を売った。
それぞれに新しいビジネスだった。

そして、Facebook は広告を売って…、あ…れ？
第 4 の覇者ってもうちょっと新しい事して欲しい気が。

追記

はてブのコメントより、Facebook は「通貨」を売っているとの指摘が。
なるほど、その領域の覇権を握れれば、第 4 の覇者といって差し支えないかと思う。

はてブのエントリーページを旧仕様っぽくする Greasemonkey 書きました。
まだ超α版なので、user.js ファイルでは置きません。
Chrome でしか確認してないです。まあ Firefox でも動くんじゃないかな？たぶん。

// ==UserScript==
// @name         Hatebu Entry Page Downgrader
// @namespace    http://www.otchy.net/
// @version      0.0.1
// @include      http://b.hatena.ne.jp/entry*
// ==/UserScript==

(function (callback) {
    var script = document.createElement("script");
    script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js");
    script.addEventListener('load', function() {
        var script = document.createElement("script");
        script.textContent = "(" + callback.toString() + ")();";
        document.body.appendChild(script);
    }, false);
    document.body.appendChild(script);
})(function() {
    var isMore = (location.href.indexOf('mode=more') >= 0);
    if (!isMore) {
        var iframe = $('<iframe />');
        iframe.hide();
        $(document.body).append(iframe);
        var href = $('#more-link a').attr('href');
        iframe.attr('src', href);
    } else {
        var pBody = $(parent.document.body);
        var iBody = $(document.body);
        var bk = iBody.find('#new-bookmarks');
        pBody.find('#new-bookmarks').html(bk.html());
        pBody.find('ul.bookmark-list li').css({'padding': '5px 0px 5px 30px'}).find('img.profile-image').css({'width': '16px', 'height': '16px', 'margin-left': '-20px'});
        var scored = pBody.find('#scored-bookmarks');
        var sToggle = $('<span />').toggle(function() {
            scored.find('.bookmark-list').hide();
            $(this).text('[開く]');
        }, function() {
            scored.find('.bookmark-list').show();
            $(this).text('[閉じる]');
        });
        scored.find('h4.entry-page-main-subtitle .inner').append(sToggle);
        sToggle.css({'cursor': 'pointer'}).click();
    }
});

出来る事

• エントリーページの「新着」ブックマークを「全ての」ブックマークに差し替え
• ユーザのアイコンを 16 x 16 に変更
• 人気のブックマークの表示/非表示切り替え

出来ない事

• コメントのみ表示チェックが効かない
• スターが付けられない
• グラフが見れない

現状は、全てのブックマークを表示するページから HTML を親ページに流し込んでる実装です。
この実装だと、上記の問題解決はかなり難しそうです。
なので、全てのブックマークページをそのまま iframe で埋め込む方法に実装を変更する予定なのですが、とりあえず情報参照だけなら綺麗に動いたのでアルファ版として公開してみました。

フィードバック、改造報告などがあれば是非コメントに！