「今日はこれを証明しよう」のkeitaさんの記事を見て、自分のブログを見直してみました。
シンプルなデザインって自分が強調したいところが目立つからいいですよね。
これから、実施しようという方の参考になればと思います。
※はてなブログのデザインをマネしたいけど、方法が分からない場合の解説を追記しました。
「ド素人でも3分でおしゃれなブログデザインを実現する11の法則」とは？
- 見出しの上には必ず余白を！
- 画像の幅は記事のウインドウ幅とあわせる
- リンクは青色で下線をいれる！
- ブログカードはクリックされないからやめろ
- 文字は大きくしない
- 色文字は使わない
- ブログ全体に目立つ色を使わない
- ブログにキャラクターを導入する
- 吹き出しを使う
- 記事下をごちゃごちゃさせない
- 固定フッター・追尾サイドバーはやめる
ヨシマツタケシの「ぶろぎんぐ」の確認結果はコチラ。↓↓
11項目中、〇は5個のみ・・・
というわけで、早速１つ１つ対応しました。
11の法則に乗っ取る
1. 見出しの上には必ず余白を！
これは、ブログカレッジで徹底されていたので問題なかったです。
ぼくは、1回1回改行タグ(
)を使って対応していますが、cssで対応する方法もあるようです。
2. 画像の幅は記事のウインドウ幅とあわせる
これは、NGでした。
実はよくわかっておりません・・・
これは調べ中・・・。
3. リンクは青色で下線をいれる！
はてなブログの有名なテンプレート使ってたらこれは問題ないはず。
こうなってない人逆にいるの？(笑)
こうなってない人はちょっとセンスを疑います。
ぼくは、Brooklynを使っています。
シンプルなデザインが好きだったのと、作成者の方がデザインに関する質問に丁寧に答えてくれたのが決め手でした。
4. ブログカードはクリックされないからやめろ
ま、まじですか・・・keita師匠・・・
ブログカードの方がクリックされるのかと思ってました・・・
というわけで、変更しました。
こんな感じ。
丸パクリしちゃいました。(笑)
5. 文字は大きくしない
ごめんなさい、大きくしちゃってました・・・
これ一応言い訳あるんです！
一時期、スマホ表示が太字にならないときありませんでしたか？
その対応で、文字を大きくしていたんです！
というわけで、その設定を戻しました。
6. 色文字は使わない
これは、△です。赤字をちょいちょい使うから
ぼくは、赤字をネガティブなイメージのものや警告のときは使うようにしています。
△にしましたが、自分の中でのポリシーがハッキリしてるので、これは問題なしとします！
なんでもかんでも使っちゃダメですよ
↑こんな感じの時。
7. ブログ全体に目立つ色を使わない
これは問題なし！
サイドバーがちょっとカラフルかもしれませんが。
ぼくは、Brooklynを使っています。
8. ブログにキャラクターを導入する
この吹き出しがキャラクターとして認められるなら〇！
これもキャラクターの一部かな？
まあ、とりあえずこれで行こう。
9. 吹き出しを使う
吹き出しは乱用してます
10. 記事下をごちゃごちゃさせない
ごちゃごちゃでした。
というわけでこれも、得意の丸パクリ。(笑)
こんな感じ↓
レスポンシブデザインの場合は、サイドバーが記事下にいっちゃうから、そこが少し悩みではありますね。
まあ、良しとしましょう！
11. 固定フッター・追尾サイドバーはやめる
これはもともと嫌いなのでやってません。
ぼくこれ嫌いなんですよね～。
邪魔くさい！以上！
【追記】はてなブログのデザインをマネしたいけど、方法が分からないあなたへ
今回、keitaさんのデザインをかなりパクらせて参考にさせていただきました。
はてなブログのデザインをマネする方法を、動画解説しました。
ぼくが例で使った記事下プロフィール部分のhtmlとcssも公開しています。
LINE@でヨシマツタケシと友達になって、「けいたさいこう」と返信してください。全てひらがなを使ってください。
快くパクらせてくれたkeitaさんへの最大の敬意です。(笑)
※プロフィール部分の丸パクリについては、keitaさんに了承をいただいております。悪用厳禁です。
htmlやcssが何かわからない人には少し難しいかもしれません。
まとめ
ド素人でも3分でおしゃれなブログデザインを実現する11の法則を見て、早速対策してみました。
記事に集中してもらうためには大事なことですね。
あとは、良質なコンテンツを増やすのみ！
そして、ブログで稼ぐ！
チャオ！
