Tealium iQのベストプラクティス

組織化

「保存」対「上書き」

変更を保存する方法は2つあります：

• 保存 – 変更を新しいバージョンに保存し、前のバージョンを保持します。
• 上書き – 変更を現在のバージョンに保存し、それを上書きします。バージョンへの変更は元に戻すことができません。

保存を使用するシナリオ：

• 現在のバージョンが本番環境に公開されている場合、元に戻すオプションを保持するために保存を使用します。
• 新しいプロジェクトを開始するときは、保存を使用して新しいバージョンを作成し、それを前の作業から分離します。
• どちらのオプションを選ぶべきかわからないときは、保存方法が最も安全です。これにより、前のバージョンに戻すことができます。

詳細については、保存についてと公開についてを参照してください。

例：Prodバージョンを保持するための「保存」対「上書き」

この例では、バージョンがProdに公開されており、必要に応じてそれを元に戻すことができるようにそのバージョンを保持したいと考えています。

正しい方法

「バージョンA」はすべての環境（Dev、QA、Prod）に公開されています。変更を加えた後、新しいバージョン「バージョンB」を作成するために保存が行われます。それから再度すべての環境に公開されます。これにより、必要に応じて前のProdバージョン（バージョンA）にロールバックするオプションが提供されます。

間違った方法

「バージョンA」が上書きを使用して複数回Prodに公開されます。前のProdバージョンにロールバックする方法はありません。

ラベルとタイトル

関連するタグ、ロードルール、拡張機能をカテゴライズするためにラベルを使用します。特に、順序を必要とするものにはラベルを使用します。

説明的なタイトルを使用します。例えば、ステップ1/3など。

詳細については、ラベルについてを参照してください。

データレイヤーオブジェクト

データレイヤーのベストプラクティスを参照してください。

イベントトラッキング

イベント名

Tealiumは、サイトでトラッキングされる各イベントタイプを一意に識別するために変数tealium_eventを使用します。この変数を、トラッキングされるイベントを識別する値に構成します（Tealiumの命名規則が適用されます）。

提案される値には、以下のようなものがありますが、これに限定されるものではありません：

標準化されたイベント名には以下の利点があります：

• 実装が明確になるため、変数名と値が一貫しています。
• イベントタイプの単一の識別子があるため、データマッピングが容易になります。
• イベントは、名前のプレフィックス（product_、cart_、user_）によってカテゴリに分けられます。

サンプルイベントトラッキングスクリプト

utag.link({
    tealium_event    : "cart_add",
    product_id       : ["shrt123"],
    product_price    : ["12.50"],
    product_quantity : ["2"]
});

パフォーマンス

utag.jsの更新

最新バージョンのutag.jsを常に使用することをお勧めします。これにより、QA作業が減少し、プロファイルにテストの最適化と機能が含まれることを確認できます。

詳細については、テンプレートの管理を参照してください。

タグテンプレートを最新バージョンに更新

すべてのタグとタグテンプレートを最新バージョンに更新することをお勧めします。これにより、タグが正しく発火することが保証されます。テンプレートステータスチェッカーツールを実行して、更新が必要なタグを確認します。また、更新されたタグや非推奨のタグのニュースについては、リリースノートを確認してください。

詳細については、テンプレートの更新を参照してください。

複数のベンダータグを組み合わせる

1つのベンダーからの複数のタグを1つのタグインスタンスに組み合わせると、ページのパフォーマンスが向上します。これは、ページ上でロードされるutag.#.jsファイルの数が少なくなるためです。このアプローチにより、Tealium iQでベンダータグの構成を維持するのも容易になります。

詳細については、複数のFloodlightタグの構成を参照してください。

utag.jsを非同期でロード

すべてのタグとベンダーコードを非同期でロードするのがベストプラクティスです。この方法では、タグはページの残りのコンテンツと並行してロードされます。タグが応答するのが遅い場合やロードするのが遅い場合でも、サイトの他の部分を遅くすることはありません。

同期的なロードが必要なのは、タグやベンダーコードが互いに依存してロードする必要がある場合です。たとえば、ページコンテンツのパーソナライゼーションのためのデータを取得するコードが必要な場合などです。このオプションはサイトのロードを遅くしますが、ページの残りの部分が表示される前に正しいデータがロードされることを保証します（例えば、訪問の名前や配送地域など）。

