ブログリニューアル

wordpress

ブログリニューアルしました。そのときやったことなど。


3連休まっただ中!ちょっといつもよりグダグダな生活です。
福岡はあいにくの雨ですしね。

今回、あまり満足してなかった現状のデザインを打破するために、一年ぶりにリニューアルしました。※まだ今も構築中なので、おかしな部分があるかもしれませんので、温かい目で見ていただけると幸いです。

スポンサードリンク

 

 

 

さて、リニューアル前と後でどのように変わったか見ていきましょう。

リニューアル前のデザイン

以前のブログデザイン

グランジ&オーガニックな感じで表現していました。これを公開したのは、約一年ほど前になります。これに飽きて、ほかにも無料のテンプレートなど使っていました。

 

リニューアル後のデザイン

新しいデザイン

 

デザイン変更のポイント

読みやすくすっきりさせたフラットデザイン。
ホワイトスペースを活かして、カフェの落ち着き感を表現しました。
アクセントカラーの赤色ベースで、多色使わない。

 

これにより、カフェのサードプレイス感(家でもない職場でもない第3の居場所)を表現できたかな…

 

 

制作にかかった時間は…

デザイン…1日
コーディング…3、4日
テンプレート化(wordpress組み込み)…2時間

でした。
意外とテンプレート化に時間をかけませんでした。
といっても、まだ細かい設定終わっていませんが(笑)。

コーディング

コーディングでは、レスポンシブデザインを採用しています。
ブレイクポイントは、1024px、880px、620px、480pxという感じです。

 

wordpress組み込み

WordPress構築に参考にしたサイトはweb design recipeさん。

以下がそのリンクです。

wordpressテンプレート化

http://webdesignrecipes.com/first-time-wordpress-origin-theme/

ぱんくずリスト

http://webdesignrecipes.com/wordpress-breadcrumb-list-tips/

これらのページを見ればwordpressブログを作ることができます。

仕事でも、いろいろテンプレートを作ったので、このときはこのタグを使う、など設定を覚えていたのも早くなった理由かもしれません。

参考にした本

さらに、この本はいつも手元にあります。


オリジナルテンプレートを作るときは、この本もいつも参考にしています。
高度なことは書いてなく、個人用ブログなどシンプルなオリジナルテンプレートを作りたい!という時にオススメです。

記事のコメントってどうやって表示するんだったかな?とか、ページャー付けるにはどうしたらよかったかな?なんていう細かいパーツを形成していくときに、辞書的な感じで使っています。

ブログテンプレート作成の時は、Web design recipeさんと合わせていつもこの本を開いています。

最後に

ということで、休日などの合間をぬってデザインを一新しました。
以前書いていた一年前ほどからのブログ記事も消えてしまいましたが、逆にゼロからスタートできるということで、がんばろうと思います。

これからも少しずつ手を加えていくとは思いますが、なんとかリニューアル終えてよかったです。

投稿者プロフィール

mayukou
mayukou
Webデザイナー修行中のmayukouです。webデザインのお仕事を始めてなんとか約6年が経ちました。とにかく技術を高めようと思っています。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞(洋楽)、料理、読書、ブログです。
詳しくはこちら

Twitterをフォローしていただくと、最新情報を見逃しません♫

関連記事

  1. Web Design

    WordPressでポートフォリオサイトをリニューアルしました。wordpressで作るメリットとデ…

    みなさんこんにちは、mayukouです。約3年ぶりにポートフォリオサ…

  2. wordpress

    自分のブログを冬仕様に!wordpressに雪を降らせるプラグイン

    12月になり、一段と寒くなりましたね。冬になったら、自分のブログを…

  3. ブログ

    ポートフォリオサイトをリニューアルしました

    こんにちは。mayukouです。唐突ですが、自分の今の力を目に見え…

  4. ブログ

    webデザイナー4年目!その間に身につけたスキル

    こんにちは、mayukouです。今回は自分の仕事を振り返ってみます…

  5. wordpress

    wordpressが重たい!そんな困った時に便利なプラグイン

    近頃、調子に乗ってwordpressにいろいろプラグインを入れてパワー…

  6. wordpress

    wordpressバックアップツールの決定版!All in one Migration のプレミアム…

    こんにちは、webデザイナー5年目のmayukouです。wordpr…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


メルマガを購読する

Web Design Cafeの メルマガを購読する

更新情報や、お知らせ、お得情報をゆる〜く配信(月1程度)。


最近の記事

instagramもやっています

facebook更新中!

スポンサー

こんなサイトも作ってます。

  1. Mac

    Marvericksアップデート時のPhotoshopのバグが直りました
  2. jQuery

    スマホに使える!3階層のアコーディオンメニューを作りました!
  3. ブログ

    ポートフォリオサイトをリニューアルしました
  4. jQuery

    JQueryで要素を消すスクリプト!ECサイトの注意書きにもオススメ!
  5. Web Design

    【有料記事】スキルアップしよう。デザイン力が育つ方法とは。
PAGE TOP