こんにちは、画像屋店主です。
アメブロのカスタマイズをとことんしようと思ったらかなり色々出来ますが、そんなにする必要もないと思ってます。
最低限見栄え良くなれば良いと思ってます。
この見栄えとは自己満足ではなく、顧客視点でわかりやすくと言う事です。
今回は「自分でするカスタマイズ講座」第一回ということで、簡単だけど超絶見栄えが変わって、お客さんも見やすくなるカスタマイズを！
それは記事の枠を記事ごとに区切って見やすくする！！！
アメブロは広告や色々なものが記事記事の間にたくさん入る為に、1ページに3記事や5記事など掲載すると、区切りが非常に見えにくくなってタイトル位置が分かりにくい構造になってます。
そこで今回はこれ！
box-shadow
けっこ便利なＣＳＳでこれを書き込んだ枠全体に影をつけてくれます。
ようは下記のようになります。
これに枠線つけて強調すると
こうやって作ったのがこのブログの記事の枠線です。
更にサイドバーの各項目も同じようにこの方法で区切っただけです。
────────────
記事部分のＣＳＳ
────────────
枠線と影が黒のバージョン
border: 1px solid #000000; /* 枠線の色 */
padding: 0px;
box-shadow: 0px 0px 10px #000000; /* 影の色 */
background-color: #ffffff;} /* 記事全体の背景色 */
枠線黒で影を赤にしても意外とカッコいいバージョン
border: 1px solid #000000; /* 枠線の色 */
padding: 0px;
box-shadow: 0px 0px 10px #ff0000; /* 影の色 */
background-color: #ffffff;} /* 記事全体の背景色 */
こんな感じで枠線と影の色を変えるだけで十分わかりやすくカッコよくなります。
ヘッダーと横並びメニューだけ作ってしまえばこれだけで十分見栄え良くなりますよ。
是非お試しください。
[ 屋号 ] デザイン・ラボ 『画像屋』
[ 担当 ] 竹内
[ 電話 ] 090-6054-7129
[ 時間 ] 12時～24時 年中無休
[ ホームページ ] http://a-hp.net/