This is the specifications for both the HTML banners and image banners. Inline is an advertising format used across all devices (mobile, tablet and desktop). As for now, HTML is recommended as it will be fully responsive across all screens.
For advertisers and agencies using AdForm, use AdForms specifications under the headline Responsive HTML5.
- Banner: always 100% width of is content container, but has fixed height.
- Currently available formats:
- Height: 225px, Width: 100%
- Currently available formats:
- Max 100 kb in compressed state (all files compressed/zipped together).
- You can use JavaScript libraries like jQuery from Googles CDN service without its size counting against the total size of the ad.
- Resources loaded after a user interaction does not count against the total size of the ad.
- Viewport can not be set to device width within the ad
<meta name="viewport" content="width=devicewidth"> - You can not use the Geo Location APIs
- The HTML-file should just be one file with all CSS required for the ad inline in the HTML.
- Maximum of two HTTP requests to JavaScript libraries (one local and on external).
- Animation prior to a user interaction must be written using CSS3 Transitions, Transforms and/or Animation
- JavaScript animations are forbidden before an user interaction.
- You can not use of requestAnimationFrame as it break features in the host document.
- References to resources must start with http:// or https:// , not only //. Because of limitations in our delivery system.
- You can not override default touch events.
- You can not use
touchstartas an alias forclick. - You can not trigger audio or video resources using
touchormouseevents.
You must use the following method when adding clicks to the ad:
<div id="Banner" data-responsive="225h" onclick="window.open('http://www.url.no','new_window');">
CSS rules can only be set to classes or IDs. You can not set rules directly to elements like span or div.
The div element should only have the following styling:
display: block; /* browser default */
position: static; /* browser default */
width: 100%;
height: 225px;
cursor: pointer;
Additional styling must be done on a new div/element within that container (ex Banner in the sample below).
<div id="Banner" data-responsive="225h"
onclick="window.open('http://www.url.no','new_window');"
style="display:block;width:100%;height: 225px;">
<div style="position:relative;"></div>
</div>
Read additional styling tips.
- Must be sent as JavaScript code
Many ads today is only a single image adapted i height/width to different formats (mobile and tablet).
As of 26th of August the image banners(PNG/JPEG/GIF) will be produced to fill the whole width and height in portrait, while they will be centered in landscape without scaling. The format size is based on iPhone and iPad.
- Mobile: 310*225 maks 50 kb
- Tablet + Desktop: 758*225 maks 100 kb