だいぶブログもカスタマイズして、ほぼもういじるところが無いような感じになってきてしまったのですが、数日前にフォントを変更してみたんです。
そしたら美大に通っている友人から軽いバッシングを受けて、フォントについていろいろと教えてもらったので共有したいと思います。
フォント
自分がここまでしてきたカスタマイズって、デザインと言うよりかは機能を追加するような感じなんですよね。
例えばフォトショとかイラレとか触ったこともないですし、ヘッダーの背景は青いまんまですし。
そこで気分を変えるために、ブログタイトルの「Yukihy Life」のフォントを「Google Fonts」で変えてみたんですよ。
とにかく特徴のあるタイトルにしたかったんです！
デフォルトはこんな感じなのを
Googleフォントでこんな風にしてみました。
どうです？
フォントのイメージも、どことなくアドベンチャー感が出て、男らしさと可愛さを何となく感じさせて特徴も出てるなあって思って自分的には満足していたんです。
で、その友人は僕がカスタム記事をあげる度にいろいろ評価をしてくる習性があってですね、今回はどんな感想がくるのかなあと思って見せたんです。
そしたら
友人「えっ、これはさすがにありえなくね？」
って………
えっ？？
僕としてはいたってマジメなのに！！！！
思わずムキー！( *｀ω´)ってなってしまいそうでしたが、その友人曰く、「このフォントは全体的に見ると合ってないよ」とのこと。
「ほうほう。では友人よ、そなたがこの無限にあるGoogleフォントから最適なものを選んでみよっ！」
って聞いてとりあえず画面を見せてやったんです。
705個あるから選んでみよ！
そしたら「これっ」って
「………。 お前普通そうなの選んでんじゃねえよ！！俺はもっと、個性を求めてるんだよ！！」
と思わず声を大にして突っ込みました。僕としてはもっと特徴のあるものが欲しかったのですが…
ちなみに友人の名誉のために言っておくと、友人は美大生ですがデザイン科ではなく油絵科なので、特に専門的なことは分からないけど、何となくこれなんだそうです。
結局現在のトップ画面は友人が言ったやつにしてみました。
で、なんでこのフォントを選んだのかを聞いてみたら、かなり話が長かったのですが、とりあえず要約すると、
- フォントって言うのはそこまで大きく変えなくとも、十分にオシャレだし個性を出すことができるものなんだ
ということらしいです。
どういうことかというと、その友人は
友人「シャネルのフォントってどんなんだったか覚えてる？」
と聞いてきました。僕はシャネルのフォントが浮かばなかったのでググってみました。
「シャネル公式サイト 」から
友人「これってそんな特徴のあるフォントだと思う？」
僕「う〜ん。思ったよりそんな無いかも」
友人「そう、多分お前がやろうとしていたほど、特徴を出したりはしてないんだよ。だけど人ってのは不思議なもんで、上のフォントを見ると何となくシャネルっぽい高級感を思い浮かべることができるんだ」
僕「ほうほう」
友人「それは何でかっていうと、企業のロゴとかってのは、骨格となるようなフォントを、フォントデザイナーが修正したりしてほんの微妙にだけ変えたりしてくらしい」
僕「ほうほう」
友人「どこが変わってるのかはパッと見分からなくても、その微妙な変化を僕たちは自然に感じてるんだよ」
僕「ほうほう」
友人「文字の太さだったり、文字の間隔を気をつけることによって、そのロゴのオンリーワンのものが出来上がるって訳。だから別に個性を出すときに、変に特徴を求めたりすることは無いんだよ」
僕「ほへ〜」
ということらしい。
これらのことって知ってる人から見たら当然なのかもしれないけど、自分にとってはわりと目からウロコな事実でした。僕の頭の中には
- 明朝体→堅苦しそう
- ゴシック体→ちょっと柔らかい感じ
- 丸字ゴシック→かわいい
- 手書き風→かわいい
ぐらいの、ザックリとしたイメージしか持ってなかったんです。
こういった「ザックリとしたものの間をどう変化させるか」しか考えずにGoogleフォントを眺めることしかできなかったのですが、ゴシック体一つとってももの凄い量のフォントがあるらしくて、例えばさっきのだと、
なんか、何となく分かります？矢印で指したところに若干の特徴があるの。
「u」と「h」にくぼみがなかったり、「f」の左側が出てなかったり。
こういったほんのちょっとの部分が、パッと見たときに何となく脳裏に焼きつく印象になるんだそう。
「へー」っと思いつつ、他にも長々と話していたのですが理にかなってるなあと感じることができ、友人のいう通りにしてみることにしました。
しばらく友人が話したあと、
「この本かなり面白いよ。フォントについていろいろ書いてあるから読んでみなよ」
と一冊の本を渡してくれました。
で、これを今日の午前中に読んでみたんです。文字は少ないのであっさりと読めました。
そしたら友人が話していたことがほぼ書いてあって、「友よ、お前この本をそのまんま言っただけやんかっ！」と一人ツッコミをしていました。「シャネル」じゃなくって「ルイ・ヴィトン」だったけど。
ルイ・ヴィトンのロゴは、Futura(フツラ)というフォントで組まれています。
(中略)
FuturaはMacにも標準搭載されていて、 他にもいろいろなところで使われている有名フォントです。つまり、どこでも見かけるし、つかおうと思えばすぐ使える。そのフォントを使ってロゴにするとき、文字になにか付け加えたりしていない。それなのにこの落ち着き、高級感。どうしてなんでしょう？
一回友人の話を聞いた後だったので、すんなり受け入れることができました。
この本にも書いてあるのですが、フォントを選ぶのに厳密なルールなんてものはなくって、もう直感で選んじゃって良いみたいです。
そう言った意味では僕の最初の選び方も良かったのかもしれないですが、何か深まって良かったです。ホッコリしました。
色に関して
すごくどうでも良いことですが、最近はデザインに関してみんな推してるこの本
を読んでます。これ、もの凄く良いです。意識せずにやってたことも多いのですが、こういうふうにデザインを言語化してくれると、応用力が高まる気がします。
あと配色に関して、実は「Yukihy Life」の文字、白じゃなくって若干黄色にしてるんです。
これも実は友人が「タイトルはうっすらとした黄色にした方が良いよ」といってくれたのでそのままやってみたんです。
そしたら、Webデザインは配色のルールというものがあることを最近知って、ブログをパッと見たときの配色が「7:2:1」に分けると綺麗にまとまるんだそう。
で、自分は「7:2:1」が「白(背景色)：青：黄」と自然になっている訳なんです。
ただタイトルの黄色がないと、そのルールが適用されなくなるんですよね。
ちなみに「7:2:1」の「1」の部分は、「2」の捕色を入れるといいらしくって、さっき青の補色って何なのかなあ？って調べてみたら見事に黄色でした。
友人は補色については当然知ってての助言だったらしいのですが、いやあ、見直しちゃいました。マジで。
と、言うことで最近気づいたフォントや色使いについて書いてみました。けっこう、驚きじゃなかったでしょうか？(´Д` )
具体的な導入法はこちら
はてなブログのカスタムまとめはこちら
