---
title: Tealium iQのベストプラクティス
description: Tealium iQの実装におけるベストプラクティスガイド。
url: https://docs.tealium.com/ja/iq-tag-management/getting-started/best-practices/
---
## 組織

### 「保存」対「上書き」

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

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

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

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

詳細については、[保存について](https://docs.tealium.com/about-saving/)と[公開について](https://docs.tealium.com/about-publishing/)を参照してください。

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

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

##### 正しい方法

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

##### 間違った方法

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

|長所| 短所|
|---| ---|
| 以前のバージョンに戻る能力。 | なし |
| バージョン画面の整理が良くなります。 | |

### ラベルとタイトル

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

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

|長所| 短所|
|---| ---|
| 拡張機能の操作順序を維持するのに役立ちます。 | ラベルを割り当てるための労力が最小限です。 |
| ラベルでフィルタリングしてタグや拡張機能を簡単に見つけることができます。 | |

詳細については、[ラベルについて](https://docs.tealium.com/about-labels/)を参照してください。

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

[データレイヤーのベストプラクティス](https://docs.tealium.com/data-layer-best-practices/)を参照してください。

## イベントトラッキング

### イベント名

Tealiumでは、`tealium_event`変数を使用してサイト上で追跡される各イベントタイプを一意に識別します。この変数には、追跡されるイベントを識別する値を構成します（Tealiumの命名規則が適用されます）。

提案される値には、以下が含まれますが、これに限定されません：

| イベントタイプ |  tealium_event |
|------------|----------------|
| カート/バスケット追加 |  `cart_add` |
| カート/バスケット削除 | `cart_remove`|
| カート/バスケット空 | `cart_empty`|
| カート/バスケット表示 | `cart_view`|
| 登録イベント |  `user_register` |
| ログインイベント |  `user_login` |
| ログアウトイベント |  `user_logout` |
| リンククリック |  `link_click` |

標準化されたイベント名は次のような利点を提供します：

* 実装が明確になります。変数名と値が一貫しているためです。
* データマッピングが容易になります。イベントタイプごとに単一の識別子があるためです。
* イベントが名前の接頭辞（`product_`, `cart_`, `user_`）によってカテゴリーに分類されます。

#### イベントトラッキングスクリプトの例

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

## パフォーマンス

### utag.jsの更新

最新バージョンの[`utag.js`](https://docs.tealium.com/ja/release-notes/?filter=tealium-universal-tag)に常に最新の状態を保つことをお勧めします。これにより、QA作業が減少し、プロファイルにテストの最適化と機能が含まれることが保証されます。

詳細については、[テンプレートの管理](https://docs.tealium.com/manage-templates/)を参照してください。

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

すべてのタグとタグテンプレートを最新バージョンに更新することをお勧めします。これにより、タグが正しく発火することが保証されます。[テンプレートステータスチェッカー](https://docs.tealium.com/template-status-checker/)ツールを実行して、更新が必要なタグを確認してください。また、更新または非推奨のタグに関するニュースは[リリースノート](https://docs.tealium.com/release-notes/)をチェックしてください。

詳細については、[テンプレートの更新](https://docs.tealium.com/manage-templates/#update-a-template)を参照してください。

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

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

詳細については、[複数のフラッドライトタグの構成](https://docs.tealium.com/configuring-multiple-floodlight-tags/)を参照してください。

### utag.jsを非同期でロード

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

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

詳細については、[同期ロード](https://docs.tealium.com/tag-advanced-settings/#synchronous-load)を参照してください。

|長所| 短所|
|---| ---|
| 非同期でロードされたファイルはページのロード速度に影響しません。 | ロードファイルのタイミングを制御するのが難しいです。主にA/Bテストのベンダーに影響します。|
| 応答が遅い外部ファイルがページのロードを停止または破壊することはありません。 |細かい制御が必要な場合は、`utag.sync`を使用し、そこにパーソナライゼーションやA/Bテストの機能を含めてください。 |
| | 応答が遅い外部ベンダースクリプトやファイルがトラッキングコールを逃す可能性があります。 |

### タグをバンドルする

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

詳細については、[バンドルフラグ](https://docs.tealium.com/tag-advanced-settings/#bundle-flag)を参照してください。

|長所| 短所|
|---| ---|
| Tealiumファイルの全体的なサイズが縮小され、gzip圧縮がより効率的になるため、サイトのロードにかかる負荷が軽減されます。 | なし |
| 重要なタグ（アナリティクス）が早期に実行されるため、ランディングページのトラッキングが向上します。 |
|  |

### ページコードの配置

ユニバーサルタグ（`utag.js`）は、ヘッダーやフッターではなく、ボディタグの先頭に配置することをお勧めします。ただし、この配置を行う際には、データレイヤーオブジェクトが宣言され、これに先立って構成されている必要があります。この配置は、最も多くのベンダーとの互換性を提供します。

詳細については、[manage-environments](https://docs.tealium.com/manage-environments/)を参照してください。

|長所| 短所|
|---| ---|
| タグが発火するタイミングをより制御できます（ページの早い段階または遅い段階）。 | `utag.js`がロードされる前にデータレイヤーオブジェクトが利用可能であることを確認するために、追加の開発が必要になる場合があります。|
| 多変量テストタグとの互換性が向上します。 | |

### タグのタイミング

**タグのタイミング**構成は、タグが即座に発火するかDOM Readyで発火するかを決定します。**タグのタイミング**が`優先`に構成されている場合、タグはページにロードされるとすぐに実行されます。`DOM Ready`に構成されている場合、タグはDOM Readyイベントが発生するまで実行を待ちます。この構成は、[各タグの詳細構成](https://docs.tealium.com/tag-advanced-settings/#tag-timing)で見つけることができます。


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


詳細については、[タグのタイミング](https://docs.tealium.com/tag-advanced-settings/#tag-timing)を参照してください。

|長所| 短所|
|---| ---|---
title: "イベントリスナーと拡張機能の最適な使用方法"
linktitle: "イベントリスナーと拡張機能の使用"
description: "イベントリスナーと拡張機能を効果的に使用して、サイトのパフォーマンスを向上させ、不要なデータ収集を避ける方法について説明します。"
---

| 重要なタグは、データ収集を最大化するためにできるだけ早く実行されるべきです。 | ブラウザは、画像の表示よりもタグのロードを優先することができ、これがユーザー体験にわずかな影響を与える可能性があります。|
| ランディングページでは、タグファイルがまだキャッシュされていない可能性が高いため、タグはより早く実行されます。 | | 

### 必要な時にのみイベントリスナーをロードする

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

詳細については、[イベントルール](https://docs.tealium.com/event-rules/)を参照してください。

## 拡張機能

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

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

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

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

詳細については、[拡張機能について](https://docs.tealium.com/about-extensions/)を参照してください。

|長所| 短所|
|---| ---|
| ほとんどのユーザーにとって理解しやすく、維持が容易です。 | なし |
| 問題が発生した場合、デバッグが容易です。 | |
| 組み込み拡張機能は安全であり、JavaScriptエラーを導入することはありません。 | |

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

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

### グローバルとローカルのJavaScript変数

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

誤り：

```js
variable_name = "some value";
```

正しい：

```js
var variable_name = "local value";
```

```js
window.variable_name = "global value";
```

|長所| 短所|
|---| ---|
| サイトの他の場所にある変数との衝突を避けます。 |なし |

## ロードルール

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

変数の値をチェックする前に、変数が存在するかどうかを確認することをお勧めします。次の例は、`MyVariable`が定義されているかどうかを確認し、その値が1000に等しいかどうかをチェックします：![](https://docs.tealium.com/images/iq-tag-management/load-rules/variable-is-defined.png)

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

詳細については、[ロードルールについて](https://docs.tealium.com/about-load-rules/)を参照してください。

|長所| 短所|
|---| ---|
| 変数が定義されていない場合のエラー状態を避けます。 |なし |

