MENU

著者

どんぐり所長

Nobilista公認バッジ

当サイトはリンクフリーです

当ブログ内の記事本文や図解等は、以下の注意事項を守っていただければご自由にお使いいただいて結構です。

【注意事項】

  • 引用元として当サイト名を記載の上、対象記事へリンクしてください。
  • 添削記事などの紹介者のアイコンは転載不可です。

ご不明な点があれば、twitterのダイレクトメールまでお願い致します。

愛用 順位チェックツール

オリジナルグッズ購入

👉 今イチオシのクラウド型 順位検索ツール【Nobilista】愛用レビュー!

【アイキャッチ添削001】donguriWEB|文字のバランスと整列を意識する

はじまりましたアイキャッチ添削。

失礼ながら応募して頂いた画像にちょっとだけアドバイスをさせていただくこの企画。

どんぐり所長
どんぐり所長

ドシドシ参加お願い致します!

まず手始めとして自分の作品を添削していきます。

どういう流れで進んでいくかも含めて最後まで見て行ってくださいね。

目次

今回の作品

今回の作品

作者…どんぐり
掲載サイト…当サイト

掲載サイト・記事・アイキャッチは掲載した時点でのものです。現在は変更されている可能性があります。

どんぐりさんのサイトでは、お金に関する情報を扱われておられます。
このアイキャッチの記事では無料で写真を獲得できる「O-DAN」の紹介をされています。

画像添削

ここからは画像添削をおこなっていきます。

画像割合

写真エリアとテキストエリアの割合が5.5:4.5となっている。

理想の割合は6:4
参考文献:ARULOG 【永久保存版】ブログ初心者でも作れるお洒落なレイアウト5選!

しかし、ピンクエリアのテキストが中心にいない事から、上部の葉っぱは無視してテキストエリアをもっと広くみている。

それを踏まえた上で修正した画像がコチラ。

どんぐり所長
どんぐり所長

概ね6:4になっていますね!

そもそも、もう少しポットとカップを右に持っていきたいですね!

ほめらぎ
ほめらぎ

確かに…!

でも…元画像の問題で画像大きくもしづらいですね…。

ほめらぎ
ほめらぎ
  • 写真とテキストの割合は6:4が理想的
  • 右側テキストが読みやすいが、これは好み
  • 元画像の段階で割合を考えて配置するクセをつけよう!

スタイルバランス

テキストエリアのバランスを確認します。

黒丸が空白エリアの大きさになります。

どんぐり所長
どんぐり所長

上下左右共にバランスがとれていません!

特に左右のバランスが悪いので修正したいところ。

対処法
 テキストエリアの中心にテキストを配置しよう!

文字のバランス

どんぐり所長
どんぐり所長

文字のバランスは概ね問題なし!

文字はなるべく同幅になるようにすると、すっきり纏まります。

カラーバランス

画像のカラーバランスを確認していきます。

色の構成はこちら。

メインカラー  …ライトグレー
サブカラー   …オレンジ
アクセントカラー…ダークグリーン

どんぐり所長
どんぐり所長

3色で構成されていますね!

なるべく3色で構成するのがコツです。
3色以上の色を使えば使うほどごちゃごちゃして纏まらない印象になっていきます。

どんぐり所長
どんぐり所長

文字や素材の色を合わせることで、使用色を3色に抑えてるんだね!

文字のみやすさ

どんぐり所長
どんぐり所長

しっかりと文字が識別できますね!

これだけの文字の明暗差や色相差があればしっかり読み取る事ができます。

フォントも明朝なので細いですがここでは問題なしですね。

総評

スタイルバランスが悪いのに、面倒くさくてそのままにしてます…。

面倒くさがらずに直しましょうか!

ほめらぎ
ほめらぎ
どんぐり所長
どんぐり所長

ハイっ!それ以外は色のバランスもよく、概ね満足した出来です!

画像修正

添削前の画像
どんぐり所長
どんぐり所長

元画像を少し右に修正し、テキストエリアのバランス調整を行いました!

少し良くなりましたね!

ほめらぎ
ほめらぎ
どんぐり所長
どんぐり所長

皆さんもご意見くださいね! またっ!

推奨ザインツール

当サイトでは、無料でもオシャレなデザインが簡単に作成できる、「 Canva 」を推奨しています。無料でも相当なレベルのデザインができるのですが、一度PROにすると無料には戻れなくなってしまいました。その秘密は、下記の記事に。

Canvaを詳しく知る

おすすめWordpressテーマ

私は、導入するだけで一気にお洒落になるWordpressテーマ「SWELL」をおすすめします。デザイン性はもちろん、その操作性は特筆ものです。

SWELLを愛用する私が実際に使用してきた内容を加えた、詳しい記事を書いています。ぜひご参照ください。

SWELLを詳しく知る

トップページへ戻る

お気軽にコメントください

コメントする

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

目次