Luxeritas(ルクセリタス)

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ

スポンサーリンク

兄弟ブログの『ぶろぐしる~』ですが、『ルクセリタス』→『SWELL』へテーマ変更しました。(2021年6月にテーマ変更)

 

1年以上かけて書いた記事は130記事以上・・・。
デザイン崩れを修正するのに1ヶ月かかりました。

注意ポイント

正直に言って、デザイン崩れを修正するのは大変な作業でした。

テーマ変更を決断するなら、早いほうが断然良いです。
私自身、テーマ変更に悩んでいた時間は無駄だったと感じました。

 

記事にまとめたので、『SWELL』が気になる方は要チェック!
→『【ルクセリタス→SWELL】レビュー!デザイン崩れ対処はどんな感じ?

\え?まだ、クラシックエディタ使いよん?もったいなw/

SWELL

SWELLのブロックエディタを体験しないのは損!

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 私困 232x300
困っている人
ページスピードインサイトのモバイルスコアの上げ方を教えてほしい

そんなお悩みを解決します。

 

本記事の根拠

  • モバイルスコア100・パソコンスコア100までアップさせました

 

それでは、本題に入ります。

 

スマホの表示速度を改善した手順

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 結果 1592450956

結論です。
本記事は、モバイルスコアを『56』→『100』へアップさせた手順をご紹介します。

 

モバイルスコア

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ Luxeritasモバイルスコア100

 

 

もちろん、パソコンスコアも100

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ Luxeritasパソコンスコア

 

 

丸3日調べながら作業しました・・・。

本記事では、丸3日分を凝縮して、『1時間』で高速化できるようにまとめています。

 

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 私困 232x300
困っている人
表示速度が遅い・・・

と悩んでいる方、必見ですよ。

 

私のワードプレス設定情報

ココがポイント

エックスサーバーX10

ルクセリタス親テーマ3.13.0

ルクセリタス子テーマ3.0.3

ポイント

『エックスサーバー✕ルクセリタス=最速』

私はこのように考えています。

 

本記事では、参考にさせていただいたサイトが多くあります。
外部リンク多めですw。

 

下記の11項目がモバイルスコアをアップさせた手順です。

モバイルスコアの上昇が高かった順に並べています。
※私の環境ですので、皆さんには当てはまらない可能性あります。

 

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ img 4776
ばらもん。
やることは多いですよぉ

 

参考

不要なプラグインの削除

ContactForm7の制限

headタグ記述の見直し

画像最適化(webpへ変換)

ルクセリタス高速化設定

エックスサーバー高速化設定

ルクセリタス親子テーマアップデート

アドセンス位置変更

phpバージョンアップデート

ツイッター埋め込み削除(記事)

ルクセリタスアニメーション無効化

簡潔に説明していきます。

 

不要なプラグインの削除

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 掃除 1616039600

可能な限りプラグインを削除しました。
削除した中でも有名なプラグインは、『WordPress Popular Posts』でしょうか。

『WordPress Popular Posts』は、人気記事を表示してくれるプラグインです。
私は人気記事の表示は必要ないと判断しました。

 

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ img 4776
ばらもん。
そもそも、人気記事のランキングって本当に必要ですか?

 

『筆者のおすすめ記事ランキング』を任意で貼るほうがメリットが大きいと考えています。

 

人気の記事って検索流入で読まれていますからね。
本当に読んで欲しい記事は、人気記事ではないはずです。

プラグインを無効化してみて、影響がなさそうなら削除する感じで良いです。
プラグインをガシガシ削除すると、ワードプレスは軽くなります。

 

 

もうひとつ。

注意ポイント

『All in One SEO Pack』はルクセリタスには不要です。

開発者のるなさんも、下記のようにおっしゃっています。

Luxeritas は SEO 最適化してるため、全く不要。

むしろ、プラグインを入れることによって、canonical や description のタグが重複して SEO がマイナスになる。

