web-dev-qa-db-ja.com

デザイナーはどのフォントを使用しますか?

私は貿易のデザイナーではなく、デザインセンスもありません。しかし、運が良ければ会社でフォームを設計する必要があります。しかし、私はあなたがウェブサイトで見るプロフェッショナルな外観を取得しません。デザイナーが使用するフォントを知りたい:

  1. 説明
  2. タイトル(たとえば、ブログ投稿のタイトル)

また、サイズはどうあるべきですか?

1
Kar Cheng

どのサイトやリソースを使用する場合でも、さらに詳しく知りたい2つの用語は、body type表示タイプ

あなたの場合、説明はボディタイプの例である可能性が高く、一貫した読みやすいデザインであり、タイトルはおそらくディスプレイタイプを必要としています-最初にあなたの注意を引くように設計されたもの、例えば新聞。

http://typekit.com/libraries/full?tags=display をご覧ください。これらはすべてあなたに向かって叫ぶように設計されたフォントです。 20フィート先からのポスターでは、それらに気付くでしょう。しかし、これらを使用してブログのエントリ全体を読みたくはないでしょう。

http://typekit.com/libraries/full?tags=paragraph を見てください。これらは体型の例です。それらはすべてき​​れいで読みやすく、長いテキストでも読みやすいですが、タイトルや見出しにはあまり注意を向けません。

過去1〜2年以内に、@ yetanothercoderがコメントで言及した@font-faceプロパティや、前述したTypekitサイトなど、Webサイトでフォントを使用するためのオプションがこれまで以上にあります。無料アカウントの1つでも、サイトに数十の書体を埋め込むことができます。ユーザーはこれらの特定のフォントをインストールする必要はありません。ページの先頭にあるスクリプトがTypekitのサーバーを呼び出し、それを取得して埋め込みます。 CSSでこれらのフォントを制御することもできます。

ほとんどの新しいWebおもちゃと同様に、これらのオプションを使用することに決めた場合、それらをサポートしない古いブラウザーのフォールバックがあることを確認する必要があります。基本的に、font-familyルールを、「arial、helvetica」のように、誰もが確実に持っていると確信しているフォントにカスケードさせます。

そうは言っても、設計しているものの色合いを知らずに、ソリッドボディフォントの例をいくつか示します。

  • ジョージア(かなり一般的ですが、ハンサム)
  • Minion Pro
  • Droid Serif(大きなサイズでの表示にも使用できます)

そして、いくつかの素晴らしい表示フォント:

  • フランクリンゴシックコンデンス(フランクリンには、ボディからディスプレイまで微妙なフレーバーがあり、多くのバージョンがあります。必要に応じて、フランクリンファミリーを使用してサイト全体を設計できます。)
  • FF Meta Web Pro
  • アーバナ

これが役に立てば幸いです。楽しんで。

2
parisminton

好きなウェブサイトのページのHTMLソースを見てみませんか?フォントが何であるかがわかります(静的な画像としてレンダリングされていない限り、それはブログ投稿ではありそうにないようです)

1
John Pickup

デザイナーはあらゆる種類のフォントを使用しますが、ほとんどのフォントはオンラインで使用できないことを忘れがちです。

これが フォントの安全なリスト です。