私のウェブサイトでカスタムフォントを使用しています。ローカルフォントファイルまたはGoogleウェブフォントを使用して、ページ読み込み時間を考慮すると効率的ですか？
src: local('Ubuntu'), url('fonts/ubuntu.woff') format('woff');
か、単にGoogleのを使用します：
速くなりsrc: local('Ubuntu'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/_xyN3apAT_yRRDeqB3sPRg.woff') format('woff');
、ページの読み込み時間を考慮すると、私は地元のフォントファイルを使用することができますか？
Google Webフォントを使用するテストページとローカルファイルを使用するテストページの2つのGAEアプリケーションを設定しました。キャッシングがないことを確認し、各ページの読み込みに要した時間を記録しました。これはChromeで20回繰り返しました。
結果
コード
のフォント-google.html
<!DOCTYPE html>
<html>
<head>
<title>title</title>
<link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
<link href='both.css' rel='stylesheet' type='text/css'>
</head>
<body>
<h1>This is a heading</h1>
</body>
</html>
フォント-local.html
<!DOCTYPE html>
<html>
<head>
<title>title</title>
<link href='fonts-local.css' rel='stylesheet' type='text/css'>
<link href='both.css' rel='stylesheet' type='text/css'>
</head>
<body>
<h1>This is a heading</h1>
</body>
</html>
フォント-local.css
@font-face {
font-family: 'Ubuntu';
font-style: normal;
font-weight: normal;
src: local('Ubuntu'), url('ubuntu.woff') format('woff');
}
h1 {
font-family: 'Ubuntu';
}
良いアプローチですが、実際には自分のサーバーの設定とビューアーの場所に依存しています。 – alias51
GoogleのAPI both.cssそれはより良い選択肢になるでしょうあなたが使用したフォントはすべてのユーザーのコンピュータにインストールされていない可能性がありますが、Google APIの場合は違いはありません。通常のフォントはサイズがそれほど大きくないので、フォントは読み込み速度と一度違いはありませんユーザはフォントがキャッシュメモリに保存するページをロードする。 –
ウェブ上のコンテンツ配信ネットワークを検索します。 Googleのveriosnはもっと速いかもしれません。 – HerrSerker