Web フォントの読み込みを最適化する方法をご存知ですか?

Web フォントの読み込みを最適化する方法をご存知ですか?
タイトル通りです!

一般的に使用される font-family はブラウザの組み込みフォントを読み込みますが、CSS3 の新しいタグ @font-face を使用して TTF フォントを読み込むと、生成されるトラフィックが非常に大きくなります。特に中国語フォントの場合。

最近はフォントも多様化しています。フォントをスムーズに読み込むにはどうすればいいでしょうか?

今日、China Fonts http://font.chinaz.com/ からいくつかの中国語フォントをダウンロードし、ブログに貼り付けて読み込もうとしましたが、読み込みが非常に遅いことがわかりました。

中国語のTTFフォントは8M以上あります。読み込みと表示にはどれくらい時間がかかるのでしょうか?

それから、この中国語フォントのウェブサイトはどうやってこんなにたくさんのフォントをロードできるのかと思いました。フォントの中には画像もありますが、入力したフォントをプレビューする機能も提供されています。

解決策は何でしょうか?ご存知の方はご返信ください。

<<:  MySQLの使い方の詳細な説明

>>:  Angularの親子コンポーネント通信の詳細な説明

推薦する

Vueはデジタル千単位区切り形式をグローバルに実装します

この記事の例では、Vue がデジタル 3 桁区切り形式をグローバルに実装するための具体的なコードを参...

SQL における distinct と row_number() over() の違いと使い方

1 はじめにデータベース内のデータを操作するための SQL 文を記述するときに、いくつかの不快な問題...

MySQL フラッシュリストとダーティページフラッシュメカニズム

1. レビューMySQL の起動後にバッファ プールが初期化されます。バッファ プールは N 個の空...

Docker が PostgreSQL を起動するときに複数のデータベースを作成するためのソリューション

1 はじめに「DockerでPostgreSQLを起動する方法といくつかの接続ツールのおすすめ」の記...

CSSはletter-spacingプロパティを通じて単語間の間隔を制御します。

letter-spacing プロパティ: 文字間のスペース (文字間隔) を増減します。このプロ...

MySQL PHP 構文の簡単な分析

まずcharAt関数の基本的な構文を見てみましょう文字 = str.charAt(インデックス) c...

MySQL 起動エラーを解決する: エラー 2003 (HY000): 'localhost' の MySQL サーバーに接続できません (10061)

このエラーは初心者によく発生します。この記事では主に、エラー 2003 (HY000): '...

Win7x64でのMySQL 5.7.18解凍版のインストール方法

関連記事: Win7 x64 に解凍版の mysql 5.7.18 winx64 をインストールする...

VMware 15 仮想マシンに Ubuntu 18.04 をインストールするグラフィック チュートリアル

ここ数年、私は自動化とコンピューターを行ったり来たりしてきました。最近は、機械学習に関連するプロジェ...

HTML 内の CSS および JS リンクのバージョン番号 (キャッシュを更新)

背景検索エンジンで「.htaccess キャッシュ」というキーワードを検索すると、ウェブサイトのファ...

MySqlエスケープの詳細な使用例

MySQL エスケープエスケープとは、エスケープ文字の本来の意味を意味します。エスケープ文字の目的は...

JS ES6 変数分割代入の詳細な説明

目次1. 脱構築とは何か? 2. 配列の分割3. 配列モードと代入モードの統一4. デフォルト値の構...

IE8は優れたエクスペリエンスを提供します: アクティビティ

今日は IE8 ベータ 1 (以下、IE8 と略します) をチラ見しました。IE8 は素晴らしい体験...

MySQLユーザーと権限管理の詳細な説明

この記事では、例を使用して MySQL ユーザーと権限の管理について説明します。ご参考までに、詳細は...

CSSはcalc()を使用して現在の表示画面の高さを取得します

まず、CSS3 の相対的な長さの単位を見てみましょう (詳細なチュートリアルを参照してください)。相...