ブログのヘッダーをつくってみよう|*Mellow Blossom*

ヘッダーをつくろう!

 

ブログを作成して2日。

 

なんとか形は整えたものの、デザインはほぼ初期設定のまま。

 

このままだとさみしいな~と思い、ヘッダーを作成しました。

 

せっかくなので記録しておきます。

 

どんなイメージ?

 

さて、このブログのデザイン案は下記のとおりです。

ブログデザイン案
【イメージ】ふんわり優しい

 

【カラー】ピンク、パープル、ホワイト
 ※全体的にパステルトーンにする

 

【モチーフ】花、レース

 

 

これはブログを立ち上げるにあたり、最初にわたしが書いたメモです。

このイメージに合うように考えてヘッダーをデザインしました。

 

そして、完成したものがこちら。

 

①PC用ヘッダー

このブログのトップページのヘッダーです。

 

イメージカラーとモチーフから、ピンクの薔薇の画像を使用しました。

 

そして、優しい印象になるよう、ふんわりとベールをかけたような色合いにしました。

 

フォントは、やわらかな曲線を描くスクリプト体(筆記体)を選びました。

 

文字色はホワイトにしたかったのですが、そのままだと背景画像に埋もれてしまうので

下にオーガンジーをイメージしたボードを入れ、影もつけて浮き上がるようにして目立たせました。

 

②スマホ用ヘッダー

こちらはスマホ用のブログヘッダーです。

 

PC用のヘッダーをもとに、縦長の画面で映えるよう形を変えています。

 

そして、ブログタイトルを2行に分けて、外側にホワイトの囲み線を追加しました。

 

③Twitter用ヘッダー

こちらはTwitter用のヘッダーです。

 

本当はブログ用の2つだけつくる予定だったのですが、

Twitterのヘッダーもまだちゃんとしたものを用意できていなかったので

仮ではあるのですが、おそろいにしちゃいました。

 

こちらもPC用のヘッダーをもとに、サイズを少し変えています。

 

また、外側をピンクのラインで囲んで、印象を変化させてみました。

 

ヘッダーがあるとブログが引き立つ!

 

このように3つのヘッダーをつくってみました。

 

自分なりに、今持ってる知識とスキル総動員でイメージに近づくよう試行錯誤しました。

 

その結果、わりとイメージに合うヘッダーがつくれたのではないかなと思います。

 

 

今回ヘッダーを入れたことで、自分のブログが華やかになりました。

 

少しづつ育ってきた感じがして嬉しいです。

 

 

それにしても、実際につくってみてしみじみ感じましたが、

イメージを形にするのって本当に頭を使いますね。

 

大変だけど、でも楽しい!

 

 

良かったらご意見くださいね。

 

最後までご覧いただき、ありがとうございました✧*。

 

おすすめの記事