This article covers some general guidance on optimised image sizes, formats and copy requirements.
Image Dimensions
The optimal image dimensions for assets will ultimately depend on the publishing destination (your website width will likely be different to Facebook for example), there are some general dimensions that we recommend:
- Landing page
Header image: 1200 by variable height (200 to 400 px recommended) - Confirmation page
Images for secondary call to actions:
400 x 400px – 650 x 650 px recommended - Sharing
Share Image: 1200 x 630px (min size 600 x 315px) - Facebook
App icons: 1024 x 1024px
Tab image: 111 x 74px
Viewport Considerations
Consider responsive design, as all of our campaigns are responsive and resize. For example, text within the design, rather than added via the platform, will not resize and may not read well on mobile devices.
You will want to consider the largest screen viewing width, and how these images will appear on mobile. If your website is setup to have a max-width of, say 970px, then for full page width images, you'll want to ensure those images are at least that width.
If a campaign is being run on both a website and on Facebook, the image will automatically scale (maintaining the aspect ratio) to fit a width of 810px, the max width for a Facebook Tab.
Image Formats and File Sizes
Another key consideration is the format and size of the image. Incorrect formats or content that is too heavy will result in a poor user experience, including slow load times. The standard formats you should use are:
- JPG/JPEG
Unless you require a transparent background (so there isn't a box around the image), you should almost always use a .jpg format. - PNG
Should be used only for images that require transparency. This due to the larger file sizes often associate with PNG files. - GIF
These are often used to provide animation (similar to video, but without the technical hurdles).
Your total Experience size affects the load time
It’s worth bearing in mind that all pages of a campaign (aside from Confirmation) load on landing. This includes the total number of images in the creative/design, and also any published User Generated Content (UGC photos submissions, social aggregated content, etc).
We’d recommend a maximum of 40-50 images in total with an aim to keep your experience total size at 5mb or under. Keep the individual file sizes as small as possible, by leveraging image optimizers to ensure all the images you plan to use are compressed as much as possible. These programs can be very helpful:
Copy Requirements
In order to prepare copy ahead of applying to a campaign, here’s an overview of what to remember to cover
- Landing page
Campaign intro: Headline, Byline, Description - Form
Confirm the data capture form fields required; Terms & Conditions - Confirmation page
‘Thanks for entering’ type copy; Secondary call to actions - Sharing - Facebook
Title, Byline & Description; Twitter: maximum 116 characters - Facebook Tab
App name