Digital Material Instructions
 

Format

• jpg, png, 3rd party tag (iframe)

• One link and the entire ad serves as the link area

• Material may have its own click / impression tracking. 

Material sizes

• 620 x 891 px ( 300 kB)

N.B. 3rd party tag :  Format: Iframe.  The content can only be lightly animated. 

Material delivery

Material deadline: 2 working days before the campaign begins

After You have made the booking, please send the material via material link . Material delivery >

If you have any problems with submitting the material through the upload link, please contact us by e-mail: digitrafiikki@sanoma.com

Format

• jpg, png, 3rd party tag, HTML5

• One link and the entire ad serves as the link area

• Material may have its own click / impression tracking. 

• Animations made with Canvas are not working properly on iOs. We do not recommend using Canvas if the campaign is run in our iOs apps.

Material sizes

• 300x250 px (tag, HTML5)

• 600 x 500 px (.jpg, .png)

• Please note when creating image material: 600 x 500 px material is scaled according to the screen width of the phone so design the material so that it also looks good on smaller screens (min. 300 x 250 px).

• Kilobyte limits: 300 kB

Material delivery

Material deadline: 2 working days before the campaign begins

After You have made the booking, please send the material via material link . Material delivery >

If you have any problems with submitting the material through the upload link, please contact us by e-mail: digitrafiikki@sanoma.com

For cross-screen parade, we need separate material for desktop and mobile:

Desktop

• 980 x 400 px

• File formats: JPG, PNG, HTML5, iframe tag

• Max 300 kB

• Max 5 / size

• Material may have its own click / impression tracking. 

Mobile

• 600x600px or 300x300 px

• File formats_ JPG, PNG, HTML5, 3rd party tag 

• Max 300 kB

• Material may have its own click / impression tracking.

N.B. HTML5 material may be either responsive or a fixed size of 600x600 or 300 x 300. The ad slot is scaled according to the width of the device.

Material delivery

Material deadline: 2 working days before the campaign begins

After You have made the booking, please send the material via material link . Material delivery >

If you have any problems with submitting the material through the upload link, please contact us by e-mail: digitrafiikki@sanoma.com

Desktop

• Wallpaper size in all media is 1600 x 1200 px, kilobyte limit 300kB.

• File formats: JPG, PNG or GIF (not animated)

• Wallpaper is centered unless otherwise stated in the media-specific positioning instructions.

• Wallpaper cannot load through a tag and it is not clickable.

• Wallpaper is only sold with a parade. Parade material size 980x400 px. Formats .jpg, .gif, .png (300 kB), HTML5 (max300 kB) or iframe -tag.

• Please remember always https-requirements about linkages of HTML5 materials. Parade ad can be loaded from 3rd party tag.

• The wallpaper must have a subdued appearance and it must be sent to the media for approval no later than 5 days before the campaign launch.

• The media reserves the right to request changes to the product if deemed necessary.

• Please note that Wallpaper sized 1600 x 1200 will not be scaled according to the screen resolution so some of the content may not be visible on smaller screens.

• See the media-specific positioning instructions > 

Material delivery

Material deadline: 2 working days before the campaign begins

After You have made the booking, please send the material via the material link. Material delivery >

If you have any problems with submitting the material through the upload link, please contact us by e-mail: digitrafiikki@sanoma.com

Format

• 300x600px,  max 300 kB

• Formats: jpg, png, 3rd party tag, HTML5

• One link and the entire ad serves as the link area

• Material may have its own click / impression tracking.

• Animations made with Canvas are not working properly on iOs. We do not recommend using Canvas if the campaign is run in our iOs apps.

Material delivery

Material deadline: 2 working days before the campaign begins.

After You have made the booking, please send the material via material link . Material delivery >

If you have any problems with submitting the material through the upload link, please contact us by e-mail:  digitrafiikki@sanoma.com

Material instructions:

• Image 600 x 314, max. 80 kB

• Headline max. 90 characters

• Lead max. 150 characters

