Google Web Designer でバナー クリエイティブを作成する

Google Web Designer でバナーを作成するには、最初から作成するか、時間の節約のために、あらかじめ作成されたテンプレートを使用できます。

最初から作成する

クリエイティブのデザインをすべてコントロールしたい場合は、Google Web Designer で空のバナー ファイルの作成から始めることができます。

手順 1: 新しいファイルを作成する

1. Google Web Designer を開きます（Google Web Designer をまだインストールしていない場合は、こちらからダウンロードします）。
2. 起動画面で [新しいファイルを作成] または [ファイル] > [新規作成] をクリックします。
3. [新しい空のファイルの作成] ダイアログで、広告タイプとして [バナー] を選択します。
   
4. 次のように選択します。
   • 名前
     広告の名前を指定します（必須）。ここで指定した名前が HTML ファイルの名前になります。
   • 場所
     ファイルの保存先を選択します。ご自身のパソコンに保存しても、Google ドライブに保存しても構いません。
   • 環境
     広告配信環境としてディスプレイ＆ビデオ 360 を選択します。
   • ディメンション
     [レスポンシブ レイアウト] チェックボックスをオンにして、表示先のビューポートや広告スロットに合わせて自動的にサイズが調整される広告を作成できます。または、広告のサイズを具体的に設定することもできます。プルダウン リストに一般的なバナーサイズが表示されます。リストにないサイズを使用する場合は、プルダウンから [カスタム] を選択して、幅と高さを手動で入力します。
   • アニメーション モード
     最初に使用するアニメーション モードを選択します（アニメーション モードはいつでも切り替えられます）。[クイック] モードでは、広告をシーン単位でアニメーション化できます。[詳細] モードでは、タイムライン上の要素を個別にアニメーション化できます。
5. [OK] をクリックします。

手順 2: クリエイティブをデザインする

新しいバナー広告を作成すると、指定したバナーサイズに合わせたバナーページ（page1）が Google Web Designer で作成されます。

メインのバナーページを設定するには:

1. 画像、動画などのアセットを追加します。追加するにはアセットを作業領域にドラッグするか、画像タグを使用します。
2. ステージ上に、使用する画像などの要素を配置します。
3. 必要に応じて、アニメーションを作成したり、ページにコンポーネントを追加したりします。
4. レスポンシブ広告を作成する場合は、ブレークポイントを追加し、新しいサイズ範囲を設定します。

手順 3: 行動を促すフレーズを追加する

効果的な広告にするための仕上げとして、行動を促すフレーズを追加します。行動を促すフレーズは通常、企業のウェブサイトにユーザーを誘導するクリック可能なボタンにします。

1. 広告に、行動を促すフレーズが含まれていることを確認します。行動を促すフレーズは、ユーザーがクリックまたはタップできるボタンや、はっきりとした視覚的な要素である必要があります。
2. [タップ領域] コンポーネントを、[コンポーネント] パネルの [操作] フォルダからステージにドラッグして行動を促すフレーズに重ねて配置します。
3. [イベント] パネルで。新しいイベントボタン をクリックします。
4. イベント ダイアログで、以下の設定を選択します。

   ターゲット	タップ領域コンポーネント（gwd-taparea_1）
   イベント	[タップ領域] > [タップ / クリック]
   操作	[Google 広告] > [広告を終了] 注: 同様の操作である [広告を終了（URL を上書き）] では、スタジオやキャンペーン マネージャー 360 内など、クリエイティブ外の URL は変更できません。ダイナミック広告でのみ使用します。
   レシーバー	gwd-ad
   設定	指標 ID - レポートをわかりやすくするためのラベル（「CTA」など）。 URL - exit URL。 終了時に元に戻す - エキスパンド広告の場合、この設定をオンにすると、ユーザーが広告を閉じたときに広告が折りたたまれます。 終了時にメディアを一時停止 - オンにすると、ユーザーが広告を閉じたときに動画や音声の再生が停止します。 終了時に折りたたまれたページ - エキスパンド広告の場合に、ユーザーが広告を閉じたときに表示するページ。

   

テンプレートから開始する

テンプレートとは、一般によく使用されるスタイルや機能を使って、一般的なサイズであらかじめ作成された広告のことです。画像などのアセットを置き換えることで、実際に機能する広告を簡単に作成できます。

手順 1: テンプレートから新しいファイルを作成する

テンプレートから広告を作成するには:

1. [ファイル] メニューで [テンプレートから新規作成] を選択します。テンプレート ギャラリーが開きます。
2. 以下の手順を実行して Google マーケティング プラットフォームのバナー テンプレートを見つけます。
   1. [検索] をクリックします。
   2. [広告タイプ] 欄を展開して [バナー] を選択します。 
   3. [プラットフォーム] 欄を展開して [ディスプレイ＆ビデオ 360] を選択します。
   4. フィルタパネルを閉じます。互換性のあるレイアウトのリストが表示されます。
3. クリエイティブ タイプをクリックして利用可能なレイアウトを表示し、希望するレイアウトの [レイアウトを使用] をクリックします。
4. 複数のサイズから選択できる場合は、必要なサイズを選択します。
5. 新しいファイルに名前を付けます（必須）。
6. 省略可: ファイルの保存場所を変更します。その場所までのパスを入力するか、フォルダ アイコン をクリックしてその場所まで移動します。
7. [作成] をクリックします。

手順 2: テンプレート内でアセットを追加または置き換える

広告テンプレートには、各要素についてプレースホルダのアセットと説明的な ID が含まれます。テンプレートから広告を作成するには、汎用のプレースホルダのアセットをそれぞれ、広告の該当するアセットに置き換えるだけです。テンプレートから作成する広告は自由に修正できます。必要に応じて、アセット、コンポーネント、イベントを追加または削除して、さらにカスタマイズした広告を作成できます。

「画像の入れ替え」機能を使用すると、ライブラリ内の画像またはアップロードした画像に置き換えることができます。この機能は、テンプレートのストック画像を置き換える場合に特に便利です。

テンプレートから作成する広告の画像を置き換えるには:

1. 置き換える画像を右クリックします。
2. ポップアップ メニューから [画像を入れ替え] を選択します。
3. ダイアログで、ライブラリから画像を選択するか、追加アイコン をクリックしてパソコン内の画像を選択します。
4. [OK] をクリックします。

プレビュー

ブラウザで広告をプレビューして、見た目や動作が想定どおりかを確認します。ブラウザ内にソースの .html ファイルを直接開くのではなく、[プレビュー] ボタンを使用します。

広告をパブリッシュする前に、パブリッシュ ダイアログの [概要] 欄で、広告がすべての検証に合格しているかどうかを確認できます。

クリエイティブが完成すると、スタジオにパブリッシュする準備が整います。