詳細については、同期ロードを参照してください。

タグのバンドル

タグのバンドル機能は、プロファイルの公開構成内で構成されます。この機能を有効にすると、ベンダータグのコードがメインのutag.jsファイルに含まれるようになります。これにより、ページから送信されるHTTPリクエストの数が減少し、パフォーマンスが向上します。

詳細については、バンドルフラグを参照してください。

ページコードの配置

Universal Tag（utag.js）は、ヘッドやフッターではなく、ボディタグの上部に配置することをお勧めします。ただし、データレイヤーオブジェクトはこれより前に宣言され、入力されている必要があります。この配置は、最大数のベンダーとの互換性を提供します。

詳細については、コードセンターを参照してください。

タグのタイミング

タグのタイミング構成は、タグがすぐに発火するか、DOM Readyで発火するかを決定します。タグのタイミングが優先に構成されている場合、タグはページにロードされるとすぐに実行されます。タグのタイミングがDOM Readyに構成されている場合、タグはDOM Readyイベントまで待ってから実行されます。この構成は、各タグの詳細構成で見つけることができます。

重要なタグ（例：アナリティクス）の実行を優先するためには、待機フラグをオフに構成します。

詳細については、タグのタイミングを参照してください。

必要なときだけイベントリスナーをロードする

イベントリスナーに対してイベントルールを構成しない場合、それはすべてのページでロードされます。すべてのページでイベントリスナーをロードすると、サイト上のページの配信が遅くなり、不必要なデータが収集されます。トリガーのアクションが発生すると予想されるページや、訪問のアクションデータが必要なページだけにイベントリスナーをロードするためのルールを使用することをお勧めします。

詳細については、Event Rulesを参照してください。

拡張機能

組み込みの拡張機能を使用する

Tealiumは、コーディング経験が限られた非技術者と、自分でJavaScriptを書くことに慣れている開発者の両方を対象として設計されています。組み込みの拡張機能の多くは、カスタムJavaScriptコード拡張機能として簡単に書き直すことができますが、既存のオプションでは提供されていない追加の機能が必要な場合にのみ、カスタムJavaScriptを書くことをお勧めします。

組み込みの拡張機能は以下の利点を提供します：

• 依存関係の管理
  データレイヤー変数の名前が変更された場合、その変数を参照しているすべての組み込み拡張機能は、元の変数への参照を含んでいるため、自動的に更新されます。
  コードで参照されるデータレイヤー変数、例えばb['user_login_status']は、変数の名前が変更された場合、手動で更新する必要があります。
• フレンドリーな変数名
  組み込みの拡張機能は常に、存在する場合は変数のユーザーフレンドリーな名前（エイリアス）を表示します。これにより、構成の可読性が向上します。
  コードで参照される変数は、実際の名前を使用する必要があり、これは暗号化されているか不明確である可能性があり、コードが何を行っているのかを理解するのが難しくなるか、依存関係を特定するのが難しくなる可能性があります。
• 構文エラーなし
  組み込みの拡張機能は、公開するたびに同じ一貫したコードを生成することが保証されており、構文エラーのリスクがありません。
  カスタムJavaScriptコードは、予期しない構文エラー（通常は公開エンジンがこれらをキャッチします）やランタイムエラーを導入するリスクが常にあります。

詳細については、About Extensionsを参照してください。

拡張機能からタグコードを削除する

タグコードは、タグマーケットプレイスまたはカスタムコンテナから実行することをお勧めします。これにより、タグの維持が容易になります。

グローバルvsローカルJavaScript変数

JavaScriptコード拡張機能では、varとwindowを使用してグローバル変数とローカル変数を明示的に定義することを確認してください。これにより、utag.jsやページ全体で宣言された変数との名前の衝突を防ぎます。

不正：

variable_name = "some value";

正しい：

var variable_name = "local value";

window.variable_name = "global value";

ロードルール

変数が存在することを確認する

変数の値をチェックする前に、その変数が存在することを確認することをお勧めします。以下の例では、MyVariableが定義されているかどうかを確認し、その値が1000に等しいかどうかを確認します：

変数が存在することを確認せず、その値がnullである場合、コードはエラーをスローし、タグが発火しない可能性があります。

詳細については、About Load Rulesを参照してください。