2011-07-27 12 views
10

私はウェブサイトで働いていて、現在@ font-face tehnique(this + this)を使ってフォントを読み込んでいます。 特殊文字の一部が正しく読み込まれていないことがわかりました - >ŠĐŽČĆšđžčć。 これは、それらの文字がフォント自体に存在することです。ここでは、>@ font-faceとcufon

enter image description here

そしてもちろん - だから、私は結果は以下の通りです ...私がする@ font-faceのフォントとcufonフォントでテストページをアップロードテスト... を作りましたコードです - >

<html> 
    <head> 
     <script type="text/javascript" src="cufon-yui.js"></script> 
     <script type="text/javascript" src="ReprobateCRO_400.font.js"></script> 
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" /> 
     <script type="text/javascript">Cufon.set('fontFamily', 'ReprobateCRO').replace('h1');</script> 
     <style type="text/css"> 
      @font-face { 
       font-family: 'ReprobateCROLASTRegular'; 
       src: url('reprob_cro_last_last-webfont.eot'); 
       src: local('ReprobateCROLASTRegular'), 
        url('reprob_cro_last_last-webfont.eot?#iefix') format('embedded-opentype'), 
        url('reprob_cro_last_last-webfont.woff') format('woff'), 
        url('reprob_cro_last_last-webfont.ttf') format('truetype'), 
        url('reprob_cro_last_last-webfont.svg#ReprobateCROLASTRegular') format('svg'); 
       font-weight: normal; 
       font-style: normal; 
      } 
      h2{ 
       font-family:ReprobateCROLASTRegular; 
      } 
     </style> 
    </head> 
    <body> 
     <h1>--> CUFON --> šđžčć ŠĐŽČĆ</h1> 
     <br/><br/> 
     <h2>--> @FONT-FACE --> šđžčć ŠĐŽČĆ</h2> 
    </body> 
</html> 

これまでのところ、私はwidnwos1250、UTF8からエンコードを切り替えしようと試みてきたが、何もする@ font-faceのtehniqueで動作するようだ...

だから、私は2つを持っています質問...する誰がここで何が起こっているのか知っていますか?そして、もし私が@ font-faceのcufon instedを使うと切り替えると、ページの読み込みが遅くなるでしょうか? (cufonはJSを使用してフォントを読み込みます)

ありがとうございました!

+1

私は何かが欠けする必要がありますが、それは私には正しいよう... –

+0

@Andrejあなたが使用しているブラウザは? –

+0

@ font-faceの特殊文字はすべての現代のブラウザでうんざりしています。クロム、ファイアフォックス、IE> 7、オペラ、サファリでテストされています...すべて同じ場所に見えます... – Andrej

答えて

9

私は最近、ウェブフォント集約的なWebサイトに取り組んでいるうちに、@ font-faceに多くの問題を抱えていました。オンラインのWebフォント生成ツール自体が有罪であることが判明しました。彼らは単に問題の原因を特定することは非常に困難であったために問題の多くが生じた悪い.woff/の.ttf/.SVG/.OTFファイルを生成しました。

私の経験上、100%有効な発行無料ウェブフォントを提供する唯一のオンラインウェブフォント生成サービスはFont Squirrelです。また、あなたのケースで問題になるかもしれないフォントサブセッティングのような有用なものもたくさんあります(つまり、生成されたウェブフォントに追加の文字を含めるよう指定していませんでした - セルビア語/クロアチア語は、間違っているとは思わない)。

0

あなたはフォントの問題を解決したようです。私が経験したことは、font-faceとcufonの両方が潜在的にデフォルトのテキストの短いフラッシュを持つほど遅くなるということです。それはあなたのホストとユーザーの接続に依存します。どちらの方法も比較的重いダウンロード(JSまたはフォントのいずれか)が必要です。

他のものはすべてIMHOと同じですが、font-faceも使用できます。少なくともブラウザはフォントファイルをキャッシュする方が良くなっているので、最初のページが読み込まれた後にレンダリングを高速化することができます。 cufonを使用すると、常にJSをロードして実行する必要があります。ロード時間のその部分を決してなくすことはありません。

0

実装は良好です。

しかし、あなたがfont-faceを使用したとき。あなたが使ったフォント。あなたが使用したいすべての文字を持っている必要があります。あなたがそれを使用するときに、.ttfまたはこれまでにすべての文字と特殊文字を持つ必要があります。

Cufonを使用したとき。 Cufonジェネレータは、あなたのために余分なフォントの手紙を作る。 Cufonのフォントジェネレータで。フォントの余分なものをたくさん選ぶことができます。

あなたはそれを理解していますか?

1

H2に間違ったフォント定義があります。一重引用符がありません。

今は次のとおりです。

font-family:ReprobateCROLASTRegular; 

は次のようになります。

font-family:'ReprobateCROLASTRegular'; 
関連する問題