NaeNote

読者です 読者をやめる 読者になる 読者になる

NaeNote

気楽に生きたい外資コンサルのブログ

ブログタイトルにおすすめの英語Webフォント16選。主にクール、かっこいい系

デザイン デザイン-クリエイティブ
このくらいシェアされています
スポンサーリンク
【お知らせ】 12月12日(月)まで!Amazonが本気の割引セール「CYBER MONDAY SALE」を開催中。会場はこちら!

f:id:nice_and_easy:20161025121123j:plain

こんにちは、NAEです。

本ブログのヘッダーデザインを変更しました。

画像を差し替え、グローバルメニューまで手が入り、思っていた以上に手間がかかってしまいました。

本当は、フォントを変えたかっただけなんです。しかし、フォントに全てが引っ張られました。

そう、ブログタイトルにおけるフォントの威力はすごいんです。

そんなフォントの威力を十二分に発揮できるおすすめ英語Webフォントを紹介したいと思います。

今回はそんなのお話。

ブログのヘッダーデザインにおいてはフォント選びは超重要

ブログのヘッダーは背景画像と文字(タイトル)でできています。

それぞれの役割は

  • 背景画像:おおまかなブログの雰囲気を伝える
  • 文字:タイトル名という情報を伝える

だと思うんですが、文字に使うフォントもブログの雰囲気を色濃く語る要素のひとつです。

むしろ、ブログヘッダーは「このブログの名前はこれだよ!」ということを伝えるためにあるので、読む側はむしろ文字に注目するのでは。

それだけ、タイトルのフォントは読者へ多く物語るともいえます。

ブログタイトルにおすすめの英語Webフォント16選

では、実際にフォントの違いによってどれだけ雰囲気に差が出るのか、試してみましょう。

使うのはGoogle Fontsで公開されている英語Webフォント。フォントの雰囲気のみを比べるため、背景画像とフォントの色、文言は同じものを使っていきます。

Google Fonts


と、ただ羅列してもツマラナイので、ブログタイトルにおすすめの英語Webフォント16個を厳選してみました。

実際に、ぼくがヘッダーデザインを考えたときに「これいいかな?」と思ったものを含みます。

ブログタイトルという役割をきちんと果たすため、

  • インパクトがあり印象に残りやすい
  • パっと見でちゃんと読める

ということを条件に選出しています。

それではどうぞ。

デキるオトナのおしゃれ感や親近感を出すなら手書き系フォント

はじめに手書き系のフォントです。

書き味が独特で個性が強く、好き嫌いが分かれやすいのが特徴です。


NaeNote

Nothing You Could Do

はてなブログの人気テーマ「DUDE」にも採用されている、サイン風の手書きフォントです。

フォントで語らせ、ラフでアーティスティックな雰囲気を出すならこれがおすすめ。


NaeNote

Rock Salt

英語ネイティブの外人の中には、すべてのアルファベットを大文字で書くスタイルの人がいます(中学のときの英語の外人教師がそうでした)。

そんなネイティブの日常的な書き味をそのまま伝えるのがこちらのフォント。こなれた手書き英字フォントを使うならこれがおすすめ。ただし他のフォントと比べて大きめの作りなので、サイズ指定の際は注意を。


NaeNote

「Indie Flower」

丸文字に近いこちらの手書きフォントはやわらかい雰囲気を出したい人にはおすすめ。

大文字小文字の文字の高さが似通っているため、かわいい系ながらもアイコンのようなまとまり感を出すことができます。


NaeNote

Zeyada

より躍動感のある手書き(走り書き)フォント。ぼくの書くアルファベットがこういう書き味なので特別枠として選出しました。


エレガントでモダンなオシャレさを醸し出す、セリフ体の装飾系フォント

文字の書き出し・書き終わりに装飾のついたフォント群です。

公的な文書や新聞などに用いられるフォントのため、きちんとしておりエレガントな印象を与えることができます。


NaeNote

Gravitas One

縦線と横線の太さのコントラストが印象的なこのフォント。文字の横幅も大きく、1文字1文字ががっちりしているため、重厚感を醸し出すことができます。

昔の英字新聞のような雰囲気のため、中身がしっかりしたブログなんだろうなという印象を与えてくれます。


NaeNote

Cinzel Decorative

まるで化粧品のパッケージのようなエレガントな書体です。Nの字の斜め線がいい味出してますね。

筆先に向かって細まっていく丁寧で細身なグリフは、繊細さや華奢さをあらわすのにちょうどいいのでは。


NaeNote

Flamenco

