Blog SEO

【3分で完了】キークエストのプリロードの改善方法をご紹介【WordPressブログ】

2020年6月28日

・表示速度のキークエストのプリロードの改善方法を教えて欲しい!

こんな悩みを解決します。

この記事の信頼性

大学で学校の勉強をする傍ら、副業でブログ収益6桁を稼いでいる僕が、ブログ運営についてわかりやすく解説します。

ブログのサイトスピードが計測できる「PageSpeed Insights」ですが、以下のような画面が出てくることありませんか?

キークエストのプリロードの改善方法

『キークエストのプリロード』を改善するように求められますが、具体的にどうやって改善すればいいかわからない人も多いはず。

そこで今回は、キークエストのプリロードの改善方法について紹介します。

この記事の内容

✔ キークエストのプリロードとは?
✔ 3分でできる改善方法

この記事を読めば、具体的な改善方法がわかるので、さらにサイトスピードを上げることができますよ。

キークエストのプリロードとは読み込む順番を変えること

プリロードとは、『pre(先に)load(読む)』という意味です。

ブログはHTMLなど、様々なコードからできていますが、それぞれ読み込む順番というものが存在します。

コードの読み込む順番を変えることで、サイトの表示速度を変えることができるのです。

「読み込む順番」が変わると、サイトスピードが変わるんだ~、程度でOKです!

それでは、具体的にキークエストのプリロードを改善していきましょう。

キークエストのプリロードの改善方法

この作業はとても単純なので、3分くらいあれば終わりますよ。

具体的な作業手順は以下の5つです。

■キークエストのプリロードの改善方法
➀問題があるキークエストを右クリック
➁リンクをコピー
➂Wordやメモに貼り付け
➃プリロードコードに挿入
⑤〈head〉~〈/head〉にコピペ

それでは早速作業していきましょう!

キークエストの部分で右クリックしてリンクをコピー

まずは、自分のブログのサイトスピードを「PageSpeed Insights」で測定します。

キークエストのプリロードの改善方法

「キークエストのプリロード」の部分に表示されたリンクを、『右クリック』『リンクのアドレスをコピー』で、リンクをコピーしてください。

人によっては3つほど表示されますが、表示されたリンクの数だけコピーしてください。

Wordやメモにリンクをコピペ

キークエストのプリロードの改善方法

先ほどコピーしたリンクを、上のようにWordやメモなどにコピペしてください。

プリロードコードをコピペしてコードを作成

次に、以下のコードをコピーして、リンクと同じ場所にコピペしてください。

コード

<link rel="preload" as="font" type="font/woff" href="URL" crossorigin>

キークエストのプリロードの改善方法

上が「リンク」、下が「コード」

コードの中に、「URL」と書いてある場所がありますので、その部分にリンクをコピペして挿入しましょう。

キークエストのプリロードの改善方法

「URL」の部分にリンクを挿入

〈head〉~〈/head〉にコピペ

最後に、上のコードを〈head〉~〈/head〉にコピペします。

まずは、WordPress管理画面から、『外観』➔『テーマエディター』を選択してください。

キークエストのプリロードの改善方法

『親テーマ』に切り替えて、『テーマヘッダー(header.php)』の部分を開きます。

※テーマをいじるので、念のためバックアップを取っておきましょう。

すると、〈/head〉という場所が見つかるので、直前の部分に先ほどのコードをコピペしましょう。

コードが3つある場合は3つともコピペしてください!

コピペが完了したら、『ファイルを更新』を押して完了です。

完了したら、再度サイトスピードを測定してみましょう。

実はアフィンガーだと安全にキークエストのプリロードを改善可能!

WordPressテーマアフィンガー5

当ブログでも使用しているアフィンガー5の場合、コードを〈/head〉の部分に挿入する必要はありません。

実は、アフィンガーの管理画面から挿入できます!

WordPress管理画面から、『AFFINGER5管理』『AFFINGER5管理』をクリックして、『その他』を選択します。

下の方にスクロールしていくと、「コードの出力」という部分がありますので、『headに出力するコード』の部分に先ほどのコードをコピペすれば完了です。

ちなみに、〈/body〉に出力したいコードがあるときも、同じようにすることができます。

こうすることで、安全にキークエストのプリロードを改善することが可能です。

アフィンガー以外にも同じような場所があるかもなので、確認してみてください!

まとめ:キークエストのプリロードを改善してサイトスピードを上げよう!

今回は、キークエストのプリロードの改善方法について紹介しました。

■キークエストのプリロードの改善方法
➀問題があるキークエストを右クリック
➁リンクをコピー
➂Wordやメモに貼り付け
➃プリロードコードに挿入
⑤〈head〉~〈/head〉にコピペ

ステップは多いですが、3分くらいあれば完了できるので、時間があるときに改善してみてください。

サイトスピードの改善方法については、以下の記事で詳しく紹介しているので、参考にしてみてください。

関連記事:
>【SEO対策】サイト高速化のためにやった5つのこと【解決策あり】 (opens in a new tab)">>>【SEO対策】サイト高速化のためにやった5つのこと【解決策あり】

-Blog, SEO