ゾーニング分析のスクリーンショット

スクリーンショットは、特定の時点でのあなたのウェブサイトやアプリの静止画像です。Zoning Analysisでは、スクリーンショットがヒートマップの視覚的な基盤として機能します。ユーザーがページとどのようにインタラクトしたかを正確に確認でき、その上に行動データを重ねて表示します。

スクリーンショットライブラリには、サイトのためにキャプチャされたすべてのスクリーンショットが保存されており、異なるZoning間で再利用したり、時間をかけて異なるページバージョンを比較したりできます。

スクリーンショットとは？

スクリーンショットは、特定の瞬間のライブウェブサイトやアプリをキャプチャし、スクリーンショットライブラリに保存します。ContentsquareでZoningを開くと、その時点のページの見た目を再現し、コンテキスト内でユーザー行動を分析できます。

単一のZoning内で複数のスクリーンショットを扱うことも可能で、例えばページの異なるバージョンを比較したり、開いているメニューや展開された検索バーなどの動的要素を分析したりできます。

スクリーンショットのキャプチャ方法

Contentsquareでスクリーンショットをキャプチャする方法は3つあります。
 

ライブページから（ライブキャプチャ）

このオプションは、開いているメニューやアクティブな検索バーなどの動的要素を含む、現在のライブウェブサイトをキャプチャするために使用します。

既存のZoning内で：

1. Zoningの右上隅にあるスクリーンショットアイコンをクリックします。

2. 新しいスクリーンショットを追加をクリックします。

   
    

3. 新しいスクリーンショットを追加をクリックし、次に新しいスクリーンショットを撮るをクリックします。
    
4. ライブページが新しいウィンドウで開きます。
    
5. キャプチャボタンをクリック（またはキーボードショートカットを使用）してスクリーンショットを撮ります。
   
6. Contentsquareに保存をクリックします。

新しいスクリーンショットは自動的にZoningに適用されます。これでゾーンを作成し、その中のコンテンツを分析できます。

動的要素（例えば開いているドロップダウンメニュー）をキャプチャする場合は、キャプチャボタンをクリックする前にページ上でその要素をアクティベートしてください。

過去のページバージョンから（遡及スクリーンショット）

先月やそれ以前のページの見た目を分析したいですか？遡及スクリーンショットは、Session Replayのデータを使って過去のサイトのスナップショットを取得するため、その時点でスクリーンショットを撮っていなくても利用できます。

古いデザインと新しいデザインを比較したり、過去のデータでABテストを実施したりする際に特に役立ちます。遡及可能な期間はSession Replayのデータ保持期間によって異なります。

遡及スクリーンショットを使ってZoningを作成するには：

既存のゾーニングで：

1. ゾーニングの右上隅にあるスクリーンショットアイコンをクリックします。
    

2. 新しいスクリーンショットを追加を選択します。

   

3. さらにスクリーンショットを見るをクリックして、スクリーンショットライブラリを開きます。

   

新しいゾーニングで：

1. メインメニューから新しいゾーニングをクリックし、次にページまたはページグループを選択します。
    
2. 分析したいページを選択し、日付範囲を設定して、適用をクリックします。
    
3. 次の画面で、さらにスクリーンショットを見るをクリックしてスクリーンショットライブラリを開きます。

ライブラリに入ったら、どちらの場合も手順は同じです（以下の共通手順を継続してください）。

1. ライブラリを閲覧します。サムネイルにホバーして選択をクリックして選びます。

   

2. そのスクリーンショットを分析に使用するには、継続をクリックします。
    
3. 分析を保存をクリックします。

ライブラリ内のスクリーンショットのフィルタリング：検索を絞り込むには、以下を行います：

• 日付範囲、デバイス、またはセグメントの調整
• スクロールレベルの変更：ページがスクロールに応じてコンテンツを読み込む場合に便利です（例：到達したときにのみ表示される画像など）

• ページのURLで検索

  

