![見出し画像](https://assets.st-note.com/production/uploads/images/144132462/rectangle_large_type_2_7e33571cc849df388406539963573ba0.png?width=800)
【 現役デザイナーが本気で物申す! 】デザイナーのnoteの見出し画像...余白もバランスも大事、だけどそもそも....
noteの見出し画像を毎回デザインしている私が物申します。
デザイナーでnote書いています、という方の中で時々見かけるのが….
読めない見出し画像
読めないんですよ!見出し画像の内容の文字が!
例えばこんなデザインの見出し画像
![](https://assets.st-note.com/img/1718426997305-QDjKg762P4.png?width=800)
パソコンで見るにはギリギリ見えるだろう内容も
スマホになると途端に読めなくなる。
バランスのためにはしょうがない!と言う人もいます。
でも「デザイン」とは何のためにあるのでしょう?
![伝える  伝わる  デザイン 伝える手段](https://assets.st-note.com/production/uploads/images/144208735/picture_pc_a1e6c79378fe399c89dfe1e92df7a2d8.png?width=800)
「デザイン」とは、伝える手段です。
読めなければ何の意味もなさないものです。
個人による色の感じ方、年齢による見え方の差や理解力に関係なく、より多くの方に正しく情報が伝わるようにすることが、グラフィックにおけるユニバーサルデザインです。
なので文字を小さくデザインするというのは論外です。
例外もありますけどね、読んでもらわなくてもいい文字であればデザインの中の一環となるので問題はありません。
⬇️この記事の見出し画像のようにね。
では、これまでの私の記事を見ていただきましょう。見出し画像を確認してみてください。
かなり大きな文字で読めないなんてことはないですよね?(英語だけど….)
文字サイズは公開前にスマホでもチェックしましょう。
見出し画像の作成はCanva。
例題の読みにくい文字は
「komugi Designers Blog」の文字でフォントサイズ「16」
「このキャッチフレーズからデザイナーが学べること」の文字は「15」での作成です。
フォントサイズ「15」だとスマホではもう読めない大きさです。
今回の見出し画像の例題のデザイン
直すとするならば、ほんのちょっとのことです。
でも、ほんのちょっとの修正が、見る人にはとてつもなく重要になってくるのです。
クリックやタップされて読まれるか?は見出し画像次第、と言ってもいいでしょう!
では、例題の見出し画像直していきます。
例題の見出し画像ちょっとバックの背景がうるさいので
少し排除しました、そして白ベタを大きくし文字を大きく変更しました。
![](https://assets.st-note.com/img/1718499076315-zmDfQ1nIFY.png?width=800)
いかがでしょうか?読みやすくなりましたね!
「komugi Designers Blog」の文字サイズ
「このキャッチフレーズからデザイナーが学べること」の文字サイズが両方とも「25」
試しにもう少し上記の2つの文字を小さくしてみましょう。
「komugi Designers Blog」の文字「19」
「このキャッチフレーズからデザイナーが学べること」の文字「19」
![](https://assets.st-note.com/img/1718498395550-CVKdbezXiN.png?width=800)
英語の「komugi Designers Blog」が読みにくい。
日本語の「このキャッチフレーズからデザイナーが学べること」は小さいですが何とか読める。
同じ文字の大きさで、なぜ読める読めないが生じるのでしょうか?
それは「コントラスト比」
白ベタに紺色の文字はコントラスト比が強く、反対にオレンジベタで白抜き文字はコントラスト比が少し弱い。
試しに「このキャッチフレーズからデザイナーが学べること」の文字も
オレンジベタ白抜き文字にしてみましょう。
![](https://assets.st-note.com/production/uploads/images/144209790/picture_pc_774c56dc0dce1d9380c6bd0fee2919bc.png?width=800)
オレンジベタを紺色に変えてみると
![](https://assets.st-note.com/production/uploads/images/144212463/picture_pc_bbb61219ca48474803ced05263113161.png?width=800)
字は小さいですが、オレンジベタよりは読みやすいです。
いかがでしたでしょうか?
見出し画像の文字サイズについて書かせていただきました。
この記事を見たデザイナーさん達、小さくまとまるんじゃないぞ!
◾︎まとめ
文字を入れた見出し画像は文字が読まれてなんぼ
文字サイズはCanvaで作成するならば最小で25までが好ましい、それより小さくなると見にくくなる
文字カラーはコントラストに気をつけよう。ベタを入れて白抜き文字にしてもコントラスト比で読みづらくなる
デザインにおいて余白も大事、バランスも大事
でも、1番大事なのは....
どう読まれるか?
ではないでしょうか?
では、良きデザインライフを〜
\ もっと小麦脱平のデザインの話を読みたい! /
という方は、こちらの書籍、マガジンをどうぞ
◾️noteマガジン
小麦脱平の「Design Hack」
◾️Kindle書籍
『秒でデザインできるたったひとつの方法』
『Design×Kindle文章術&デザイン術が学べる!初心者にもわかりやすいKindle本』
◾️小麦 脱平のKindle書籍一覧
╲見出し画像のデザイン依頼受付中!/
╲ヘッダーデザイン依頼受付中!/
╲電子書籍の表紙デザイン依頼受付中!/
この記事が気に入ったらサポートをしてみませんか?