ウェブサイトのパフォーマンスを向上させるために取るべきいくつかの対策があります。これらの手順には、画像サイズの最適化、コードのフォーマット、外部スクリプトの使用、ストアの機能やアプリケーションの適切な使用など、ウェブページのデザイン要素を最適化することが含まれます。
ウェブページがより速く、信頼性が高く読み込まれると、優れたユーザーエクスペリエンスを提供するだけでなく、自然な検索結果でより高い順位を獲得し、潜在的な訪問者により目立つようになり、しばしば高い転換率をもたらします。
目次
ストアの機能とページのパフォーマンス
ストアページには、テンプレートコード、アプリケーション、画像、動画、決済オプション、共有ツール、データ分析トラッカーなど、さまざまな機能モジュールが含まれています。これらの機能は、全体的な訪問者エクスペリエンスを向上させ、ストアページの機能を拡張します。
ストアページに追加された各機能は、適切に機能するためにネットワークやハードウェアリソースが必要です。一部の機能は他のものよりも多くのリソースを必要とし、新しい機能を追加することでストアのパフォーマンスに大きな影響を与える可能性があります。
ストアページに新しい機能を追加する際には、その価値とページのパフォーマンスへの影響をバランスよく考慮することが重要です。場合によっては、パフォーマンスを犠牲にして訪問者エクスペリエンスを向上させ、転換率を高める必要があるかもしれません。
| 注意: ストア管理者専用のアプリケーションは、ストアの速度に影響しません。 |
ページのパフォーマンストラブルシューティングツール
オンラインストアのウェブページ速度を評価するために以下のツールを利用できます:
詳細なストアページメトリクスを生成するために Google PageSpeed Insights を使用できます。これらのメトリクスの意味を理解するには、Google Lighthouse Performance Scoring documentation を参照してください。
Lighthouseレポートの理解
Google PageSpeed Insightsから取得したLighthouseレポートを例にすると、最も重要なのはLargest Contentful PaintとTotal Blocking Timeの2つの主要なメトリクスに注意を払うことです。これらのメトリクスが赤色で表示される場合、以下の提案された最適化を行うことができます：
異常なTotal Blocking Timeの場合：
- インストールされているアプリケーションが多すぎないかを確認してください。
- 分析ライブラリの使用状況を確認してください。
異常なLargest Contentful Paintの場合：
- 画像や動画の仕様が適切かどうかを確認してください。
- インストールされているアプリケーションが多すぎないかを確認してください。
- 分析ライブラリの使用状況を確認してください。
| 注意： 上記の情報は公式SHOPLINEテーマにのみ適用されます。非公式またはプライベートテーマの場合は、該当する開発者にお問い合わせください。 |
ページパフォーマンスに影響を与える要因
ストアのページの速度は、さまざまな要因に影響を受ける可能性があり、それらはコントロール可能な要因とコントロール不可能な要因に分けることができます。
ストアページのパフォーマンスに関連する要因を説明するだけでなく、コントロール可能な要因のセクションでこれらの要因を処理する方法も提供されます。
コントロール可能な要因
-
アプリケーション:
ストアの機能や外観を拡張するためにアプリを追加すると、これらのアプリは実行するためにテンプレートにコードを追加します。アプリによって挿入されるコードは、テーマテンプレートと同じ環境で実行されるため、ページのパフォーマンスに影響を与える可能性があります。複雑な機能を持つアプリほどパフォーマンスへの影響が顕著になります。そのため、以下をお勧めします:- インストールされているアプリの数を減らし、使用されていないか不要なものを削除し、ストアの機能とパフォーマンスのバランスを見つける。
- 大量のカスタムコードを挿入しないでください。カスタムコードは、挿入されたカスタムコードがページに大きな影響を与えないことを確認できない限り、テーマテンプレートの元の構造を簡単に乱す可能性があります。
-
可能な限り、同様の機能を持つアプリの高性能なインストールを選択してください。
注意: ストア管理者専用のアプリはストアの速度に影響しません。
-
画像と動画:
ページ上の大きな画像や非表示の画像は、他の重要な部分の読み込みに干渉する可能性があります。ユーザーが画像の読み込みを待たなければならない時間が長すぎると、ストアが遅いと感じるかもしれません。SHOPLINEが提供するテーマは、画像と動画に対する一連の最適化を経ています。例えば:
(-) 現在画面に表示されていない画像や動画の遅延読み込み。
(-) 画面サイズに基づいて特定のサイズで画像を読み込む。
(-) 大きなGIF画像の逐次読み込み注意: 上記の情報は公式SHOPLINEテーマにのみ適用されます。非公式またはプライベートテーマの場合は、関連する開発者に連絡してサポートを受けてください。
ただし、これらの最適化措置でも画像や動画がストアのパフォーマンスに与える影響を完全に排除することはできません。ストアの構成もパフォーマンスに影響する可能性があります。そのため、以下をお勧めします:- 画像を設定する際には、推奨される画像サイズを参照してください。
- 大きなサイズのGIF画像を使用せず、代わりにPNG/JPG形式の画像を使用してください（GIF形式の画像は同じサイズの他の形式と比較して大きくなりがちです）。
- 1つの商品カテゴリに関連付けられる商品が50個を超えないようにし、1つの商品に関連付けられるSKU画像も50個を超えないようにしてください。
-
分析ライブラリ:
SHOPLINEは、Facebook Pixel、Google 広告、Google Analytics、Google Tag Manager、Google Remarketing Tools、およびBingキーワード広告など、さまざまなプラットフォームでのイベントトラッキングと分析をサポートしています。これらの分析機能を有効にすると、一定量のページリソースを消費し、過剰にアクティブ化されるとストアのページのパフォーマンスに影響を与える可能性があります。そのため、特定のニーズに基づいて適切なイベントトラッキングと分析を選択することで、ストアの機能とパフォーマンスを注意深くバランスさせることをお勧めします。 -
テーマテンプレート:
テーマテンプレートには、Handlebar、HTML、CSS、およびJavascriptコードが含まれています。テンプレートの編集やカスタマイズはファイルサイズを増やし、ストアの速度に影響を与える可能性があります。
SHOPLINEは、定期的に最適化および更新される複数の無料のテーマテンプレートを提供しています。ただし、公式テンプレートのコードを変更すると、それらはプライベートテンプレートに変わり、公式テーマの最新の最適化と即座の同期が妨げられます。
テンプレートにパフォーマンスの問題があると考える場合は、次の手順を試してみてください:- 公式のSHOPLINEテーマテンプレートを使用している場合は、SHOPLINEサポートチームにご相談ください。サードパーティまたはプライベートテンプレートを使用している場合は、テンプレート開発者に相談してください。
- Ariseテーマなどの公式OS 2.0最適化されたテーマをインストールすることを検討してください。
制御できない要因
-
ユーザーのデバイス、ネットワーク、および場所:
ストアにアクセスするユーザーは世界中におり、デバイスやネットワーク接続もさまざまです。これにより、ストアの読み込み速度はこれらの要因に応じて速くなったり遅くなったりします。
たとえば、米国にストアがある場合、SHOPLINEは米国のユーザー向けにリソースアクセスを最適化します。ただし、中国からストアにアクセスするユーザーの場合、米国からアクセスするよりもページの読み込み速度が遅くなる可能性があります。 -
ローカルブラウザキャッシュ:
ストアの静的リソースは一時的にユーザーのローカルストレージにキャッシュされるか保存されます。ユーザーが再度ストアを訪れると、ブラウザはサーバーに追加のリクエストを送信せずにキャッシュからリソースを読み込むことができます。
SHOPLINEは、ストア内のキャッシュ可能なリソースのブラウザキャッシュ時間を1年に設定しています。キャッシュ可能なファイルには、画像ファイル、PDF、JSファイル、およびCSSファイルが含まれます。 -
サーバーサイドページキャッシュ:
ローカルブラウザキャッシュに加えて、SHOPLINEはサーバーサイドでページをキャッシュします。初回のページ読み込みは遅いかもしれませんが、その後のページ読み込みは、ユーザーがキャッシュされたコピーを受け取るため速くなります。
コメント