ページについて

Google Web Designer では、1 つの HTML ドキュメント内に複数のシーンを表示する際に「ページ」を使用します。1 つのページには 1 つのシーンが含まれます。ページは広告で広く利用されており、広告の画面ビューごとに 1 つのページを使用します。下記はその一例です。

• シンプルなバナー広告では、1 つのページだけを使用します。
• シンプルなエキスパンド広告では、バナー用に 1 つのページを使用し、エキスパンド ビュー用にもう 1 つのページを使用します。
• 複雑な広告では、メインページに複数のボタンを設置して、動画ページやクーポンページなど、さまざまなページのコンテンツに移動できるようにします。

ページは、広告以外でも利用できます。新しいファイルを作成する際に [HTML（ページ）] を選択すると、HTML ウェブページでページを利用できます。

ドキュメント用のページセットは、「ページデッキ」と呼ばれます。

ページメニュー

ドキュメント ワークスペースの左下にあるページ インジケーターをクリックすると、ページデッキ内のすべてのページを表示できます。このポップアップ メニューから、ページの追加、複製、削除を行うことができます。また、メインページ（閲覧者に最初に表示されるページ）にするページを指定することもできます。

新しいページを追加する

1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
2. 広告内に複数のページサイズが含まれている場合は、作成するページと同じサイズのページを選択します。
3. ポップアップ メニューで「ページを追加」アイコン をクリックします。

ページの名前を変更する

ページの名前を変更するには、複数の方法があります。

• ページメニューで、直接ページの名前を変更する
  1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
  2. 名前を変更するページをダブルクリックします。
  3. 新しい名前を入力します。
  4. Enter キーを押します。
• ページのプロパティで、ページの名前を変更する
  1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
  2. 名前を変更するページを選択します。
  3. [プロパティ] パネルの [名前] に新しい名前を入力します。

ページを複製する

1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
2. 複製するページを選択します。
3. ページ ポップアップ メニューで、「ページを複製」アイコン をクリックします。これで、要素、コンポーネント、アニメーションを含め、現在のページのコピーが作成されます。
4. [プロパティ] パネルの [名前] に、新しいページに付ける名前を入力します。

ページを削除する

1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
2. 削除するページを選択します。
3. ページ ポップアップ メニューで、「ページを削除」アイコン をクリックします。

ページをメインページとして設定する

1. ドキュメント ワークスペースの下部にあるページ インジケーターをクリックします。
2. ページ ポップアップ メニューで、メインページに設定するページを右クリックします。
3. ポップアップ メニューから [メインにする] を選択します。メインページにはスターマークが付きます。

ページ プロパティ

現在のページのプロパティを表示する際には、[プロパティ] パネルを開いて、どの要素も選択されていないことを確認してください。ステージ外側のグレーの領域をクリックすると、簡単にすべての要素を選択解除できます。

ページとエキスパンド広告

エキスパンド広告のエキスパンド ビュー用のページを作成する場合は、ページの [プロパティ] パネルで、[展開済み] チェックボックスをオンにする必要があります。新しいファイルの広告タイプとして [エキスパンド] を選択した場合、作成されるエキスパンド ページでは、この設定が自動的に選択されています。

エキスパンド広告は、デフォルトでは右下方向にエキスパンドします。広告を別の方向にエキスパンドする場合は、メインページを基準とするエキスパンド ページの相対位置を変更できます。

広告を中央に配置する

広告が配信されるデバイスやブラウザサイズは異なる可能性があるため、Google Web Designer では、広告が表示されるビューポートに関係なく広告コンテンツを中央に配置できます。これにより、異なるサイズのビューポートにも対応した背景画像を使い、カスタム外部リンクなどのコンテンツを広告の中央に配置するといった、さまざまなサイズに対応するデザインが可能となります。広告を中央に配置する場合は、ページの [プロパティ] パネルで、[中央揃え] チェックボックスをオンにします。

画面の向きごとに別のページを使用する

画面の向きごとに別々のページを使用して、縦向き用と横向き用の広告をデザインできます。その際は、各ページの [別のページ] プロパティで、別方向用のページの ID（名前ではありません）を指定します。広告はビューポートの向きを検出し、一致する向きのページを表示します。

複数の画面サイズに合わせてデザインする方法についてご確認ください。

ページとイベント

イベントを使用すると、ユーザーがページ間をどのように移動するのかを制御できます。たとえば、タップ領域コンポーネントを使用して、ターゲット ページへの「ページに移動」アクションを送信したり、横向きモードと縦向きモードの方向変更を使用して、適切にフォーマットされたページに切り替えたりすることができます。

ページデッキ アクション

ページデッキが実行できるアクションとその設定項目を下表に示します。

アクション	設定項目
ページに移動	ページ ID - 移動先のターゲット ページ。AMPHTML 広告の場合、設定項目はこれのみです。 遷移効果 - ターゲット ページを表示する際のアニメーション効果。 長さ - 遷移効果の長さ（ミリ秒単位）。遷移効果を「なし」に設定している場合は適用されません。 イージング - 遷移効果のイージング タイプ。 方向 - ターゲット ページの表示方向。適用されるのは、一部の遷移効果タイプに限られます。

ページイベント

他のアクションを設定して、ページが送信したイベントでトリガーすることもできます。ページは次のイベントを送信します。

イベント	説明
ページの有効化	ページが表示されたときに送信されます。
ページの無効化	ページが非表示になると送信されます。
ページの読み込み	ページのコンポーネントがすべて読み込まれたときに送信されます。
ページの表示の準備完了	ページがコンテンツのキャッシュを完了して、表示する準備が整った後、アニメーションが開始する前に送信されます。
シェイク	モバイル デバイスがシェイク（振動）を検出したときに送信されます。
チルト	モバイル デバイスがチルト（傾き）を検出したときに送信されます。
縦向きに回転	モバイル デバイスが横向きから縦向きに回転したときに送信されます。
横向きに回転	モバイル デバイスが縦向きから横向きに回転したときに送信されます。
接続 （サポート終了）	代わりに有効化されたページを使用してください。
接続解除 （サポート終了）	代わりに無効化されたページを使用してください。

AMP HTML 広告のページデッキ イベント

AMP HTML 広告の場合、ページデッキは次のイベントを送信します。

イベント	説明
ページの変更	ページが変更されたときに送信されます。