digg経由で知ったこのサイト。

» Sherb’s Blog :: Clever Advertising

アクセスが集中しているのか落ち気味ですが秀逸な広告が11個ばかり載っています。どれも相当頭ひねって考えられた感じの広告。

このサイトも昨日で1年になりました。いつもチェックしたりコメントをくださる方々、どうもありがとうございます。

いろいろつくったつもりでも、並べてみると思ったより少ないし、しょうもないものが多いですが。。1年のまとめということでその中でも印象に残っているものを再掲。

• みんなのブラウザのウィンドウサイズはどのぐらいか調査して分布図をつくってみた
• トリビアの種：決戦は○曜日に最も行われている
• カオスの数学：PHPで複雑系の不思議な模様を描画
• Yahoo! JAPAN カテゴリ10年の歴史をビジュアライズ

見た目にわかりやすいものがつくれたときは、いい感じです。

• 日本で公開されているAPI一覧
• ブログの記事本文を抽出するスクリプトをつくってみた
• 検索エンジン的要チェックワード集：マッシュアップ系

API一覧は、はてブでたくさんブックマークしていただけました。
本文抽出はつくっていて面白かったし、これをきっかけに他の方が考えたアルゴリズムも見れてわくわくしました。
3つ目のpicks!は、コンテンツの自動生成、というテーマで現在も改善を施しているサービスです。自作のフレームワークにあれこれ工夫を凝らしています。

アイディアはまだまだあるのでこれからもつくっていきますー！

放映は先月からされていたようですが僕は初めて見ました。公式サイトによると実際に水中で演技しているそうで、ものすごくきれい。

以下自分の行動履歴。

ながら見のテレビで目に入ったこのCMで感動した3秒後にはPCに向かう。でも製品名は覚えていなくてブラウザの検索窓に「sony eri」と打ち込むとエリクソンのスペルを忘れていてもGoogleToolbarが補完してくれる。検索結果の2番目に「SO902iWP+ | NTTドコモ | Sony Ericsson」とそれらしきサイトを発見。めでたくメイキングの説明を読めて引用すべきURLが見つかった。と、ここで、YouTubeにアップされてたりして、と思って「SO902iWP」で検索したらさくっと見つかる。画質はちょっと劣化するがYouTubeだと簡単にembedできる。記事に紹介した映像が埋め込まれていれば見て共感してくれる人も多くなりそう。云々。

picks.zuzara.com(site closed)のユーザを対象に、ブラウザのウィンドウサイズをどのぐらいの大きさで見ているのか、調査してみました。調査の動機はGoogleAdsenseを貼っていて800pxにあわせると横スクロールが出てしまうことに気付き、そういえば最近のPCは解像度も高いしどのぐらいの大きさのウィンドウでブラウザを開いているんだろう、と思ったところにあります。

8月3日の24時間集めておよそ6000ユーザ分を集計。picks.zuzara.comのユーザはIEが91%のシェアで、30%がFirefoxの当ブログに比べると一般的なインターネットユーザが見ていると言えます。

で、調査結果。1つの点が1ユーザ、ウィンドウサイズの縦横幅をXY座標に実寸大でマッピングしています。

13%のユーザが800px以下の横幅。
分布図の縦方向に線ができているのは、画面横一杯にウィンドウを広げているユーザが多いためだと思われます。

なお、同日のGoogleAnalyticsによる解像度の分布は以下。

800×600のユーザはわずかに1.67％。とはいえウィンドウサイズは800×600未満のユーザが相当数いるのでやはりウェブデザインを考える時は800px以下の横幅に抑えるのが良さそうです。

と、このネタを考えた翌日、こんなサービスが！

ブラウザサイズ特化型アクセス解析サービス BROWSIZE.ORG を作りました : akiyan.com

ブラウザの横幅の集計結果も別の記事に併記されていました。800px以下のユーザの割合はあきやんさんのデータの方が25%と多くなっているようです。

補足：

データの収集はAjaxで。

function s() {
    var w, h;
    if (self.innerHeight) {
        w = self.innerWidth;
        h = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
        w = document.documentElement.clientWidth;
        h = document.documentElement.clientHeight;
    } else if (document.body) {
        w = document.body.clientWidth;
        h = document.body.clientHeight;
    }
    var r = g();
    r.open('GET', '/w/' + w + ',' + h);
    r.send(null);
}
function g() {
    var x;
    try {
        x= new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            x= new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
            x= false;
        }
    }
    if (!x&& typeof XMLHttpRequest != 'undefined') {
        x= new XMLHttpRequest();
    }
    return x;
}

onLoadで呼び出す。
分布図はFirefoxのCanvasで描画＆Pearl Crescent Page Saverでスクリーンショットを撮りました。