html5 advertisement creative specifications · 2014-08-06 · navigation bar navigation bar <...
TRANSCRIPT
Last
up
dat
ed: 1
2:47
- 17
/06
/20
14
HTML5 Advertisement Creative Specifications
For more information please email: [email protected]
Assets BreAkdownrich Media HtML5 ads only run on iPad versions 2 onwards currently.
Android and iPad 1 make up a small percentageof the audience the vast majority
on iPad 2 and above – the latter will see HTML5 ads with iPad1/Android users
getting a non-clickable static format.
Clients therefore need to provide all the following assets:
1) HtML5 Zip Bundle – consisting of the index.html file (main advert page markup), images, CSS & JavaScript and
any other assets (fonts or videos you may need to package). Full HTML5 spec is on the next page.
2) Landscape and Portrait static Assets. Spec below.
stAtic Assets sPecs2 static assets should be provided for the HTML5 ad
for fallback/offline experiences. These should not
contain a call to action as they are non-clickable in
the app and a call to action may be misleading to
our users.
One image will be used for Landscape – the other
for Portrait.
Each image should be produced to the following spec:
• Dimensions: 2048px(w) x 1382px(h) (Landscape)
1536px(w) x 1890px(h) (Portrait) /
• File size: 700KB per image
• Image formats: JPEG
Portrait
Landscape
Navigation bar
1536px
Navigation bar
+ iPad 1
1382px
2048px
1890px
Portrait
Landscape
Navigation bar
Navigation bar
< << <
HTML5 Advertisement Creative Specifications
ricH MediA/HtML5 sPec• Maximum file size: 2.2MB
• The file size should be the total weight of your HTML5 ad – HTML, JavaScript, CSS, images and any other assets compressed (i.e when made into a .zip file). We recommend hosting video on a CDN or external URL that your ad references to ensure that it doesn’t contribute towards your overall ad-weight.
• Dimensions – ads should be designed to take up a full screen. Landscape: 1024px(w) x 768px(h), Portrait: 768px(h) x 1024px(w)
• Images – ideally you should code your ad to detect retina display and provide/ package your ad to contain both retina and non-retina images where possible.
• Avoid using iframes in your creative – these conflict with our app security settings and open a new browser window.
• Video – ideally use the HTML5 video tag rather than embedded players such as youtube – again as most third party players will be embedded via an iframe which conflicts with our app.
• Click Thru’s/Interactive content that connects out to the internet should have offline detection built into the creative. If a video that is externally hosted cannot be accessed by the ad creative (due to the device being offline) a alert/popup should be displayed to the user. Any content within an ad that is depedent on an active internet connection can make use of the browser navigator.onLine property to check if the device is connected or not before showing a prompt or connecting out to the internet.
• Reporting – any bespoke metrics/interactions you are trying to track should be hardcoded in your ad HTML. News UK can only report on views for these ads and nothing else. When using pixels – ensure you load them in image tags and not iframes to avoid security issues with our app.
• Creatives are directly hosted by News UK in the form of a zip bundle which is delivered to users devices within the edition and unpackaged there.
nAtiVe BUttonsWe apply native page turning buttons to the left and right of the ad to avoid conflicts with any JavaScript used to detect touch/swipe events in the ad with our own native application detection for swiping. These buttons are overlaid on top of your creative automatically and it’s worth noting their positons (screenshots below) to ensure any vita copy or imagery isn’t covered by these.
nAViGAtion BAr In both portrait and landscape mode – allow for 80px at the bottom to be reserved as a safe area for our native navigation that is fixed throughout the app – ensure no text copy or call to actions or important imagery is placed here.
sUPPLyinG yoUr AdVertiseMentAll assets and the asset list must be uploaded via FTP to:https://ipadcontent.news.co.uk/EFTClient/Account/Login.htmUsername: Agency1 Password: @gency12
Please note: we cannot accept any files by e-mail.