短信:ブログのデザインをリニューアルしました

長らく「ブログのリニューアルをやるやる詐欺」状態で先延ばししてたんですが、ようやく基本のデザインが完成しました。

まだやりかけの作業とかやりたい施策があるので、しばらくリニューアル期間が続くとおもいますが、ひとまず「リリース」という形にしました。


個人的なテーマは 「読むユーザ体験(UX)を最大化する」ことです。なので、できるだけ余計なものは入れず、「引き算」のデザインを心がけています。

カスタマイズのベースは色々悩んだ結果、JOEさんの「CONTENTS」にしました。 決め手は、「主役はコンテンツ」というコンセプトです。

www.dreamark.tokyo

何をやったか

これをベースにした上で、下記のことをしてました:

  • CSSをSCSSに書き換えた
    • よりプログラマブルでベターなCSS
    • 色を変数で扱えて便利
    • その代わり、書き換えること自体に時間がかかった……
  • ローカルでデザイン確認するためのHTMLを分割コンパイルできるようにした
    • HTMLの見通しが非常によくなった
    • 設定画面で入力できる「全体のヘッダ・フッタ」「記事のヘッダ・フッタ」ごとにファイルを分割できた
    • その代わり、書き換える自体に(ry
  • (本導入はまだだけど)カエレバ・ヨメレバのデザインをCSS3のFlexboxで書いてみた
    • 従来のようにfloat→clear(clearfix)で悩む必要がなく、直感的にブロックを並べられる
  • レスポンシブデザインにした
    • 元々オリジナルのCONTENTSでもレスポンシブ対応はあったのですが、さらにチューニングしています。
    • なので、レイアウトが崩れたとしたら、それは私の責任です……。
  • 配色をできるだけアクセシビリティに配慮した
    • 色盲と視覚過敏について少し調べて(改めてブログにも書きたい)、何となくマシな配色を決めてみた
    • ただし素人なので、見にくいとかあれば報告お願いいたしますm(__)m
  • AdSenseを導入しようとしてる
    • 各種アフィリエイトもアカウントだけ取った
    • 広告を貼ることについて、およびそのポリシーについては後日書きます。

こんな感じで、半年間ぐらい半ば放置してた時期もありながら作業してました。

これからについて

一番心配なのは、AdSenseがちゃんと表示されるのか?です。

自分が読んだ本では二次審査があるとかって書いてて、でも公式ヘルプを見ると「広告を貼ってしばらくしたら広告が表示されます」とか書いてるので、分からないです。

とりあえず、私のブログで「広告を見た!」という方はコメントかTwitter(@sky_y)までご一報ください。

(10/30 16:41追記 広告はきちんと表示されている、というご報告を@rashiraさんからいただきました。ありがとうございます。)

加えて、レスポンシブ対応のテストが不十分な可能性もあります。 何か表示がおかしいと気づいた方もぜひ機種名とともにご報告いただければ大変嬉しいです。

では、ひとまず寝ます。取り急ぎ……。

藤原 惟