web-dev-qa-db-ja.com

Helveticaは「Webセーフ」フォントと見なされますか？

フォント Helvetica を web-safe フォントと見なす必要があります。つまり、これは私の [〜＃〜] css [〜 ＃〜] どのデバイスからでもアクセスできますか？

cssfont
38
David

Helveticaは安全ではないだけでなく、著作権で保護されたフォントでもあるため、webfontとしてロードする場合は、使用するためのライセンスが必要です。

実際には、100％安全なWebフォントはありません。これは、ユーザーがデバイスで使用しているフォントに依存するためです。異なるオペレーティングシステムには異なるフォントセットがあります。したがって、次のようにする必要があります。

p{font-family:Arial, Helvetica, sans-serif}

それ以外の場合、サイトは、ユーザーが設定したデフォルトのフォントで視覚化されます（例：Times New Roman）。

安全にプレイしたい場合は、この非常に気の利いたリソース CSSフォントスタック をお勧めします。 「より安全な」フォント、OSによる使用率、およびfallbackの代替を含む使用するコードも表示されます

61
Devin

前述のように、安全なWebフォントなどはありません。しかし、 @ font-face を使用して、サーバーから見つからないフォントを読み込む方法があります。 @ font-faceはCSS2で最初に導入され、フォールバックファイルタイプを含み、 広くサポートされています です。これは100％のソリューションではありませんが、マシンのフォント選択に依存するよりも有望です。

まず、ファイルを通常の静的ホストファイルとしてサーバーに配置します。 WebサーバーのMIMEタイプを構成して、ファイルを適切に処理し、代わりにクライアントに手動でダウンロードさせないようにする必要がある場合があります。

次に、次のようなコードをスタイルシートに実装します。これらは可能な形式の一部にすぎないことに注意してください。それらのすべてを使用する必要はありません。ただし、ファイルへの参照を削除しない場合は、不足しているリソースによる不要な遅延を回避します。

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

その後、要素にフォントを割り当てます。 Helveticaのバージョンを使用したい場合は、次のようにします。

font-family: 'MyWebFont', Helvetica, sans-serif;

Font-faceをロードできない場合は、マシンのHelveticaを使用しようとし、失敗した場合は、sans-serifをロードしようとします。さらに、フォントとマシンフォントを入れ替えることもできます。ただし、スタイルシートが読み込まれた後もフォントが読み込まれるため、帯域幅は節約されません。

最後ですが、最も重要なのは、Helveticaがフリーフォントではないことです。使用するにはライセンスを購入する必要があります。 Linotypeは、必要なWebフォントとライセンスをWebサイトから販売します。価格はページビューに基づいています。ただし、購入後は、WebページまたはWebアプリに埋め込むことは完全に合法です。

12
Bacon Brad

どのデバイスからでもアクセスできる

「anyデバイスで利用可能」のようなものは本当にありません。

埋め込みフォントを使用していない場合は、フォントスタックを使用する必要があるため、最初のフォントが使用できない場合に備えて、いくつかのバックアップオプションがあります。

10
DA01

HelveticaはWindowsのデフォルトフォントセットの一部ではないため、Windowsユーザーには別のセカンダリフォントが表示される可能性があります。それが問題ではない場合は、Helveticaを使用してください。

9
Abektes