# Allgemeine Richtlinien



# HTML5 (Standard + Richmedia)

#### Allgemeines

Werbemittel müssen als solche klar erkennbar sein. Weiterhin muss erkennbar sein, dass sie nicht zum Inhalt der Seite gehören. Alle Werbemittel müssen mit einem klar sichtbaren Rand versehen werden.

- - - - - -

#### Animationen und Sound

Die Animation darf nicht länger als 30 Sekunden dauern. Es darf **kein** Element mehr animieren.  
Animationen können als Schleifen erstellt werden, müssen jedoch nach 30 Sekunden stoppen.  
Bei Werbemitteln mit Ton muss ein Sound On/Off Button implementiert sein. Das Werbemittel hat hierbei mit dem Sound Off Zustand zu starten.

<p class="callout warning">Achtung: Bei Werbemittel für **Amazon** darf die Animation nicht länger als **15 Sekunden** dauern.</p>

- - - - - -

#### Abspielen von Videos

Werbemittel, die eine direkte Videoeinbindung enthalten müssen für unseren AdServer in Google Studio als RichMedia Werbemittel bereitgestellt werden.   
Bei Video Werbemitteln über unseren AdServer ist ein Nachladen von max. 2 MB möglich (Polite Load).  
Der Sound darf nur User-initiert abspielen. Der Sound muss weiterhin über ein gut sichtbares Symbol ein- und ausgeschaltet werden können.   
Max. Animation 30 Sekunden (auch bei Videos, User-initierte Fortsetzung möglich).

