0

私は Head.js、Google Web Fonts を使用し、Web 上の他の場所からいくつかのコンテンツ (プレースホルダー画像) を取得しています。

私が気付いたのは、ページの読み込み時にスタイル設定されていないコンテンツが表示され、見出しのフォントが適切に読み込まれますが、適切なウェイトではなく、適切なウェイトが読み込まれるということです。

ヘッダー テキストでこの奇妙な動作を引き起こしている原因について何か考えはありますか? スタイルなしから適切な要求されたフォントに移行するだけではいけませんか?

また、JavaScript が無効になっている人に優しい FOUC を停止する最善の方法は何ですか?

ありがとう！

詳細:

Google が提供する Javascript メソッドを使用して、使用する 3 つのフォントを挿入しています。'Istok+Web:700:lating' を読み込んでいることがはっきりとわかります。これは、700 の重みのみを指定する必要があることを意味します。

この方法のために、私は @font-face をまったく使用しません。普通のものであるかのように単純に font-family です。

ただし、LESS.js を使用していますが、ネットワーク アナライザーからは、大幅な速度低下は発生していないようです。

4

1 に答える 1

0

これは単に、ブラウザがすべてのコンテンツをダウンロードする前に Web サイトを表示していることが原因です。すべてのフォントの太さに対して 1 つの @font-face css ルールがありますか?それとも、通常/太字のフォントの太さに対して別のルールがありますか? また、Google CDN からフォントを読み込むのは便利ですが、最速の方法ではないことにも注意してください (新しい http 接続を確立する必要があるため)。//編集してクイック使用ボタンを使用すると、Google は常に異なるウェイトに対して異なるフォント ファイルを設定します...

head.js を使用している場合、スタイルが設定されていないコンテンツのフラッシュを防ぐことはできません。これは、ブラウザが取得したすべてのものをできるだけ早く表示する傾向がある一方で、すべてが並行してロードされるためです。全員が迅速に接続できることを祈るばかりです。そして、なぜあなたはまったく気にする必要がありますか？読み込み中は、常に何らかの半ページが表示されます...

于 2012-10-26T09:38:08.773 に答える