出典元:お勧めのプラグインとお勧めしないプラグイン(https://thk.kanzae.net/wp/settings/t1270/

ポイント

プラグインは最低限で身軽になろう!

 

ContactForm7の制限

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ メール 1616039620

ContactForm7は、全ページでリードされています。
実は、ContactForm7って重たいんです。

 

functions.phpに追記して、ContactForm7がお問い合わせフォーム以外では動作しないようにします。
あらかじめ、functions.phpのバックアップを取ってから作業しましょう。

 

【WordPress】Contact Form 7 を重くさせない方法!』を参考にさせていただきました。

ポイント

functions.phpのバックアップを取ってから作業しよう!

 

headタグ記述の見直し

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ プログラム 1616039638

headタグに記述していた『Google自動広告』と『FontAwesome』のスクリプト文を削除しました。
ルクセリタスの子テーマをアップデートするときに、小奴らが悪さをしているのを発見しました。

参考記事は→【Luxeritasルクセリタス】アップデート手順!15分で完了したよ

 

 

2つのスクリプト文を削除するだけで、モバイルスコアが10近くアップしました。

ポイント

headタグ記述をもう一度見直してみよう!

 

画像最適化(webpへ変換)

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 最適 1616039662

画像をwebpに変換しました。
高速化でググると『画像最適化』がヒットします。

 

次世代フォーマットでの画像の配信が改善可能ってやつです。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 次世代フォーマットでの画像の配信を改善する

 

使用するプラグインは『EWWW Image Optimizer』です。

 

webp変換時に注意する点は、『.htaccess』の記述場所です。
BEGIN WordPressよりも上に記述してくださいね。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ htaccessの記述箇所には注意

 

注意ポイント

BEGIN~ENDの間に記述すると、上書きされて消えてしまいます。

【画像で解説】EWWW Image OptimizerでWebPを設定する方法』を参考にさせていただきました。

 

私は『11,302点』の画像をwebpに変換しました。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ WEBP変換には1時間以上かかった

ポイント

『.htaccess』はバックアップを取ってから作業しよう!

 

ルクセリタス高速化設定

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ スピード 1616039677

ルクセリタス高速化設定は『サイトスピードが100点に到達した時の設定と施策(ルクセリタス)』を参考にさせていただきました。

 

↑のブログ管理人のKEITOさんもLuxeritasを使われています。
ページ構成がとても参考になりますので、ぜひ一度ご覧になってください。
(KEITOさんもLuxeritasばりにイケメン!)

 

ルクセリタスは個人に合った高速化設定が簡単にできることが魅力です。
『.htaccess』への高速化記述もありますが、エックスサーバーの高速化設定と競合しそうなのでヤメました。

 

ポイント

チェックを付けて即完了!

 

エックスサーバー高速化設定

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ サーバー 1616039695

 

エックスサーバー様様です。
下記の設定をすることで、『最初のサーバー応答時間を早くしてくだしあ』が改善できました。

 

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 最初のサーバー応答時間を早くしてください改善

 

ココがポイント

XアクセラレータVer.2へ変更

ブラウザキャッシュ設定オン

サーバーキャッシュ設定オン

 

step
1
XアクセラレータVer.2へ変更

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスアクセラレータアクセラレータへ変更

 

step
2
ブラウザキャッシュON

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバーサーバーパネルよりブラウザキャッシュオン

 

step
3
サーバーキャッシュON

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバーサーバーパネルよりサーバーキャッシュオン

2020年9月末からは、エックスサーバーのバックアップからの復元も無料になりました。
エックスサーバーであれば、プラグイン『UpdraftPlus』は必要ありません。

 

そもそも、『UpdraftPlus』は容量を食いまくるのでオススメできません。

 

ポイント

エックスサーバーは高速化設定が充実してるよ!

エックスサーバーに興味を持たれた方は→『【知らなきゃ損!】a8セルフバックでエックスサーバーお得に契約

 

ルクセリタス親子テーマアップデート

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ アップデート 1616039765

モバイルスコアに影響はないかもしれませんが、ルクセリタステーマをアップデートしました。
もちろん、親テーマ&子テーマの両方をアップデートです。

 

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ img 4776
ばらもん。
1年以上もアップデートしていなかったからね(爆)

 

先述しましたが、子テーマを初期化したときに悪さをしていたスクリプト文を発見することができました。

 

完全な棚ぼたです。

 

Luxeritasアップデート方法は『【Luxeritasルクセリタス】アップデート手順!15分で完了したよ

 

ポイント

Luxeritasテーマを1年以上アップデートしていない方は要チェック!

 

phpバージョンアップデート

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ php 1616073881

phpをむやみにバージョンアップすると『致命的なエラー』が発生する危険性があります。
本作業は要注意です。

 

ワードプレスのダッシュボードを確認すると、phpバージョンが古いことが判明しました。
たまにはサイトヘルス画面を見ることをオススメします。

 

エックスサーバー側での作業になります。
エックスサーバーのサーバーパネルからphpバージョンを『PHP7.4.13(推奨)』に変更。

 

phpバージョンを上げると速度アップが期待できます。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバーサーバーパネルよりphpバージョン変更

何も考えずに、兄弟ブログのブログ汁(アフィンガー5)も『PHP7.4.13(推奨)』に変更しておきました。

 

やってしまいましたw(致命的なエラー)

 

アフィンガー5のブログ画面が崩れました。
モバイルページは通常通り表示されますが、パソコンページは見事にぐちゃぐちゃですw。
(ページ下部にはデバッグモードと致命的なエラーが発生していますの文字が・・・)

しかし、エックスサーバーなら心配ご無用!
10分もあれば復元完了します。

 

ココに注意

phpバージョンを元に戻す

対象日を選択して復元

先にphpバージョンをもとに戻すことがポイントです。
phpバージョンがもとに戻ったことが確認できたら、エックスサーバー機能で復元します。

 

step
1
期間を指定して自動バックアップデータから復元

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバー復元方法

 

step
2
準備中

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバー復元準備中

 

step
3
正常完了

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ エックスサーバー復元正常終了

ポイント

phpバージョンアップデートは無理にしなくても良いよ!

 

アドセンスの貼り付け位置変更

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ ヘッダー下ウィジェットは削除

ヘッダー下ウィジェットのGoogle AdSense広告をを消しました。
ヘッダー周りは、軽くしておくことがスピードアップに繋がると考えたからです。

 

ついでに、ヘッダー画像も消しておきました。

ポイント

ヘッダー周りは軽くしておこう!

 

ツイッター埋め込み削除(記事)

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 03 ツイッターがモバイルスコアに影響している?

投稿記事の表示スピードは特にひどかったです。
モバイルスコア『22』!!!

 

ツイッター埋め込みがモバイルスコアを下げていることは明らかでした。

上記のスクリプト文は、複数ツイート埋め込みをしている場合はひとつで良いです。
しかし、1つでもツイート埋め込みがあればカナリ重くなります。

 

ツイート埋め込みは極力ヤメておくことをオススメします。

 

 

ツイッター埋め込みの削除×本記事でご紹介している作業をすることで・・・。

 

モバイルスコア『22』だった記事は、『98』へアップしました。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ 2021 03 26 22h12 09

ポイント

ツイート埋め込みは激重だよ・・・

 

ルクセリタスアニメーション無効化

ルクセリタスのアニメーションを無効化しました。

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ ルクセリタスアニメーションオフ

 

体感的には、イチバン効果があったと感じています。

アニメーションの設定をされている方は多いのではないでしょうか。

 

まとめ

【Luxeritasルクセリタス高速化】スマホの表示速度改善したよ img 4776
ばらもん。
いかがでしたか?

ページ表示速度は早いに越したことはありません。

 

注意ポイント

検索上位でも、ページ表示が遅ければ読まれることはありません。
2021年5月のグーグルアップデート以降は、ページ表示速度も考慮される噂もあります。

 

高速化処理をするにあたりエックスサーバーで良かったと心底感じました。
サーバー選びに悩まれている方は『エックスサーバー』をオススメします。

エックスサーバーに興味を持たれた方は『【知らなきゃ損!】a8セルフバックでエックスサーバーお得に契約』の記事をご覧ください。

 

ページ表示速度(特にモバイル)が遅い方は、2021年5月までに対策をすることをオススメします。以上です。

※本記事の作業は必ず自己責任で行ってください。筆者は一切の責任を負いません。

そろそろ、有料テーマを使ってみたいと考えていませんか?

 

結論です。
あなたの貴重な時間を無駄にしないためにも『AFFINGER6』を買うことをオススメします。

Luxeritas→SWELLとAFFINGER6の2つのブログ運営をしている私が理由を解説します。

 

AFFINGER6は¥14,800(税込)です。

サラリーマンの時給平均って『1,486円』らしいです。

サラリーマンの給料、時給換算するとなんと平均「1486円」
出典元:マイナビ学生の窓口フレッシャーズ(https://gakumado.mynavi.jp/freshers/articles/14142

 

10時間、働けばAFFINGER6を購入できるって計算です。

私は、別ブログでLuxeritasを1年以上使い倒しました。
自分なりに、CSSやHTMLをカスタマイズしましたがAFFINGER6の『A』にも及んでいませんw。

正直に言って、CSSやHTMLをカスタムするために費やした時間は10時間は超えています。

 

注意ポイント

ググった時間

デザインを考慮する時間

CSSやHTMLを記述する時間

etc・・・

10時間以上の貴重な時間をカスタムに費やしても、思い通りのデザインにできていないのが現実です。
私は職業柄(得意言語はCOBOL笑)、プログラミングには詳しいと自負していましたが勘違いも良いところでした。

 

繰り返します。
あなたの貴重な時間を無駄にしないためにも、AFFINGER6を買ってください。

あなたがどんなに優れたSEであったとしても、たったの10時間でAFFINGER6並のカスタマイズをすることは不可能です。
¥14,800(税込)で【優れたデザイン✕装飾✕操作性のテーマ】を手に入れることができるなら安いとすら感じます。

 

注意ポイント

失った時間は取り戻すことはできません。
CSSやHTMLに時間を費やすくらいなら、記事を書いていたほうが有意義です。

 

Luxeritasで別ブログを運営している運営していた私が断言します。
『AFFINGER6』を買うということ=貴重な時間を買うこと。

\ブログ汁限定特典付き/

AFFINGER6(特典付き)を手に入れる

 

ドメインパワー=6.4でも1位を取れた検索クエリを教えます

特典の性質上『今月残り2名』!

\期間限定特典(公式)/
『SUGOI MOKUJI(すごいもくじ) [LITE]』
※公式特典は予告なく終了する可能性があります

迷ってるくらいなら購入をオススメします

 

【AFFINGER6をすでに持っている方へ朗報!】

ブログ汁限定特典パスワードをnoteで販売することに致しました!
(価格¥300)

気になった方は『ブログ汁限定特典』をクリック!

-Luxeritas(ルクセリタス)