過去のスクリーンショットが見つからない場合は、ページのスクロールレベルを全ページスクロールから任意のスクロールレベルに変更してみてください。これにより、より多くの結果が返されます。

セッションリプレイから

1. Session Replayで、作業したいリプレイを開きます。
    

2. リプレイのタイムラインにホバーし、カメラアイコン（新しいスクリーンショットを撮る）をクリックします。

   

3. 開いたサイドパネルで、スナップショットを保存をクリックします。
    
4. 保存先を選択します:
   • 新しいゾーニング: ゾーニングに名前を付けて、保存をクリックします。
   • 既存のゾーニング: ドロップダウンからゾーニングを選択し、保存をクリックします。
      
5. 新しいタブが開き、スクリーンショットが適用された状態で直接ゾーニングに移動します。

スクリーンショットライブラリの使い方

スクリーンショットライブラリは、ゾーニング全体でスクリーンショットを表示、管理、再利用するための中心的な場所です。

ゾーニング内から、スクリーンショットアイコンをクリックして以下の操作ができます:

• そのゾーニングで利用可能なすべてのスクリーンショットを閲覧する
• 現在分析中のスクリーンショットを切り替える
• 不要になったスクリーンショットの名前を変更または削除する

適切なスクリーンショットの選び方

正確なゾーニング結果を得るために、使用するスクリーンショットは分析している期間のページのバージョンと一致している必要があります。

なぜ重要か: ウェブサイトの変更は、訪問者に見えないものであっても、ゾーンのマッピングに影響を与え、誤解を招く結果につながることがあります。例えば:

• 目に見える変更: ページの上部に新しいバナーが追加される
• 目に見えない変更: ページコードの裏で要素の名前が更新される

Contentsquareは不一致を自動的に検出します。スクリーンショットが分析の日付範囲外で撮影された場合、スクリーンショットの日付の横に小さな色付きの点が表示されます。スクリーンショットをクリックすると不一致のメッセージが表示されます。

不一致が表示された場合、次のいずれかを行うことができます:

• 分析設定の日付範囲をスクリーンショットに合わせて変更する、または
• 分析したい日付範囲に合った別のスクリーンショットを選択します。

スクリーンショットのアセットの保存と表示方法

Contentsquareがページのスクリーンショットをキャプチャすると、そのページを構成する画像やスタイリングなどの視覚的要素も安全なキャッシュに保存します。これらの保存されたアセットが、Zoning Analysisでスクリーンショットを開いたときに表示されるものです。

スクリーンショットを開くときの動作は以下の通りです：

1. Contentsquareはキャッシュ内でページの視覚的アセットを探します。
2. アセットが見つかれば、すぐに読み込まれ、スクリーンショットは期待通りに表示されます。
3. アセットがキャッシュに存在しない場合（保存期間の390日が経過した場合）、Contentsquareはライブのウェブサイトから再読み込みを試みます。
4. その後、ライブのウェブサイトでアセットが削除または名前の変更されていると、取得できず、スクリーンショットは視覚的要素が欠けた状態で表示されます。

アセットはどのくらいの期間保存されますか？ Contentsquareはスクリーンショットがキャプチャされた日から390日間、視覚的アセットを保存します。

古いスクリーンショットで画像が欠けて見えますか？ スクリーンショットが390日以上前のものであれば、これが原因の可能性が高いです。390日経過後、Contentsquareはページの視覚的要素をライブのウェブサイトから再読み込みしようとします。もしそのファイルがサイト上で削除または名前の変更されていれば、スクリーンショットには表示されず、残念ながら復元もできません。分析に影響がある場合は、現在のページの新しいスクリーンショットをキャプチャするのが最善の対処法です。

重要なZoningsについては、390日が経過する前にスクリーンショットを更新して、正確な表示を保つことを検討してください。

次に読むべき内容

• Zoningの作成方法：Zoningを一から設定するための段階的ガイド
• Zoning Analysisのトラブルシューティング：よくある問題とその解決方法
• Session Replay：Session Replayが遡及的なスクリーンショットをどのように支えているかについて詳しく学ぶ