でろぐのロゴ 豚さんブーブー

久々にでろぐをリニューアルしました。

2011年11月3日 (木)

少しづつ仕事の間にああでもないこうでもないと色々考えつつまったりとリニューアルを進めてました。
で、今日やっと公開w
今回のリニューアルのポイントを自分なりに紹介しようと思います。

リニューアルの目的
1.もっとすっきり。シンプルに。

以前のブログのデザインも基本的にはシンプル路線でしたが(僕がシンプルなのが好きっていうのが大きいんですけど。)、もっとシンプルにしようと思ってました。
というのも以前のデザインでは右側に色々詰め込みすぎていたところがあったので必要なさそうなものは排除しました。うん、すっきり。

2.面白いものを取り入れたい
次に思っていたのがブログの遊び心の部分。仕事でやっているサイトと違ってこのブログに関しては自分の遊び場でもあるのでいい意味でくだらないと思えるものや遊び心のある要素を忘れないようにしようと思っています。
その実践のひとつがロゴがぶるぶる震えるJqueryの実装。
オブジェクトをブルブル震わせるキュートなjQueryプラグイン『jRumble』

ロゴにオンマウスするとロゴがぶるぶる震えます。このくだらない感じ・・・いい!!

あとは便利そうなJQueryのプラグインも追加しました。
ソーシャルメディアで拡散された数を合計表示してくれる『sharecount』

2つとも最近の僕のお気に入りブログのウェビメモさんからのインスパイア。

3.実験的な試みも忘れずに
あとこのブログは遊び場でもありますが実験的な試みをする場所という意味合いもあるのです。
(お客さんのサイトでは実験とか出来ないのでやっぱり自分の運営サイトを何個かもっててそっちで実験はしているんですよ。)
でその実験的試みは以下

HTML5でマークアップ
前のデザインのコーディング時もHTML5でしましたが、今回も引き続きHTML5で。
今回はよりセマンティックにという部分を意識してマークアップしてみました。
(まだ見る人が見たら甘いという部分はあると思うのですけれども・・・)
参考にしたのがこちら
HTML5セクション要素のまとめ

あと、作業中に仕様が変わってtime要素が使えなくなったのでdata要素を使おうと思ったのですがせっかくなのでmetaデータ好きとしてはmicrodataも使ってみたいという事で取り入れてみました。
参考サイト
HTML5 追加された data 要素について
HTML5の新要素「data要素」に繋がる Microdataのプロパティについて
HTML5のパンくずマークアップについて

HTML5はまだ仕様が策定中なのでこれからも変わる気配がありますがまあ実験サイトなので変わったら変わったで修正したらいいかなと思ってます。

といった感じで分かる人にしかわからないような内容の記事ですが、こんな事を考えてリニューアルしましたよっていう話です。

シェアする