Macとかの雑記帳

Googleアナリティクスの見た目を素敵にしてくれるNumbers.css
GrowlスタイルのBlack Glass作者さんのサイトで公開されている「Numbers.css」というスタイルシートを使うと、Googleアナリティクスをスタイリッシュなデザインに変えることができます。
Googleアナリティクスのデザインを変更

 

各所にCSS3アニメーションが使われており、メニュー部分にマウスカーソルを持っていくと、ふわっと浮き出てくるようになっています。
Googleアナリティクスのデザインを変更

 

レイアウトが崩れている箇所がいくつかあるのですが、それでもデフォルトのデザインよりは良いと思います。
Googleアナリティクスのデザインを変更

 

スタイルシートを見てもらえば分かるのですが、アニメーションはwebkit系ブラウザにしか対応してません。Firefox等のブラウザでアニメーションを有効にしたい場合は自分で書き足す必要がありますが、たぶんそのままでも支障はないです。

 

導入にはサイトごとにスタイルシートを適用することのできるもの、SafariならUser CSS、FirefoxならStylishあたりを使えばいいと思います。

 

Chromeを使っている方は過去記事の「CSSでGoogleリーダーにPure Readerを適用する」が参考になると思います。

 

うちのブログで扱う内容じゃない気がするのですが…なかなかよかったので。

 

ダウンロード:Numbers.css – Google Analytics StyleSheet

スポンサード リンク