HTML5 Spezifikationen Desktop

Bevorzugte Anlieferung als 3rd Party Tag.
Die Werbemittel müssen vorher getestet und in allen gängigen Browsern lauffähig sein.

Wir stellen folgende Anforderungen an HTML5 Werbemittel:

 

Technischer Aufbau:

  • Die Werbung muss eine Klick-URL haben (Sobald der Cursor das Werbemittel erreicht, muss eine Klick-Interaktion möglich sein.)
  • Die Klick-URL (Sprung zur Zielseite) muss leicht im Code zu finden sein. 1
  • Klick-URLs müssen sich immer in einem neuen Fenster öffnen (target=_blank)
  • Werbemittel-Tests müssen auch lokal im Browser möglich sein. Das Werbemittel darf nicht davon abhängig sein, ob es lokal auf einem Rechner aufgerufen wird oder aus einer Serverumgebung heraus.
  • Das Gewicht der Werbemittel darf maximal 150 KB für Desktop und maximal 100 KB für Mobile betragen
  • Das Werbemittel muss in latin-1 kodiert sein, nicht UTF8
    • ä anstelle von ä
  • Referenzen im Werbemittel auf externe Ressourcen (Zählpixel, JS-Libraries, Videos, Fonts) sollten alle via SSL (https://) ausgeliefert werden
  • Tracking muss im Werbemittel enthalten sein
  • Die Werbemittel müssen sich in ein Iframe rendern 1
  • Alle angelieferten Tags müssen SSL (Secure Sockets Layer) verwenden. Das beinhaltet sowohl Daten, die im HTML selbst nachgeliefert werden, wie iframes und Links.

 

Anlieferung:

  • Jedes Werbemittel muss in ein einzelnes Zip-File
    • “halfpage_de.zip” enthält nur den Code und die Dateien die das deutschsprachige HalfpageAd benötigt
    • “wideboard_fr.zip” enthält ausschließlich Code und Dateien des französischen Wideboardwerbemittels
    • etc

 

Best Practice Aufbau eines HTML5 Rectangle Ads

 

index.html: ruft das eigentliche Werbemittel (rectangle.html) in einem iFrame auf. Enthält optional Zählpixel und Trackingcodes

rectangle.html: beispielhaft ein Rectangle-Werbemittel mit den Maßen 300×250

rectangle.js: Animation des Werbemittels

rectangle1.jpg, rectangle2.jpg: Grafiken für das Werbemittel

 

index.html:

 

/* optional trackingcodes, zählpixel, moat, etc */

<iframe src=“rectangle.html“ width=“300″ height=“250″ scrolling=“no“ frameborder=“0″></iframe>

 

rectangle.html

 

// Um Klicks messen zu können, müssen wir der Zielurl unsere Klickmessung voranstellen.

// Am besten speichert man Anfangs die Zielurl in eine Javascript-Variable und benutzt im

// späteren Verlauf nur diese Variable.

 

<script>

var zielseite = „http://rivella.ch“;

</script>

 

/* später kann man dann die Zielseite aufrufen mit z.B.: */

window.open(zielseite);

/* oder */

document.write(„<a href='“ + zielseite + „‚>…</a>);