私が HTML の作業を始めたとき、すべてのブラウザーでレンダリングされる HTML に使用できるフォントの選択肢はほとんどありませんでした。
Arial、Verdana、Times new roman、ジョージア。さて、2003 年からブラウザーは大きく変化しました。すべてのブラウザーに対応する新しい互換性のあるフォントはありますか、それとも 2,000 年前にまだ戻っているフォントですか?
Naraj、あなたが言及しているweb-safe fonts.
のは、すべてのユーザーが自分のマシンに持っているフォントです。
本題に入る前に、フォントの読み込みがどのように機能するかを説明しましょう。Web サイトにアクセスすると、このCSS
ファイルはコンピュータにどのフォント ファイルを探すべきかを指示します。そのフォント ファイルがコンピュータにない場合、表示されません。幸いなことに、ブラウザは賢く、このような場合、Arial などのデフォルトにフォールバックします。
とにかく、参照しているフォントのリストは、箱から出してすぐにほとんどのコンピューターに付属しているフォントのリストです。このため、ユーザーがそれらを持っている可能性が非常に高く、それらを参照すると (別の方法に頼るのではなく) Web サイトが適切に表示されます。一方、Helvetica のようなフォントは、PC には付属していないため、すべてのマシンに搭載されているわけではありません。Web サイトで Helvetica を使用しようとしても、ほとんどの PC ユーザーには表示されません。
これにより、技術的には、どの Web サイトでも任意のフォントを使用できるようになりました。これは、CSS ルールによるもの@font-face
です。これにより、サーバー上のフォントの場所を指定できるようになり、ユーザーはフォントをダウンロードして使用できるようになります。
使用上の注意点は2点あります@font-face
。1 つ目は、ユーザーがフォントをダウンロードする必要があるため、ページの表示に少し時間がかかることです。2 つ目の、より重要な懸念事項は、フォントを使用するにはライセンスが必要なことです。他の誰かがフォントを所有しているため、サーバーに Helvetica をアップロードすることはできません。このように使用するには、https://typekit.com/などのフォント配布サイトからライセンスを購入する必要があります。
他の人が言及したように、 Google Web Fonts@font-face
のように、ユーザーがフォントを使用できる優れた Web サービスがあります。
とはいえ、そのリストweb-safe fonts
はあまり変わっていません。を使用しない場合は@font-face
、おそらく 2003 年の同じフォント リストに固執する必要があります。これは、今年の更新されたリストです。
お役に立てれば!
ブラウザはここでは無関係です。フォントは「システム」から取得されます。これは、ブラウザ自体ではなく、特定のユーザーが使用しているコンピューターを意味します。
フォントはローカル マシンから読み込まれます。
しかし、今では多くのフォント サービスが存在します。優れた無料のフォントは Google フォントです: http://www.google.com/webfonts
試してみてください!
なし。「Web セーフ フォント」はありません。すべてのブラウジング状況で使用できると期待できる単一のフォントはありません。これは、ブラウザではなく、システム (コンピューター) に依存します。要点は、フォントはオペレーティング システムと一部のアプリケーション ソフトウェアに同梱されていますが、通常はブラウザには同梱されていないということです。
Arial、Verdana、Times New Roman、Georgia でさえ異なるバージョンが存在し (そのため、特定のフォント ファミリー名を使用すると、わずかに異なる結果が得られる場合があります)、一部のコンピューターにはそれらがありません。たとえば、Android にはそれらがありません (また、Android で利用可能なフォントは他のシステムにプリインストールされていないため、これだけでも Web セーフ フォントがないことが証明されます)。
で使用されるダウンロード可能なフォント (Web フォントとも呼ばれます)@font-face
は、ページに任意のフォントを埋め込んで、誰もがそのフォントでテキストを表示できるようにするものとしてよく説明されてきました。これは部分的には真実ですが、部分的にだけであり、多くの落とし穴と別のトピックがあります.
あなたはいくつかのことを混同したと思います。face 属性を使用してフォントを定義すると、ブラウザはこのフォントをクライアントのファイルシステムからロードしようとします。見つからない場合は、構成済みのデフォルト フォントを使用します。フォント リストもクライアント ファイルシステムから読み込まれます。
最近のほとんどのブラウザーでは、Web フォントを使用して任意の OS/ブラウザーで任意のフォントをレンダリングできます。
もちろん、多くのフォントは OS 固有であるため、OS X でレンダリングされるフォントは Windows では使用できません。
Web フォントはこれを修正します。Google は、ホストされた Web フォントを提供しています: http://www.google.com/webfonts
You can use any font you want. If that font is available in the user's computer, it will show correctly, otherwise, the browser will default to a certain 'standard' font. If you want to use a custom font that doesn't come with some OSs (or all of them) then you need to use CSS3 @font property, Google Fonts, or other solutions.