Swell高速化のやり方と完全マニュアル
SWELLで高速化するには？サイトスピードを上げ、快適に読めるようにしよう
サイトの表示スピードを上げたい、SWELLを使えば高速化できるけどどうすればいいのか分からない。
本記事では、そんな悩みを持っている人のために、SWELLを使って高速化させる方法をご紹介します。実際にサイトのスピードが上がった事例もありますので、本記事の内容を参考に取り組めば、サイトのスピードが改善できる可能性があります。
それでは、SWELLでサイトのスピードを高速化させる方法を紹介しています。
SWELLで高速化させる方法7選
参照：https://swell-theme.com/
まずは、SWELLで高速化させる方法を7つご紹介します。https://suhara-webworks.com/wp-admin/post.php?post=916&action=edit
設定画面で「高速化」を選択する
まずは、設定画面を開きます。
そして、「SWELL設定」を開きます。
WordPressのダッシュボードから「SWELL設定」に行き、右に「SWELL設定」が表示されます。また、右クリックで表示させてもいいでしょう。
そして、「SWELL設定」の中の「SWELL設定」に行き、「高速化」のタブがあるはずです。
こちらが表示されていれば問題ありません。
そうしましたら、以下にて順番にSWELLで高速化する方法をそれぞれ紹介します
キャッシュ機能を使う
SWELLで高速化させるためには、キャッシュ機能を使いましょう。
このキャッシュ機能を活用できれば、サイトデータの読み込み時間が短縮可能です。
先述した「SWELL設定」内の「SWELL設定」の「高速化」設定の一番上に行きましょう。
「キャッシュ機能」の中にあるものに全てチェックマークを入れましょう。
これで終了です。
遅延読み込み機能を変える
そして、遅延読み込み機能です。
遅延読み込みは、ページを表示した際にページ表示を早くさせる方法です。
画像には表示されませんが、レイアウトの読み込みを後回しにします。
ただし、あくまで読み込みを分散させています。そのため、ページの表示速度に変化はありません。体感的に表示速度が速くなったように感じるだけです。
では設定していきましょう。
やり方ですが、キャッシュ機能設定の下にスクロールしていくと、「遅延読み込み機能」があるはずです。
以下の3つにチェックを入れてください。
- 記事下コンテンツを遅延読み込みさせる
- フッターを遅延読み込みさせる
- スクリプト(lazysize.js)を使って遅延読み込みさせる
「スクリプト(lazysize.js)を使って遅延読み込みさせる」は、性能的に良くこちらにチェックをしておくことをおすすめします。
ファイルの読み込みを変える
また、「ファイルの読み込み」もしましょう。こちらの設定では、SWELLのCSSをインラインで読み込むようにします。
インラインで読み込めば、表示速度の高速化が期待できます。
設定方法は、チェックマークを入れるだけで完了します。
これで設定完了です。
ページの遷移高速化
最後は、ページの遷移高速化です。
この設定は、ページの遷移が速くなるだけです。
また、検索結果からページを読み込む際、ファーストビューは速くならないため注意してください。
やり方は表示にシンプルです。
「SWELL設定」にある「SWELL設定」の「高速化」で一番下にある「ページの遷移高速化」にいきましょう。
「Prefetch」もしくは「Pjax」にチェックマークを入れましょう。これで設定が終りました。
不要なプラグインを読み込まない
その他、不要なプラグインは使わないようにしましょう。
使っていないプラグインがあると、全てのページで無駄に読み込んでしまいます。
例えば、「contact form 7」のお問い合わせフォームを作るプラグインがあった際は、お問い合わせページだけCSSやJavaScriptのみ読み込まれるのが望ましいはずです。
しかし、標準では全部のページを読み込んでしまいます。使ってページのみCSSやJavaScriptを読み込む設定にすれば、速度をアップすることが可能です。
dashicons.min.cssを読み込まない
「dashicons.min.css」というファイルが存在します。Wordpress標準のCSSで存在し、多くの人は活用していないCSSファイルでしょう。
こちらは管理画面で使っているアイコンフォント用のものであるからです。自分のサイトに不要だと思うのであれば、削除してもよいでしょう。
サイトのスピードを調べる方法
SWELLでの高速化が完了すれば、次はサイトのスピードを調べてみましょう。ブログやサイトのスピードが改善できたのか、確認することが大切です。
サイトのスピードをチェックするためには、「PsgeSpeed Insights」を使ってください。こちらのツールを使えば、サイトのスピードを確認できます。
参照：PageSpeed Insights
画像表示にかかる時間、高速化するための施策、高速化できない理由など、こちらも把握できます。分析可能ですので、スピードアップ改善のためには使わないのはもったいないほどです。
なぜ表示速度を高速化させた方がいいのか
サイトの表示速度を高速化させた方がいい理由を以下にて詳しく紹介します。
読者がストレスなく閲覧できる
まず、サイトやブログで表示スピードが早いと読者がストレスなく、快適に閲覧できます。表示されるのが遅いと読者はイライラして離脱してしまう可能性が高くなります。また、直帰率が高くなるとも言われています。
また、
”2017年と2018年のGoogleの調査によると、ページ表示速度が1秒から3秒になると直帰率が32%増加、6秒になると106%増加、10秒まで遅くなると123%増加すると報告されています。また、表示に3秒以上かかるモバイルページからは53%のユーザーが離脱しているそうです。”
引用：グーグル / Find Out How You Stack Up to New Industry Benchmarks for Mobile Page Speed
なので、アクセスされないということは、自社の売り上げの減少にもなりかねないため、表示速度を上げる施策をするのは忘れないようにしましょう。
SEOで有利になる
また、表示速度が早いとSEOで有利になります。その理由は、GoogleはSEOで評価するためにも表示速度を指標にしているからです。
”検索ユーザーはできるだけ早く質問に対する答えを見つけたいと考えています。研究によると、ユーザーはページの読み込み速度を非常に気にかけています。読み込み速度これまでもランキング シグナルとして使用されていましたが、デスクトップ検索を対象としていました。そこで 2018 年 7 月より、ページの読み込み速度をモバイル検索のランキング要素として使用することになりました。
これを「Speed Update」と呼びますが、対象となるのは、ユーザーがかなり遅いと感じるようなページのみで、ごくわずかな割合のクエリにしか影響しません。そのページがどのような技術を使用して制作されたかに関係なく、すべてのページに同じ基準が適用されます。検索クエリのインテントは依然として非常に強力なランキング シグナルです。そのため、関連性の高い優れたコンテンツを含むページであれば、読み込み速度が遅くても上位に掲載される可能性があります。”
引用：ページの読み込み速度をモバイル検索のランキング要素に使用します | Google 検索セントラル ブログ | Google for Developers
自社のサイトがSEOで上位に表示されれば、売り上げ拡大にも直結します。SEOで有利になり利益拡大のためにも、表示速度を改善しておくことをおすすめします。
Google Chromeに低速度だと思われる可能性がある
また、表示速度が遅いと自社のサイトは「低速度」だと思われてしまうことがあります。
Googleによりますと、以下のようになっています。
”速度は、Chrome において当初から基本方針の 1 つとなってきました。ウェブ ブラウジングで瞬時表示のエクスペリエンスをユーザーに提供するという課題に、当社は絶えず取り組んでいます。その上で、読み込みが高速だと当社が考えていたあらゆるウェブページにアクセスし、さらにエクスペリエンス向上の余地について調べました。ウェブはさらに改善が可能であると私たちは考えています。サイトの読み込みが遅くなる可能性がある場合はそのことがユーザーに分かるようにし、一方で配信の高速なサイトは優遇します。
将来は、Chrome により、ユーザーにとって読み込みが速い典型的なサイトと遅いサイトを見分けるための明確なバッジを付けるようになることが考えられます。それは複数の形を取る可能性があり、当社ではさまざまなオプションを使用して実験を行い、ユーザーにとって最も価値があるものがどれかを調べる計画を立てています。
バッジが意図しているのは、読み込み遅延の履歴を見て、一般的に表示が遅くなる仕方でサイトが作成されている場合に、そのことが分かるようにすることです。さらにこれを拡張して、端末やネットワークの状態に基づき、ユーザーにとってページが遅くなりがちな場合に、それを識別できるようにすることも検討しています。”
引用：Google Developers Japan: さらに高速なウェブへの移行に向けて (googleblog.com)
これを読んでドキッとした方もいるかもしれません。
高速サイトと低速サイトが識別され、バッジが付与される可能性があるようです。ブラックリスト的にならないよう、表示速度は高速化させておくのはベストです。
おすすめできない高速化する方法
最後に、おすすめできない高速化する方法をご紹介します。
JavaScriptを無効化する
まずは、JavaScriptを無効化することです。
JavaScripが遅い場合、プラグインを使って読み込まない方法で高速化する方法もあるのですが・・・
よく理解できないため、無効化する人がいますがNGです。
場合によってはページが表示されなくなることもありますので、JavaScripの無効化はやめておく方が無難です。
CSS、JavaScriptを圧縮する
CSSファイルや、JavaScriptのファイルを圧縮できるプラグインを使用して、高速化もできますが、そもそも「SWELL」はすでに圧縮済みなのであまり効果は期待できないです。
まとめ
本記事では、SWELLを使って高速化させる方法をご紹介しました。
サイトやブログの表示速度がアップすれば、読者は快適に閲覧できます。また、SEO対策にもなり、売り上げ拡大にもつながります。
快適に利用するためにも、SWELLを使って高速化させておくことをおすすめします。
弊社では、ホームページを高速化に関するご相談も受け付けております。
よろしければまずは軽いご相談からお問合せ願います。
