21

通常、私"Helvetica Neue"は他のサイトを見ていますが、いくつかのウェブサイトでフォントに使用しています"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue"。

このようにHelveticaNeueを参照する理由はありますか？それとも、私が使用する通常の方法に固執する必要がありますか？

4

3 に答える 3

38

Better Helvetica というタイトルの Chris Coyier による CSS トリックに関するこの記事をお勧めします。

http://css-tricks.com/snippets/css/better-helvetica/

彼は基本的に、すべてのベースをカバーするために次の宣言を推奨しています。

body {
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300;
}
于 2012-08-22T09:46:46.573 に答える
19

彼らは、フォントを参照するために「ショットガン」アプローチを採用しています。ブラウザーは、各フォント名を、ユーザーのマシンにインストールされているフォントと (リストされている順序で) 照合しようとします。

あなたの例"HelveticaNeue-Light"では、最初に試行されます。このフォントバリアントが利用できない場合、ブラウザーは試行"Helvetica Neue Light"し、最後に"Helvetica Neue".

私が知る限り"Helvetica Neue"、「Web セーフ フォント」とは見なされていません。つまり、ユーザー ベース全体にインストールされていることに依存することはできません。"serif"or"sans-serif"を最終的なデフォルト位置として定義することは非常に一般的です。

「Web セーフ」ではないフォントを使用するには、フォント埋め込みと呼ばれる手法を使用する必要があります。埋め込みフォントはユーザーのコンピューターにインストールする必要はなく、代わりにページの一部としてダウンロードされます。これにより、(画像と同様に) 全体的なペイロードが増加し、ページの読み込み時間に影響を与える可能性があることに注意してください。

オープンソース ライセンスの無料フォントの優れたリソースは、Google Fontsです。(使用する前に個々のライセンスを確認する必要があります。) 各フォントにはダウンロード リンクがあり、Web サイトに埋め込む方法が説明されています。

于 2012-08-22T09:42:46.783 に答える
0

フォントを参照してサイトに正しく統合していると仮定すると（おそらく@ font-faceキットを使用して）、自分の方法で参照するだけで問題ありません。おそらくこれはこのようなものなので、一部のブラウザがフォントを正しくレンダリングしない場合に備えてフォールバックがあります

于 2012-08-22T09:41:32.603 に答える