83

私は、Webページにフォントを埋め込むための適切な解決策（特にSEO側から）を見つけようとしています。これまでのところ、Firefoxでも動作しないW3Cソリューションと、このかなりクールなソリューションを見てきました。2番目の解決策は、タイトルのみです。全文に利用できる解決策はありますか？Webページの標準フォントにうんざりしています。

ありがとう！

4

6 に答える 6

139

この質問が最初に尋ねられて回答されてから、状況は変わりました。@font-face 埋め込みを使用して、本文テキストのクロスブラウザー フォント埋め込みを機能させるために、多くの作業が行われてきました。

Paul Irish は、他の複数の人々からの試みを組み合わせて防弾 @font-face 構文をまとめました。実際に記事全体 (上部だけでなく) を読むと、1 つの @font-face ステートメントで IE、Firefox、Safari、Opera、Chrome などをカバーできます。基本的に、これは OTF、EOT、SVG、および WOFF を何も壊さない方法でフィードできます。

彼の記事からの抜粋:

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('Graublau Web Regular'), local('Graublau Web'),
    url("GraublauWeb.woff") format("woff"),
    url("GraublauWeb.otf") format("opentype"),
    url("GraublauWeb.svg#grablau") format("svg");
}

Font Squirrelは、そのベースに基づいて、TTF または OTF ファイルをアップロードし、他のタイプの自動変換されたフォント ファイルを取得できる@font-face ジェネレーターを含む、さまざまな便利なツールをまとめました。デモ HTML ページ。Font Squirrel には、何百もの @font-face キットもあります。

Soma Design は、 FontFriend Bookmarkletもまとめました。これは、ページ上のフォントをオンザフライで再定義するので、試してみることができます。FireFox 3.6+ でのドラッグ アンド ドロップ @font-face サポートが含まれています。

最近では、Google はGoogle Web Fontsの提供を開始しました。これは、オープン ソース ライセンスの下で利用でき、Google のサーバーから提供されるさまざまなフォントです。

ライセンスの制限

最後に、WebFonts.info は、ライセンスに基づいて@font-face の埋め込みに使用できるフォントのリストを wiki にまとめました。網羅的なリストであると主張しているわけではありませんが、その上のフォントは、埋め込み/リンク用に (おそらく CSS ファイルの属性などの条件付きで) 利用できるはずです。ライセンスを読むことは重要です。なぜなら、フォントのダウンロードでは明確に推進されていない制限がいくつかあるからです。

于 2009-12-27T22:27:59.597 に答える
9

Facetype.jsを試してください。.TTFフォントを Javascript ファイルに変換します。完全な SEO 互換性があり、FF、IE6、および Safari をサポートし、他のブラウザーでは正常に低下します。

于 2009-02-15T11:22:38.023 に答える
6

いいえ、最先端のブラウザーを使用している人だけに対応したい場合を除いて、体型に適した解決策はありません。

Microsoft には独自のフォント埋め込み技術であるWEFTがありますが、私はそれが何年も話題になっているのを聞いていませんし、それを使用している人も知りません。

ディスプレイ タイプ (見出し、ブログ投稿のタイトルなど) には sIFR を使用し、ボディ タイプ (Trebuchet MS など) にはあまり使用されていない Web セーフ フォントの 1 つを使用しています。すべての Web セーフ フォントに飽き飽きしている場合は、用語の定義が狭すぎる可能性があります。主要な OS に同梱されているストック フォントのこのマトリックスを見てください。ほぼすべての Web ユーザーをキャッチします。

たとえばfont-family: "Lucida Grande", "Verdana", sans-serif、一般的なフォントカスケードです。OS X には Lucida Grande が付属していますが、Windows の場合は、Lucida Grande と同様のサイズと形状の文字を持つ Web セーフ フォントである Verdana が提供されます。Linux ユーザーは、ほとんどのディストリビューションのパッケージ マネージャーに存在する Web セーフ フォント パッケージをインストールしている場合、Verdana を取得するか、通常のサンセリフにフォールバックします。

于 2008-10-20T23:17:32.353 に答える
4

そして、それもありそうにありません-EOTは、IEでのみサポートされるかなり制限のある形式です。Safari3.1とFirefox3.1（現在のアルファ版）の両方、そしておそらくOpera 9.6はTrueTypeフォント（ttf）の埋め込みをサポートしており、少なくともSafariは同じメカニズムでSVGフォントをサポートしています。離れたリストは、しばらく前にこれについて良い議論をしました。

于 2008-10-20T23:06:55.853 に答える
3

商用オプションのTypekitをチェックしてください(無料のパッケージも利用できます)。

使用されているブラウザー (形式と形式) に応じてさまざまな手法が使用され@font-face、EOTフォントのライセンスに関するすべての問題も処理されます。IE6までのすべてをサポートしています。

Typekit の仕組みに関する詳細情報は次のとおりです。

于 2009-12-27T22:29:50.013 に答える
2

私はこれをしばらく前に尋ねました。答えは、基本的には機能しないということです。:(

于 2008-10-20T23:17:28.627 に答える