はろーはろー

 

こんにちわわ。みなさま。

 

可愛いチワワの写真

 

 

先日、ブログのヘッダーを

ひっそり模様替えいたしました。

 

 

-------------------------

 

 

BEFORE

 

 

AFTER

 

 

-------------------------

 

 

デザインはあんまり変わってないけど、

配色をライトブルーに衣替え。

 

 

梅雨時でどこもかしこも

”じめじめ”としてたから

 

 

ヘッダーだけでも

さっぱりと爽やかに

モデルチェンジしたかったのです。

 

清涼感ある爽やかなドリンク

爽やかなツインドリンクの図…

 

 

自分のブログは

更新するたびに目にするものだから、

 

 

どうせ目にするなら、

自分にとって心地よくて

モチベーションが上がる色

がいいですよね!

 

 

 

**************

 

 

 

ところで、ヘッダーの色を変更したのだから

当然、他のパーツ部分も

変えました




「次ページ」ボタン

 

 

「次ページ」とか

 

 

 

「一覧を見る」ボタン

 

 

「一覧を見る」とかのボタンパーツとか

 

 

 

アメブロパーツ色々ボタン

 

 

タイトルカラー、フォローボタン、

タイトル下と記事の囲み線なんかも

色変更しました。

 

 

 

ちなみに、

ヘッダーの取り換えや

ボタン周りの色変更なんかは

デベロッパーツールを使って

実際の画面を見ながら

一括変更しました。

 

 

 デベロッパーツールとは?  Google chromeに搭載されているサイトの要素検証ツールのこと。
HTMLやCSSの確認したりするときに使います。
※説明だいぶ端折ってます。

↓右側赤枠みたいなの


(google Chromeを使ってる人は、F12を押してみてね。 デベロッパーツールが表示されます。)

 

 

 

色変更やカスタマイズをするときに、

CSSのコピペを使って

WEB色見本なんかを見ながら

調整すると

プレビューしたときに

「思ってたのと違う...」

となりがちなので

 

デベロッパーツール使って調整すると

リアルタイムで変更した色が反映されて

実際の画面が見れるので

 

フィット感がわかりやすい

 

と、個人的には思ってます

 

 

 

ちなみに次回は、

アメブロデザインで使える

色々なコピペ集を書こうかなぁと思ってます。

 

 

それではまたごきげんよう。