【Xserver】簡単SEO対策!新機能XPageSpeedで高速化

「XPageSpeed」とは、エックスサーバー社が2022年8月29日に提供を開始した、表示速度改善機能です。「XPageSpeed」を使用することで、Webサイトのデータ表示は最適化され、ページの読み込み時間を短縮することが可能です。導入は、エックスサーバーのサーバーパネル(管理画面)で手軽に機能のオン・オフを行うことができるので、非常に便利な機能です。全プラン無料で利用できます。が、sv10001.xserver.jp 以降のサーバーが対象です(すぐに利用したい場合は、最新サーバーに移行することで可能となります。)
この機能がどのくらい表示速度改善につながるのかを検証してみましたので、ご紹介します。また、導入に伴って発生したサイトヘルスの勧告に対する対策についてもご紹介します。

XPageSpeedの紹介広告
(出典:https://www.xserver.ne.jp/functions/xpagespeed.php)
スポンサーリンク

XpageSpeed導入結果

WordPressテーマは、Cocoonです。まず、XpageSpeedを導入した結果を紹介します。私のブログサイトで2つのページで確認します。

サイトURL:https://gungii.com/

[ 携帯電話 ]

XPageSpeed導入前と導入後の比較(携帯事例1)

パフォーマンスが64から84にアップしています。携帯でこれほどアップするのは驚きです。

[ デスクトップ ]

XPageSpeed導入前と導入後の比較(デスクトップ事例1)

デスクトップもすこしですがアップしています。

サイトURL:https://gungii.com/cssindex-info/

[ 携帯電話 ]

XPageSpeed導入前と導入後の比較(携帯事例2)

別のページですが、やはり携帯は大きくアップしています。

[ デスクトップ ]

XPageSpeed導入前と導入後の比較(デスクトップ事例2)

デスクトップもアップしています。

スポンサーリンク

Xserverの設定

XpageSpeedの設定

「XpageSpeed設定」をクリック

Xserverのサーバーパネルにログインして、「XpageSpeed設定」をクリックします。

Xserverのサーバーバネルのホーム画面

ドメインの選択

XpageSpeedを導入するドメインを選択します。

ドメインの選択(Xserverのサーバーバネル)

設定

ONかOFFを選ぶだけで簡単に実装をすることができます。
各項目を「ON」に選択して、「確認画面へ進む」ボタンを押します。そして確認画面で確認して「変更する」をクリックします。

XPageSpeedの設定(Xserverのサーバーパネル)

ここで注意書きが表示されていますので、導入後はチェックして、異常があればOFFに戻します。

XPageSpeedの注意書き(Xserverのサーバーパネル)

注意:
XPageSpeed設定をONにした場合、ブラウザ環境やWebサイトの仕様によっては、Webサイトの表示が崩れてしまう可能性があります。特に、CSSやJavaScriptでアニメを動かしたり、レイアウトを操作している場合、CSSやJavaScriptの設定をONにすると、正常に動作しない可能性もあるので、そのような場合には設定項目をOFFにしましょう。

設定完了

「XpageSpeedが完了しました。」と表示されたら終わりです。簡単です。

XPageSpeedの設定完了メッセージ

やはり、レンタルサーバーはエックスサーバーがお薦めです。

【12ヶ月以上の契約で利用料金が実質半額!】

ビジネスプランの36ヶ月契約の場合は、最大71,280円キャッシュバック!
より長期のご契約ほどキャッシュバック金額がアップします!

キャンペーン期間中に、新規にお申し込みいただいたサーバーアカウント

キャンペーン期間:2023年1月13日(金)12:00 ~ 2023年2月3日(金)12:00まで

プラン契約特典の「独自ドメイン永久無料特典」

サーバーご契約者様が、独自ドメインを1つ無料でご利用いただけます。
「.com」や「.net」などの人気ドメインが、サーバー契約が続く限り永久無料です。

エックスサーバー

 

Cocoonの設定

Cocoonでは、XpageSpeedと同様の機能が「高速化設定」でできますので、競合しない様に「高速化設定」を外して運用します。チェックを全て外しました。

Cocoonの高速化設定画面

注意:外さずに動かしても異常はみられませんでした。(問題ないのかも知れません)

サイトヘルスの対策

XPageSpeedの導入は問題なく、思った以上に良い結果でしたが、サイトヘルスで「ページキャッシュは検出されませんでしたが、サーパーのレスポンスは良好です」と表示されるようになりました。

現象

WordPressの管理画面のサイトヘルスステータスで、「ページキャッシュは検出されませんでしたが、サーパーのレスポンスは良好です」と表示されるようになりました。
推奨項目であって、「パフォーマンスやユーザー体験の改良など、サイトにとっては有益と思われるものの、致命的な問題ほど高い優先順位ではない項目です。」ということなので、そのままでもよさそうですが気になりましたので、ググってwordpress.orgで対処法を見つけましたので、ご紹介します。
「永続オブジェクトキャッシュを使用してください」と表示された時と全く同じです。

WordPressのサイトヘルス画面

原因

明確な原因はわかりませんが、XpageSpeedを導入すると表示されます。XpageSpeedをOFFにすると表示されなくなります。
ただし、高速化の効果が高いので、これを解決してXPageSpeedは導入したいと思います。

対処

wordpress.orgのコミュニティにチェックを無効とする方法が載っていましたので、これを実施します。「永続オブジェクトキャッシュを使用してください」という表示自体を停止する方法が記載されていたサイトと同じサイトの記事に「ページキャッシュ」のチェックを無効とする方法も記載されていましたので、これを実施することとしました。

Wordpress.orgのコミュニティ画面

英語のサイトなので翻訳をかけて参照します。

コードの取得

function disable_full_page_cache_check( $tests ) {
    unset( $tests['async']['page_cache'] );
    return $tests;
}
add_filter( 'site_status_tests', 'disable_full_page_cache_check' );

Cocoonの子テーマのfunctions.phpに追記

functions.phpの選択

WordPressの管理画面から「外観」→「テーマファイルエディター」を選択して、表示された画面右側のテーマファイルからfunctions.phpをクリックします。

functions.phpの選択(Cocoonの子テーマ)
functions.phpの表示

functions.phpが表示されますので、最終行に取得したコードを追記します。私の場合はいつくか追記していますが、初めての追記の場合は「//以下の子テーマ用の関数を書く」の下に追記すればOKです。

functions.phpの編集画面表示
追記

「追記」したら、「保存」をクリックして閉じます。

関数の追記(functions.phpの編集画面)

結果

関数の追記の結果(WordPressのサイトヘルス画面)

このマークが表示されると安心ですね!

コメント