When developing ads in HTML, you can run it on multiple devices: Desktop, Tablet and Smartphones. There are also formats that are specifically made to run on all devices, these are the cross-device formats.
Mobile ads (Smartphone and Tablet)
When developing ads for mobile phones there are a few things that you need to take into account:
- Aspect ratio:
There is no standard aspect ratio for devices. The common aspect ratio is 16:9 but there are a few popular devices that have a different aspect ratio. Test your creative in different aspect ratio devices. More info about certain devices.
- Screen orientation:
Smartphones & tablets can be in either portrait mode or landscape mode. It is important to have content for both modes, except if your ad will run in-app where the app has no option to go in a certain mode.
- Slower CPU for animations:
Smartphones and tablets have a slower CPU than desktops. So despite mobile devices getting faster, go easy on the animations. Test your creative on real (older) devices to know for sure that your animations are running smoothly.
- Different Operating Systems:
Smartphones and tablets have different operating systems (OS), we support iOS and Android. Some features don't work on both systems, some work only partially. Our templates have been tested in iOS and Android, especially our advanced features templates have fixes for OS issues.
- File size:
Be aware that most smartphones will not always be connected to WiFi. If the user is connected via a plan through 3G or 4G, the file size is definitely something to consider. Total ad size must never exceed 300 KB initially. Of course more KBs may be loaded after user interactions such as clicks.
When developing ads for desktops there are a few things that you need to take into account:
- Screen size:
Keep in mind that there are a lot of different physical screen sizes. Also the browser window of two exactly the same computer screens can be different (think about a bookmarks bar or a toolbar or even none at all). Another possibility is a non-fullscreen browser. You never know in advance how much space is going to be available for your ad, unless the ad uses a fixed size adslot ofcourse.
- Different browsers:
Different operating systems have multiple browsers. Make sure you test your creative in the most common browsers. Windows > Chrome, Firefox, Edge. Mac > Safari, Chrome, Firefox.
- W3 Schools
- For detailed information about multiple browsers’ support of HTML5 features, refer to the CanIUse website.
- MDN Web Docs
Find more information about certain formats or features in the next section.
Please sign in to leave a comment.