Knowledgebase
English (471) Español (850) Português (117)
SEARCH
Knowledgebase: HTML5
Banner / Layer HTML5 - Estándar
on 01 December 2015 06:16 PM

Los formatos detallados a continuación solo funcionan con códigos Ajax V4 (de Sección o de Espacio).

HTML5 establece una serie de nuevos elementos y atributos que reflejan el uso típico de los sitios web modernos. Por tanto ofrecemos en e-planning formatos Layer y Banner HTML5.

Diferencia de Banner y Layer

Se ofrecen ambas alternativas en HTML5 para dar mayores posibilidades creativas. Si se tratase de una pieza “fija” se deberá optar por usar Banner, en cambio si la pieza es de tipo “flotante” se deberá seleccionar Layer.

Es importante señalar que desde la carga de estos formatos en e-planning, no van a existir configuraciones de efectos (tales como coordenadas, tipos de desplazamiento, efecto de expansión, entre otros) ya que los mismos deberán ser programados directamente en el código HTML5 de la pieza. Todas estas opciones deberán estar programadas previamente. El archivo que se suba al sistema podrá ser .html/.zip y el ad server lo reproducirá al momento de ejecutar las piezas incluyendo las animaciones y efectos provistos en el código.  

Ver más detalles sobre cómo agregar "efectos" en las piezas: Efectos en Banners tradicionales en HTML5 (eplExtras).

 

 

 

Agregar anuncio:

Luego de crear una pauta, para agregar un anuncio asociado a esa pauta ingresar a “Agregar Anuncio” donde se abrirá el siguiente formulario:

 

Seleccione el tipo de formato según se requiera:

      Ó     

 

Tipo de archivo a cargar:

En el formulario se dejan algunos ejemplos de tipos de archivo que se pueden subir:

Adobe Edge - .zip

Google Web Designer - .zip.

Las opciones provienen de herramientas de alto uso en el mercado para el armado de piezas en HTML5. Esto no implica que sean las únicas. Es viable la carga de cualquier .html o .zip mientras haya estado programado correctamente.

 

 

¡IMPORTANTE!


 -  CLICKTAG  

El Click Tag debe estár programado de esta forma:  

<a onclick="window.open(window.clickTag); return false" href="#!"></a>

Si se requiere que una área específica por ejemplo un div realice el clicktag realizamos lo siguiente:

<a onclick="window.open(window.clickTag); return false" href="#!">
             <div id="clickTag" style="width:400px;height:400px"></div>
</a>

 

Se realizará una validación al subir el archivo y en caso de que no esté el clicktag o se haya programado de manera diferente a la indicada se mostrará un warning:

Esto es clave porque en caso de subir el archivo sin la correcta implementación la pieza no será clickeable por lo tanto tampoco contabilizará los clicks.


 -  .ZIP

Tener en cuenta que en caso de que se suba un .zip el mismo debe contener un index.html dentro, de lo contrario se considerará inválido:

Todas las rutas de imágenes, css, javascript, etc deben ser relativas, por ejemplo:
imagen1.jpg // OK
http://www.dominio.com/carpeta/imagen1.jpg // MAL

El .zip además no debe contener carpetas dentro, debe contener los archivos que lo componen directamente.

En la siguiente imagen, se describe como sería el armado del zip:

- EXPANDIBLES

En el caso de que se haya programado una pieza que expande, es decir que contenga 2 medidas distintas, se deberá indicar bajo el campo "Tamaño (en pixels)" el que corresponda a la instancia inicial de la pieza (esta puede ser la expandida o la replegada):

 

 

   
 

Configuraciones opcionales:

Se mostrarán las mismas configuraciones opcionales que se observan en otro tipo de formatos.

 

Banner HTML5