• Advertiser: (the advertiser's name as it should be displayed in the highlight)

• The Performance-based Native also has an activation text "Read more". It is automatically added  to the ad and you don't need to provide it separately.

• No full stops are used in the headline. A question mark, dash or colon are ok.  We do not recommend the use of exclamation marks. 

  • For example: Do you know the everyday salt bombs to watch out for? OR Many eat too much salt every day without knowing it OR Your first bike is like your first love – see the amazing pictures of bikers

• The headline and lead should be grammatically correct and written in good Finnish

• Clicking should redirect to content which is in line with the headline and lead (not e.g. a product catalogue, the frontpage of the company website or an online shop). The content must deliver what the headline has promised.

• Writers should find out how similar topics have been headlined and illustrated in the selected media before. 

Material instructions:

Campaign materials can include a parade, half page skyscraper, or digital full-page ad, or various combinations of these. The best reach is achieved by using all three ad formats.

Digital Full-Page

• File formats: JPG, PNG, 3rd party tag (iframe), HTML5. The material cannot be in MP4 format.

• Size: 620 x 891 pixels (300 kilobytes).

More detailed instructions: Digital Full-Page Ad

Parade

Desktop

• Size: 980 x 400 pixels.

• File formats: JPG, PNG, HTML5, 3rd party tag, vertical MP4 video (refer to instructions).

• File size limit: 300 kilobytes. Maximum 5 pieces per size.

Mobile

• JPG, PNG: 600 x 600 pixels or 300 x 300 pixels.

• HTML5, JavaScript tag: 300 x 300 pixels.

• File size limit: 300 kilobytes.

• Maximum 5 pieces per size.

More detailed instructions: Parade

Half Page Skyscraper

• File formats: JPG, PNG, 3rd party tag, HTML5 (HTML5 video within the tag).

• Animations created with Canvas do not work properly on the iOS platform, and we do not recommend using them if the campaign will be displayed in our iOS applications.

• Size: 300 x 600 pixels.

• File size limit: 300 kilobytes.

More detailed instructions: Half Page Skyscraper

1. The creative must have one root HTML file (index.html).

2. You may use folder structure where e.g. the style files and images are located in separate folders.

3. HTML5 materials must be delivered in a zipped file (.zip) containing all the files related to the ad.

4. Clicks must open in a new browser window (_blank).

5. Use unique identifiers, classes, variables and function names for each ad.

6. The margin value of the creative's style configurations must be 0 so that additional borders do not appear around the outer edges of the banner.

7. You should preferably use double quotation marks (").

8. Please note that your ad creative will be published inside an iframe on the media page/app. Please check that click tracking has been done according to our instructions.

9. The default character encoding in HTML is UTF-8.

10. Calculating the file size: All of the files related to the ad - images, script files, fonts, style files - must be included when calculating the ad's file size.

11. Keep the number of files reasonable; each individual file load burdens and prolongs the loading of the ad/page. The maximum number of host-initiated file requests is 15.

12. By default, all older browsers that do not support HTML5 (such as IE9 and older versions) are excluded from the campaign. However, if you wish to include old browser versions in your campaign, please deliver a backup image with your HTML5 material that can be used with older browsers.

The instructions below explain how to add click tracking to material when HTML5 material is run directly through Sanoma's system.

Sanoma Click API

Add the following code snippet to the head section of your HTML code:
 

<script src="https://sn.sanoma.fi/js/ClicksApi.js"></script>

Defining the ClickTAGs

Example 1: Example in cases where clickthrough URL is defined directly in the html:

<a href="javascript:void(0);" onclick="SanomaClicksApi.openClickUrl('https://yourlinkgoeshere'); return false;">Click here</a>

Example 2: SanomaClicksApi supports either specifying clickTag name as argument or using default tagname provided by Xandr by omitting argument altogether. 

<a href="javascript:void(0);" onclick="SanomaClicksApi.openClickTag('clickTAG'); return false;">Click here</a> 

<a href="javascript:void(0);" onclick="SanomaClicksApi.openClickTag(); return false;">Click here</a>

Download instructions: Google Web Designer

Improve Initial Display

• Use inline CSS styles and HTML so that the initial display of the ad would load as fast as possible.

• Limit initial dependencies on any render-blocking .js and .css files.

• Load interactive elements as a deferred or secondary subload.

• Defer heavy file weights (e.g. a video) until the user initiates interaction.

• Avoid any unnecessary downloads.

• In order to boost the loading of an ad, always combine files whenever possible, e.g. JavaScript libraries, HTML, CSS.

• In order to improve the initial visual experience, check the device and the connection speed to provide the most optimum solution. For instance, display a lighter version of the ad in devices with slower connection speeds, so that the user experience would still be as good as possible.

Image Assets

• Optimise all images

• Preload images when necessary

• Consolidate images whenever possible (sprite sheet)

• Use sprite sheets for multiple display assets and animation

Avoid:

• Ads may not employ rapid or "strobing" animation of any graphic, copy, or background elements.

• Avoid animation effects that are CPU intensive (20% average CPU usage accepted, sustained spikes over 70% will be rejected)

• Avoid or reduce the usage of:

  • loops and timers (cancel/Clear all setInterval and setTimeout once their job is done)

  • setInterval

  • setTimeout

  • requestAnimationFrame

  • eval() to avoid security risks

  • global variables

• Minimize DOM access

• jQuery is not recommended for HTML5 ads for these reasons:

  • Degraded performance on mobile devices because of reliance on time-based animations.

  • Unnecessary file weight: the majority of the library's functionality isn't required.

• IAB: HTML5 for Digital Advertising
• IAB HTML5 Ad Validator

If you know how to build websites, you also know how to build HTML5 ads. You may use any tool you want, Notepad++, CoffeeCup, Sublime, Notepad etc. An HTML5 ad is like an HTML5 page, but smaller and simpler. You may also design your ad using HTML5 animation tools, such as Adobe Edge or Google Web Designer.

Please Observe Concerning HTML5 Materials

Calculating the kilobyte limit: all files related to the ad are included.
Maximum number of host-initiated file requests: 15
Avoid unnecessary loads after the initial load. If it is essential for the ad, the maximum kilobyte size of a subsequent load may be no larger than the initial load.
A subsequent load occurring due to the user’s activation (e.g. mouseover or click) may be larger.

Read more from the instructions for HTML5 materials »

• If you want the wallpaper and parade banner to blend together seamlessly, make the background of the parade banner transparent. This way the creatives are not prone to getting seams if there are a few pixel shifts in the page layout.

• The most important parts of the wallpaper like logos, offers and texts should be positioned up and close to the content of the page (leave a few pixels margin). This way the wallpaper will work better on smaller screens as well where the sides and bottom parts get cut off.

• Considering that the parade banner is only visible at the top of the page, the effect of the creative improves if the main message is included in to the sides of the wallpaper as well. In dynamic wallpapers the message can appear to the wallpaper when the user scrolls the page.

• The size of the wallpaper can be reduced by leaving the area covered by content blank. Leave a few pixels margins to prevent slight shifts in page layout to cause seams.

Ad displays work in the same way as the device browser, meaning that the ads are built using HTML5, CSS and JavaScript technologies similarly to responsive websites. The ad can contain, for example, video, animation, multiple links and clickable elements. The ad display can continue downwards so that the user scrolls down similarly to a website.

The material is delivered as a zip file, including the index.html and the image, CSS and JavaScript elements required for the ad. Possible videos can be streamed in the ad. The maximum file size of the zip file is 5 MB, no tag materials.

• Size: 1600 x 1200 px

• Kilobyte limit: 300 kB

• Dynamic Wallpaper material must be HTML5. JPG and PNG materials are also accepted.

• The visible height of the top part is either 400 or 250 pixels, depending on the product.

• Dynamic Wallpaper consists of a single file. No separate giant panorama material is therefore delivered with Dynamic Wallpaper.

• The Wallpaper must have a subdued appearance.

• The media reserves the right to request changes to the product, if deemed necessary.

• Please note that a Wallpaper sized 1600 x 1200 will not be scaled according to the screen resolution so some of the content may not be visible on smaller screens.

• Dynamic Wallpaper cannot be run through a third party tag.

• HTML5 Dynamic Wallpaper works on most browsers. However, please note that it does not work in Internet Explorer 9 or older browsers, nor browsers without HTML5 support. A backup image is not possible.

• Adding click tracking: detailed instructions here

Deliver the following elements/information to the Traffic Team:

• URL of the ad's HTML page if the ad is hosted on e.g. the advertiser's or advertising agency's server OR a ZIP file containing the ad's HTML page and the used image, script and style files

• Code of the background colour in the space left around the wallpaper (e.g. ”#30821b”) or a sample of the background colour

• State whether a locked or scrollable Wallpaper option is used

• Third party tracking pixel URL (optional)

Dynamic Wallpaper Positioning

HS.fi, IS.fi

• Dynamic Wallpaper can be locked or scrolling.

• The content width is 980 px, but centre alignment is done according to a width of 1190 px (cf. PSD template).

• Please observe the following when designing the Wallpaper: The Wallpaper is centered on the page. The content of Iltasanomat.fi begins 250 pixels from the top of the page (cf. PSD template).

• Tip: The content area (980 px) can be filled with white colour to create a Wallpaper that meets the kilobyte limits. Do not crop it too closely to allow for some margin for positioning.
  Download the PSD templates

Lifestyle: Hyvaterveys.fi, Kodinkuvalehti.fi, Menaiset.fi, Etlehti.fi, Tiede.fi, Vauva.fi, Soppa365.fi

• Dynamic Wallpaper can be locked.

• The content width on the sites is 1250 px. Tip: The content area (1250 px) can be filled with white colour to create a Wallpaper that meets the kilobyte limits. Do not crop it too closely to allow for some margin for positioning.

• The Wallpaper is centered on the page according to the enclosed PSD file.
  Download the PSD template

The product consists of a video that should be size 800 x 600 px (the media scales it to full-page) and a 980 x 400 px giant panorama overlay ad on top of the video. The ad should be partly transparent so that the video plays under it.
 

Giant Panorama

• Size: 980 x 400 px

• File format: JPG, PNG (max. 250 kB) or HTML5 (kilobyte limit of initial load max. 200 kB)

• The Giant Panorama may be partly transparent (PNG or HTML5)

Wallpaper (Video)

• 800 x 600 px video

• File size: max. 3,5 MB

• Frame rate: 25 FPS

• File format: mp4 

• Codec: H.264/MPEG-4 AVC

• No sound

• The whole wallpaper is clickable

In the ad template:

• The video is expanded to fill the whole background.

• The video starts automatically and is repeated in loop. The video may be programmed to stop when the user scrolls down.

• A pause/play button is added to the top right-hand corner.

• The video starts to play immediately when the user enters the site (the video cannot have sound).