サイトスピード改善

Webフォント(ttfファイル)をgzip通信で圧縮し、できるだけ軽く表示(最適化)する方法

Webフォント(ttfファイル)をgzip通信で圧縮し、できるだけ軽く表示(最適化)する方法

Webフォントを使用すると、少し洗練された印象のWebデザインになりますが、ページの読み込みが遅くなります。ページの読み込みが遅くなると、基本的にはSEO的に不利になります。

逆に、ページスピードを改善するだけで、オーガニック検索による訪問数が増加することも少なくありません。

弊社代表ブログを例に、Webフォントを利用しているWebサイトのPageSpeed Insightsのスコア改善方法をご説明いたします。

PageSpeed Insights(ページスピードインサイト)で弊社ブログを解析

まずは、弊社ブログをページスピードインサイトで、解析してみます。結果は下記の通りです。

スマホ 48点。

PC 55点。

様々な企業様のWebサイトを解析・分析させていただいておりますが、やはり特別に対策をしていないと、大体ページスピードスコアはこのくらいです。画像が極端に少ないブログなどは、対策をしていなくても最初から70~80点出ることもあります。

さて、赤いビックリマークで「修正が必要」と記載されている項目を確認してみます。

Webフォント(ttfファイル)のデータが大きく重たいようで、圧縮するように提案されています。

gzip圧縮とは

Webフォントを軽く表示させるためには、gzip圧縮転送を用います。

「gzip」とは、ファイルを「圧縮」する方法の1つです。圧縮というのは、独自のデータ形式でファイルサイズを一時的に小さくすること。つまり、ウェブページのサーバーとユーザーのパソコン間で通信しているデータサイズを少なくするのが、今回設定する「gzip圧縮」の効果なんです。サイズが小さくなることで、ページの表示がより高速になることはもちろん、転送量が減るので利用しているサーバによっては、料金の節約にも繋がります。

引用元:gzip圧縮でCSSやJSなどの転送量を減らす方法

で、結局どうすれば…?

コピペでそのまま使えるソースを公開してくださっている方がいました。

コピペで使える.htaccess設定ソース

#Gzip
Addtype font/opentype .otf
Addtype font/eot .eot
Addtype font/truetype .ttf
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/x-javascript application/javascript text/text font/opentype font/truetype font/eot
#End Gzip

引用元:WEBフォントもgzip通信で圧縮する方法

上記を.htaccessファイルに貼り付けアップロードすると反映されます。

ページスピードスコアの改善結果

スマホ 67点。

PC 83点。

Webフォント(ttfファイル)をgzip圧縮したのみで、大きくスコアが改善されました。

スコアの表示が黄色くなっていますが、さらに緑色判定になるまで改善するためには、他の提案項目も改善する必要があります。

デザイン要素や画像が多いサイトは、その分ある程度重くなりますので、基本的に満点に近づけることは非常に困難です。70~80点以上は維持できていれば、合格ラインだと思います。

Googleが検索順位を決定する評価基準は、ページの読み込み速度以外にもたくさんあります。ページスピードの改善で満点を目指すよりも、ある程度クリアできたら、他のSEO対策やサイト改善を進めていく方が、効率良く上位表示やアクセスアップを実現できます。

その他のページスピード改善方法については、以下の記事をご参照ください。

ページスピードインサイト・ページスピード高速化に関する記事一覧

フリーランスエージェントおすすめ2選

ITプロパートナーズ … 「週2~3日」「リモート」など魅力的な案件多数。単価も高いので少ない稼働日数でも十分な固定収入を確保。
安心して自分のビジネス収入の柱づくりにも注力できる。セミリタイア生活におすすめのエージェントNo.1!

Midworks(ミッドワークス) … 「フリーランス」と「正社員」の良いとこ取りをした働き方を実現!保障・保険・費用補助・福利厚生が充実。
他のエージェントに類を見ない、安心して独立できる保障の手厚さが特長。週3~5日の常駐案件メイン。

  • この記事を書いた人
渡部 瞬

渡部 瞬

働く時間を減らしながら豊かになる一人経営マガジン『ナノ経営®』

創業10年。Webコンサルタント。
一人社長セミリタイアコンサルタント®。
ナノインスパイア株式会社 代表取締役。

ビジネス収入や資産収入の柱を構築しながら自由と余裕を手に入れ、自分の人生を100%楽しむ一人経営の知識・情報・考え方などを発信します。

お金・時間・心の余裕に溢れ、いつもワクワク生き生きと輝くセミリタイア一人社長を増やします。

一人でも多くの人とともにより良くなっていけるよう、お互いに成長していけるよう、微力ながら執筆していきます。

24歳 Web制作・コンサル起業 ▶︎ 25歳 株式会社設立 ▶︎ 29歳 5年連続年商アップ、最高年商なのに判断を誤り初の大赤字、しかも多忙すぎて挫折 ▶︎ 事業再生専門・公認会計士の先生の門下生となる ▶︎ 経営・戦略・ビジネスモデル・会計・マーケティング・問題解決などを原理・原則から学び修業 ▶︎ 31歳(2019年) 独自の経営改善により、働く時間は半分以下に↓↓、手元に残るキャッシュは大幅アップ↑↑

-サイトスピード改善