iPad Advertising Specifications for HTML5

Guidelines for Creating Ads in HTML5

Supply one .zip file that contains both orientations of the ad — horizontal and vertical

Page Dimensions and Margins:

  • Landscape: 1024px x 748px
  • Portrait: 768px x 1004px
  • Margins/Guides (for both orientations): top = 44px, bottom = 35px (these are the areas on the page which get covered by the application’s navigation bars. Do not place text here, only unvital imagery)
  • Creating content in HTML5 requires a new dedicated directory for each separate HTML5 feature or widget e.g. “/myHTMLwidget/”. Each HTML5 feature can contain several pages
  • The HTML pages must exist in the root of the directory. Files, such as CSS, JavaScript, and other assets can be placed within sub-directories if desired
  • Size: 1 to 2 MB in size including both orientations. This may not be possible if video is embedded within the advertisement. Longer video should be streamed
  • Flash is not supported – due to the limitations with respect to the flash support of Apple iOS it should not be used
  • Processor and memory usage – advertisements which apply excessive load on the device CPU or memory should be avoided

 

File Naming Conventions

All landscape and portrait pages must be prefixed with “landscape” and “portrait” respectively and numbered sequentially from 1 upwards as follows:

myHTMLwidget/

landscape1.html

landscape2.html

portrait1.html

portrait2.html

assets/

etc.

JavaScript Requirements

PressRun reserved function names:  Pages in PressRun are pre-loaded before they are visible on screen and therefore, on load events, may cause undesirable effects. The PressRun application expects the following functions within the JavaScript to handle certain events:

onScreen() – This is called by the app once the page is visible

offScreen() – This is called by the app once the page is on longer visible

isOnline(bool) – This is called by the app when the page loads and the online status changes. A boolean of true/false is passed in, true meaning online and false meaning offline.

Video is an example of what the above functions should be used for:

onScreen() – Start a video to play automatically (replaces the autoplay attribute on a video tag as the user wouldn’t want a video to play when the page isn’t visible yet)

offScreen() – Stop a video that is currently playing

isOnline(bool) – Update content from a live feed