<p class="callout info">Weitere Hinweise zu Google Studio finden Sie unter [https://support.google.com/richmedia/answer/2389093?hl=de](https://support.google.com/richmedia/answer/2389093?hl=de)</p>

- - - - - -

#### Hintergrundfarbe

Es ist eine Hintergrundfarbe zu setzen.

- - - - - -

#### Anlieferung

Ein HTML5-Banner ist als .zip-Datei anzuliefern.   
Die .zip-Datei muss alle Ressourcen beinhalten und keine Unterordner verwenden.  
Für jedes HTML5-Banner muss ein gesondertes Fallback-Banner angeliefert werden. Das Fallback ist gesondert anzuliefern und nicht Bestandteil der .zip-Datei.

#### Anlieferung per Google Studio

Werbemittel die in Google Studio umgesetzt sind, sind direkt an unseren AdServer zu übermitteln.  
Hierzu müssen Sie ihr Studio-Konto mit unseren AdServer verbinden und anschließend die Werbemittel an das Trafficking senden.

<p class="callout info">Weitere Infos zur Zuordnung ihres Studio-Kontos zu unseren AdServer finden Sie unter [https://support.google.com/richmedia/answer/2453369?hl=de&amp;ref\_topic=2389089](https://support.google.com/richmedia/answer/2453369?hl=de&ref_topic=2389089)</p>

- - - - - -

#### Externe Scripte / Javascript Bibliotheken

Javascript-Ressourcen müssen in der .zip-Datei enthalten sein und dürfen nicht von externen Drittanbieter Servern geladen werden. Ausgenommen hiervon sind die von Google gehosteten Java Script Bibliotheken.

<p class="callout info">Die Google Java Script Bibiotheken finden Sie unter [https://support.google.com/richmedia/answer/6307288?hl=en](https://support.google.com/richmedia/answer/6307288?hl=en)</p>

- - - - - -

### Clicktag

#### IAB clicktag

Werbemittel sind mit IAB clicktag zu erstellen (weitere Infos dazu [hier](https://iabtechlab.com/wp-content/uploads/2016/04/HTML5forDigitalAdvertising2.0.pdf))

#### Klickfläche / clickTag Methode (nicht Google Web Designer)

HTML5-Banner, die im Google Campaign Manager eingesetzt werden, sind mit einer Klickfläche zu versehen. Diese muss das komplette Werbemittel abdecken.

##### Implementierung der Klickfläche (händisch programmierte Banner und Adobe Animate)

für das Werbemittel ist folgender Code zu verwenden:

```HTML

<html>
  <head>
    ……
    <script type="text/javascript">
      var clickTag = "LANDINGPAGE";
    </script>
  </head>
  <body>
    <a href="javascript:void(window.open(window.clickTag))">
      [your adcode here ]
    </a>
  </body>
</html>
```

#### Klickfläche / clickTag Methode in Google Webdesigner

##### Implementierung der Klickfläche in Google Webdesigner

Die Klickfläche wird in GWD mittels Interaktionsfläche und Google Anzeigen Ereignis implementiert.

[![image-1644247423059.png](https://wiki.jomserver.de/uploads/images/gallery/2022-02/scaled-1680-/image-1644247423059.png)](https://wiki.jomserver.de/uploads/images/gallery/2022-02/image-1644247423059.png)

<p class="callout info">Hinweise zur Implementierung unter **[https://support.google.com/dcm/answer/3145300?hl=de](https://support.google.com/dcm/answer/3145300?hl=de)**   
(Abschnitt: Klick-Tags -&gt;Google Web Designer für Exit-Ereignisse verwenden)</p>

#### Implementierung der Klickfläche in Google Studio

Die Klickfläche wird in Google Studio mittels Exit implementiert.

<p class="callout info">Hinweise zur Implementierung unter [https://support.google.com/richmedia/answer/2672517?hl=de](https://support.google.com/richmedia/answer/2672517?hl=de)</p>

- - - - - -

#### Wichtige Hinweise für Google Web Designer

Sofern der Google Webdesigner für die Erstellung der Ads verwendet wird, muss die richtige Umgebung gesetzt werden. Hier musst der Wert auf **Display &amp; Video360** gestellt werden.   
Bei Werbemittel für **Google Ads oder Google Display Netzwerk** ist die Umgebung auf **Google Ads** zu setzen.

[![image-1644247497296.png](https://wiki.jomserver.de/uploads/images/gallery/2022-02/scaled-1680-/image-1644247497296.png)](https://wiki.jomserver.de/uploads/images/gallery/2022-02/image-1644247497296.png)

</body></html>

# Image Ads und Fallbacks

#### Allgemeines

Werbemittel müssen als solche klar erkennbar sein. Weiterhin muss erkennbar sein, dass sie nicht zum Inhalt der Seite gehören. Alle Werbemittel müssen mit einem klar sichtbaren Rand versehen werden.

- - - - - -

#### Animationen

Die Animation darf nicht länger als 30 Sekunden dauern. Es darf **kein** Element mehr animieren.  
Animationen können als Schleifen erstellt werden, müssen jedoch nach 30 Sekunden stoppen.  
Die Frame-Rate animierter Image Ads (.gifs) darf höchstens 5 fps betragen.

<p class="callout warning">Achtung: Bei Werbemittel für **Amazon** darf die Animation nicht länger als **15 Sekunden** dauern.</p>

- - - - - -

#### Anlieferung

Die Anlieferung erfolgt als einzelne Datei. Erlaubte Dateitypen sind .jpg, .png, .gif

# Instream-Video (PreRoll, PostRoll, ... )

#### Allgemeines

Spots dürfen nicht mit einem schwarzen Frame enden oder starten.   
Die Spots müssen der Lautheitsnorm EBU R 128 entsprechen.

<p class="callout danger">**Die Lautheitsnorm EBU R 128 muss auch im digitalen Bereich zwingend eingehalten werden. Die Lautstärke muss insgesamt auf -23 ± 1LU normalisiert werden.**</p>

- - - - - -

#### Anlieferung

Anlieferung der Spots in folgenden Formaten für folgende Vermarkter:

##### Display &amp; Video 360 / Google Campaign Manager

<p class="callout info">Das Encoding erfolgt durch Google in verschiedene Formate, daher sollte ein Spot in  
möglichst guter Qualität und hoher Auflösung angeliefert werden.</p>

<p class="callout warning">Achtung: Bei Werbemitteln für **Amazon Prime** muss die Video Bitrate min. 15 Mbit/s betragen.</p>

**Container**: MOV, MP4  
**Dateigröße**: max. 1 GB  
**Verhältnis:** 16:9  
**Abmessung:** 1920x1080px  
**Codec:** Uncompressed, XDCAM HD 422, Apple ProRes 422, IMX30/50 oder H.264  
**Framerate:** 25 fps  
**Video Bitrate:** max. 50 <span class="ui-provider vw b c d e f g h i j k l m n o p q r s t u v w x y z ab ac ae af ag ah ai aj ak" dir="ltr">Mbit/s</span>  
**Audio:** 48 oder 44,1 kHz, 16- oder 24-Bit, Stereo

# HTML5 (TTD hosted)

#### Allgemeines

Werbemittel müssen als solche klar erkennbar sein. Weiterhin muss erkennbar sein, dass sie nicht zum Inhalt der Seite gehören. Alle Werbemittel müssen mit einem klar sichtbaren Rand versehen werden.

- - - - - -

#### Animationen und Sound

Die Animation darf nicht länger als 15 Sekunden dauern. Es darf **kein** Element mehr animieren.  
Animationen können als Schleifen erstellt werden, müssen jedoch nach 15 Sekunden stoppen.  
Bei Werbemitteln mit Ton muss ein Sound On/Off Button implementiert sein. Das Werbemittel hat hierbei mit dem Sound Off Zustand zu starten.

- - - - - -

#### Hintergrundfarbe

Es ist eine Hintergrundfarbe zu setzen.

- - - - - -

#### Anlieferung

Ein HTML5-Banner ist als .zip-Datei anzuliefern.   
Die .zip-Datei muss alle Ressourcen beinhalten und keine Unterordner verwenden.  
Für jedes HTML5-Banner muss ein gesondertes Fallback-Banner angeliefert werden. Das Fallback ist gesondert anzuliefern und nicht Bestandteil der .zip-Datei.

- - - - - -

#### Externe Scripte / Javascript Bibliotheken

Javascript-Ressourcen müssen in der .zip-Datei enthalten sein und dürfen nicht von externen Drittanbieter Servern geladen werden. Häufig verwendete JavaScript- und CSS-Bibliotheken (wie jQuery) müssen nicht mit dem Werbemittel eingebunden werden.

- - - - - -

### Clicktag

##### Implementierung der Klickfläche

Click-Tag-Namen sind case-sensitiv. Im gesamten Werbemittel und in allen Dateien ist eine einheitliche Schreibweise zu verwenden. Die Standardbezeichnung in The Trade Desk ist `clickTAG`.

<p class="callout warning">Wenn ein HTML5-Werbemittel eine fest codierte Klick-URL enthält, kann The Trade Desk diese nicht überschreiben. Das Werbemittel wird immer auf die hartcodierte URL verweisen und alle in der Plattform angegebenen Klick-URLs ignorieren.</p>

Dieses Beispiel zeigt, wie ein HTML5-Werbemittel mit einer Klick-URL umgesetzt werden kann:

```HTML

<html>  
  <head>    
    <script type="text/javascript" charset="utf-8">      
      function getParameterByName(name) {  
      name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");  
      var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),    
      results = regex.exec(location.search);  
      return results === null ? "" :    
      decodeURIComponent(results[1].replace(/\+/g, " "));
    }      
    var clickTAG = getParameterByName("clickTAG");                        
    </script>  
  </head>  
  
  <body>    
    <a href="javascript:window.open(window.clickTAG);void(0);">      
      <img src="clickme.jpg"/>    
    </a>  
  </body>
</html>
```

Wenn auf das Bild geklickt wird, öffnet sich ein neues Fenster mit der Adresse, die im `clickTAG`-URL-Parameter des Werbemittels gespeichert ist.

<p class="callout info">Weitere Infos: [TTD Creative Specifications](https://www.thetradedesk.com/assets/global/documents/Creative_Specifications-en.pdf)</p>

</body></html>

