GoogleがWebサイトの読み込み時間に関する指標を新たにリリースしたことで、苦労を強いられている人は少なくないことでしょう。
この指標は特にモバイルデバイス上でかなり重いと考えられているものの、現在80％以上のユーザーがモバイルデバイスを、10%がタブレットを、そして残りがデスクトップまたはノートパソコンを使用しているのが現状です。こうした中で、モバイルデバイスでの最適化は必要不可欠だと言えます。
大規模なウェブサイトでは、長きにわたって最適化への取り組みがなされてきました。なぜなら、こうしたサイトは時代の先端を行き、成長のためにベストなものを提示する必要があったからです。よってこうしたサイトには改良の余地はさほど残されていません。
最適化が必要なのは、通常、新しく作られたWebサイト、または開発からしばらく時間の経ったサイトです。これらのサイトは表示速度が遅くなる傾向があるため、速度を上げてユーザーエクスペリエンスを向上させるには「最適化」が不可欠です。プログラマーが考慮すべき、基本的な最適化要素は以下の通りです。
- 画像の最適化
- css、jsの最適化
- プログラム（コード）の最適化
- キャッシュとプリローディングの利用
- ホスティングまたはVPS（仮想サーバー）の有効利用
- ホスティング（VPS）の圧縮の有効化、またはCDNの利用
各要素について詳細に説明していきます。わからない点についてコメントを残していただければお答えしますので、お気軽にご連絡ください。
1) 画像の最適化
ほとんどのWebサイトには最適化されていない画像がありますが、通常はGTmetrixツールを使ってどの画像が最適化されていないかをチェックします。そして指示に従いGTmetrixが画像の最適化を行います。画像のダウンロードとアップロードも可能で、誰にでも簡単に使いこなせるツールです。
GTmetrixで「Serve scaled images」が指摘された場合、これは画像が正しいサイズでなければならないことを意味します。
過大なサイズの画像を使用すると、表示する際にそれを縮小する必要が生じます。
例えば、必要サイズが90 × 90のところ、200 × 200の画像を使用すると、プログラムは画像を表示する前に縮小するために多くの時間をかけることになり、これが不必要なリソースを消費します。
このエラーが発生した場合、画像をダウンロードしてPhotoshopやウェブサイト、プラグイン（WordPressのソースコードのみ）を使用して、画像を縮小しましょう。なお、画像のダウンロード・アップロードにはZillaファイルの使用がオススメです。
2) css、jsの最適化
ほとんどのWebサイトには css や js のファイルがあり、多くの場合、読み込みを高速化するために、css や js の Minify（圧縮・軽量化：空白、改行、ノート、中括弧などの空白文字が削除されるプロセス）が行われます。
cssファイルやjsファイルが多数ある場合、Minify後、Webサイトの読み込みを速くするためにそれらを結合することがよくあります。
なお、cssファイルやjsファイルをMinifyするのに役立つサイトはたくさんあります。
注：インターフェースのクラッシュを招く場合がありますので、Zillaファイルを使ってバックアップは必ず取って置きましょう。
3) プログラム（コード）の最適化
現在、多くの異なるソースコードがありますが、各ソースには異なるテーマが多数が含まれているため、コードの最適化ははるかに困難になります。ウェブサイトを設計する際には、こうしたコードがどのように使用されるかに注意を払う必要があります。
例としてはどういったテーマか、最適化は容易か、頼りになるサポートコミュニティはあるか、定期的なアップデートはあるのか、などが挙げられます。
4) キャッシュとプリローディングの利用
どのようなソースコードを使用するにしても、ほぼすべてのWebがキャッシュを作成します。その目的は、以前サイトを訪れた人が2回目以降訪問する際に、サイトを適切に動作させることです。
訪問者がそのサイトを再訪問した場合、既に生成されたHTMLファイルを再利用するためより速く処理が実行され、サーバーは初回のように処理を行う必要がありません。これはページの読み込みを高速化するとともに、ホスティング（VPS）のリソース節約にも役立ちます。
今回のGoogleによるPageSpeed Insightのアップデートでは、Googleはコード内の 「プリロード」機能を使用しているウェブサイトを優遇しています。
あなたがモバイルデバイスの表示速度で90点以上を目指したいのであれば、以下のキーワードは見過ごしてはなりません。 「Preloading content with rel = “preload” + source_name」
5) ホスティングまたはVPS（仮想サーバー）の有効利用
これも非常に重要です。これはWebサイトの安定性に繋がるため、SEO対策としてはより一層重要と言えるでしょう。
SEOは長期的に取り組むべき仕事です。もし経済的に問題がないのであれば、サーバーの安定性を確保するためVPSを1台導入しましょう。稼働時間は長いほど良く、理想的には99.99％です。その後、ホスティングと良いVPSのどちらがより良いのか、評価を行います。
ホスティングサービスでは以下の条件が満たされているかを確認しましょう。
+ 安定性：サイトが表示されない、または「〜〜サイトを表示中」のメッセージがスクリーン左上に長時間表示される。
この状態が常に発生したり、あまりに長時間発生して画面全体がブランクになったり、英語やベトナム後のエラーが表示され使用中のインターフェースとは異なるものが表示されたりする。
こうした場合には別のホスティング候補（あるいはVPS）を探した方が良いでしょう。
なお、当社ではLinode VPSを使用していますが、これは安定感もよく、必要なものを満たしてくれていると感じます。
+ SSDの使用
+ NGINXの使用
+ CentOSの実行
+ MariaDBの使用
ホスティングに関していえば、ベトナムのプロバイダーは残念ながら安心できないというのが実情です。VPSについては、Vultrが格段に速いのですが、体験版を使用した限りでは安定性に難があると感じました。低コストでVPSを使用したいという皆さんは、共同でお金を出し合う共有ホスティングを検討するのが良いかもしれません。
Comments are closed.