後に紹介するサンセリフ体にほど近いフォントです。文字が同じ太さの線で構成されているのが特徴。

タイプライターのような雰囲気のため、淡々と何かを物語るようなイメージを与えてくれます。


NaeNote

Lobster

クールなはてなブログのテーマ「Vancouver」の作者であるブライアンねこさんが自身のブログタイトルに使っているのがこちら。

シンプルな装飾のついた大文字、そして筆記体のようにつながる小文字のコントラストが小気味よく、またキレイに揃ったイタリックはまとまり感を出しやすいため、誰にでも使いやすいフォントです。


NaeNote

Kaushan Script

大流行したマンガ「NANA」のロゴをほうふつとさせるフォントです。

躍動感あふれる一方、文字のカーブ率や跳ねの方向がきれいにそろっています。元気が良い上品さを出すにはうってつけですね。


NaeNote

Geostar

太めの縦線が中抜きになっているのが特徴。斜め線が極力排除されたミニマルなデザインで、セリフ体ながらもデジタルな雰囲気を漂わせます。

背景とのコントラストさえ気をつければ一気に個性を引き出せるフォントです。


しっかり感、サイバー感など、太さで雰囲気が変わるサンセリフ体ベースの装飾系フォント

文字の書き出しや書き終わりに装飾がないサンセリフ体。何かと正対しているような、ドライでがっしりした印象を与えやすいのが特徴です。

一方、文字のグリフの角を丸めることでポップなイメージに仕上がっているものも。


NaeNote

Poiret One

真円と直線をベースとした細身の書体。上品なシンプルさがある一方、eの字の角度をはじめ文字のところどころに遊び心が散りばめられているおもしろいフォントです。

シンプルでミニマル、そしてオシャレ。3点揃ったとても使いやすいフォントです。


NaeNote

Audiowide

スターウォーズやターミネーターのロゴと似た雰囲気のこちらのフォント。サイバーな雰囲気を出すにはうってつけです。

書き味は好みが別れるところですが、テック系のブログであればしっくりくるかもしれません。


NaeNote

Fredoka One

うって変わってミキハウスのようなかわいい書体。文字の角が丸められてるのに加え、カーブも真円ベースなのでよりかわいさが際立っています。

ほんわかした印象を与えるこのフォント、育児や生活などがテーマのブログにはピッタリなのでは。


NaeNote

Coda

こちらは長方形をコンセプトとした書体。普段使いのゴシック系フォントに比べ、若干ですが長方形の形を前に打ち出すことで、全体に統一感を持たせています。

パっと見ではあまり味がない普通のフォントですが、よく見るとちょっと違う。隠れたオシャレを楽しみたい人はこちらを検討してみては。


NaeNote

Plaster

1文字1文字に縦線が施されている特徴的なこのフォント。ドトールコーヒーを思い出しますね。

とてもアクが強いため、紹介している他のフォントと比べると可読性は落ちます。が、タイトルはロゴであると考えるのであれば、このくらい特徴があったほうが良いのかもしれません。


NaeNote

Gruppo

エレガントでシャープな細身のグリフ、そしてゆったりとした横幅がオトナの余裕を感じさせるフォントです。

当ブログで採用したフォントでもあります。


注意点:フォントを変えるときは背景画像の変更も考えて

以上でブログタイトルに使いたいフォントを選べたかと思うのですが、大事なのはこの後。

背景画像とフォントの整合を取ること

たとえば、「Crafty Girls」というかわいい系の手書きフォントを使ってみましょう。

NaeNote


大人っぽくてシャープな背景画像なのに対し、子供っぽさ満点の文字が使われている。なんだかバランス悪くて気持ち悪くありませんか?

背景画像とフォント、各要素が持つ雰囲気があまりに不整合を起こしていると、そのデザインはサイコパス的な気持ち悪さをただよわせてしまいます。

背景はコレが好き、フォントはコレが好き、で決めるのもいいですが、組み合わせたときの総体としての整合性を忘れないようにしたいですね。

フォントにこだわるなら背景画像もそちらにあわせる。逆も然りです。

まとめ:ブログタイトルのフォントはブログの雰囲気を司る

以上、 ブログタイトルにおすすめのWebフォントの紹介 でした。

ブログタイトルはブログの顔。ここで与える印象がかなり決まってしまうので、できればこだわりたいところです。

いっそのことプロに頼むという手もありますが、ブログのコンセプトや想定読者があまり定まってない方は、一旦自分でWebフォントを使ってみてはいかがでしょうか。


関連記事

スポンサーリンク