5

Google Web フォントの読み込みが原因で発生したGoogle Pagespeedのインサイトから、「レンダリング ブロック ファイルとしてのスクリプト」エラーを削除しようとしています。インターネットから、 Web Font Loaderを使用してフォントを非同期にロードするように指示されます。次の JavaScript をフッターに配置しました。フォントは適切に読み込まれますが、ページ速度のインサイトの結果にレンダリング ブロック エラーが表示されます。

注: Font Render のブロック エラーは、モバイル テストでのみ表示され、デスクトップでは表示されません。

<script>
      WebFontConfig = {
         google: {
            families: ['Archivo Narrow:300,400,700']
         }
      };

      (function(d) {
         var wf = d.createElement('script'), s = d.scripts[0];
         wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
         wf.async = true;
         s.parentNode.insertBefore(wf, s);
      })(document);
</script>

編集:

body タグを閉じる前にスクリプトを追加しようとすると、引き続きレンダリング ブロック ファイル エラーが発生します。

<script>
   WebFontConfig = {
      google: {
         families: ['Archivo Narrow:300,400,700']
      }
   };

   (function(d) {
      var wf = d.createElement('script'), s = d.scripts[0];
      wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
      wf.async = true;
      document.body.appendChild(wf);
   })(document);
</script>

ここに画像の説明を入力

4

0 に答える 0