--- title: "HTML5" slug: "html5" updated: 2024-04-19T15:37:01Z published: 2024-04-19T15:37:01Z canonical: "help.dsp.samsungads.com/html5" --- > ## Documentation Index > Fetch the complete documentation index at: https://help.dsp.samsungads.com/llms.txt > Use this file to discover all available pages before exploring further. # Samsung Hosted HTML5 If you already have a HTML5 creative ready, see [Import HTML5 Creative](/v1/docs/import-html5-creative) for more information about importing your file to Samsung DSP. Samsung DSP allows you to propagate cross-platform ads by using *Image (HTML5)*. *Image (HTML5)* unlocks advanced customizations and animations through *CSS* and *JavaScript* to create rich media that will increase viewers’ interaction and engagement with your content. With *Image (HTML5)*,you can create expandable, floating ads (sometimes known as *Top-Layer Ads, Over-The-Page* or *Vokens*), and combo units (known as *roadblocks*, *companion units*). This document explains how you can create a HTML5 file by adding trackers and test your creative before importing it into Samsung DSP. ## Feature Availability Some features are not supported yet in every region. Use this table to see if you have access to this feature based on your location. | Region | Country | | --- | --- | | North America | USA, CA | ## Click Actions Available** | Website | Application | Full Screen Video | Microsite | Virtual Tune-In | | --- | --- | --- | --- | --- | | | | | | | ## Before Starting Some information to consider before creating your HTML5 file: - **CSS animations and transitions development and implementation may differ from one web browser to another.** Use services such as [CanIUse.com](http://caniuse.com/) or [Modernizr](http://modernizr.com/) to check if the features are available for the targeted browser. - **Provide a fallback/down-level version or backup image for browsers lacking features required by the ad or if an error occurs**. Samsung Ads suggests three techniques to handle the fallback experience: - *Progressive enhancement*: This consists of building an ad to render on all browsers with a basic level of user experience and, where possible, advanced features will be rendered. - *Graceful degradation*: This consists of building an ad to render with advanced features in more modern browsers and, when limited by a browser's capabilities, *degrades gracefully* and keeps a basic level of user experience. - *Backup image*: A static or slightly animated image is shown to the user. All HTML5 feature detection needs to be handled by the ad itself. - **Check if your CDN is accepted on all inventory you intended to buy/bid on** if you don’t plan using Samsung DSP’s to host library and framework code to deliver files. Note that publishers and ad exchanges will still include those files in the final file weight calculation. - **Be SSL-compliant with RTB/Programmatic exchanges and some publishers**: Use either `https:` for all URLs (example: `<script src="https://example.com/my_file.js"></script>`), or have URLs starting with `//` (example: `<script src="//example.com/my_file.js"></script>`). Note that the second method will not allow for local ad testing. ## Building the HTML5 We have created user guides for the most popular HTML5 authoring tools you can refer to build your file. If you are using a different authoring tool, see [Building HTML5 with your authoring tool](/v1/docs/building-html5-with-your-authoring-tool) for more information. | **HTML5 Authoring Tools** | **Documentation** | | --- | --- | | Adobe Animate | [Building HTML5 with Adobe Animate](/v1/docs/building-html5-with-adobe-animate) | | Google Web Designer | [Building HTML5 with Google Web Designer](/v1/docs/building-html5-with-google-web-designer) | | Tumult Hype | [Building HTML5 with Tumult Hype](/v1/docs/building-html5-with-tumult-hype) | ## Examples (Output) | Type | File | Demo | Note | | --- | --- | --- | --- | | Banner | [Banner.zip](https://cdn.document360.io/287afab9-a086-4024-a782-6cbdb167f005/Images/Documentation/adgear_html5_banner.zip?sv=2026-02-06&spr=https&st=2026-11-10T16%3A24%3A53Z&se=2026-11-10T17%3A24%3A53Z&sr=c&sp=r&sig=5qZkhPTVq7Ud%2Fykikv2giz78SjCOFhi3X2Lx3PFwKy0%3D) | [demo](https://codepen.io/jplaroche/full/dyjjjEL?width=300&height=250&url=https://cdn.adgrx.com/files/ff/R-jH0pcV8QwUaLegLGoQ/children/adgear_html5_banner/index.html) | Simple 300×250 banner ad with a click. | | Video | [Banner Video.zip](https://cdn.document360.io/287afab9-a086-4024-a782-6cbdb167f005/Images/Documentation/adgear_html5_banner_video.zip?sv=2026-02-06&spr=https&st=2026-11-10T16%3A24%3A53Z&se=2026-11-10T17%3A24%3A53Z&sr=c&sp=r&sig=5qZkhPTVq7Ud%2Fykikv2giz78SjCOFhi3X2Lx3PFwKy0%3D) | [demo](https://codepen.io/jplaroche/full/dyjjjEL?width=300&height=250&url=https://cdn.adgrx.com/files/-f/9ZqrSh3YFDtv1Bld_4jw/children/adgear_html5_banner_video/index.html) | Simple video banner with a click. | | Filmstrip | [Filmstrip.zip](https://cdn.document360.io/287afab9-a086-4024-a782-6cbdb167f005/Images/Documentation/adgear_html5_filmstrip.zip?sv=2026-02-06&spr=https&st=2026-11-10T16%3A24%3A53Z&se=2026-11-10T17%3A24%3A53Z&sr=c&sp=r&sig=5qZkhPTVq7Ud%2Fykikv2giz78SjCOFhi3X2Lx3PFwKy0%3D) | [demo](https://codepen.io/jplaroche/full/dyjjjEL?width=300&height=600&url=https://cdn.adgrx.com/files/ri/oXV34JdIwfCxY8vQ7aBA/children/filmstrip/index.html) | Simple 300×600 filmstrip ad with a click. | | Banner loading an XML | [Banner XML.zip](https://cdn.document360.io/287afab9-a086-4024-a782-6cbdb167f005/Images/Documentation/adgear_html5_banner_xml.zip?sv=2026-02-06&spr=https&st=2026-11-10T16%3A24%3A53Z&se=2026-11-10T17%3A24%3A53Z&sr=c&sp=r&sig=5qZkhPTVq7Ud%2Fykikv2giz78SjCOFhi3X2Lx3PFwKy0%3D) | [demo](https://codepen.io/jplaroche/full/dyjjjEL?width=300&height=250&url=https://cdn.adgrx.com/files/k6/KOmTf6DUzs59y42GSi4w/children/adgear_html5_banner_xml/index.html) | Simple 300×250 banner ad that loads an XML file. | | Banner with config variables | [Banner Configuration Variables.zip](https://cdn.document360.io/287afab9-a086-4024-a782-6cbdb167f005/Images/Documentation/adgear_html5_banner_config_vars.zip?sv=2026-02-06&spr=https&st=2026-11-10T16%3A24%3A53Z&se=2026-11-10T17%3A24%3A53Z&sr=c&sp=r&sig=5qZkhPTVq7Ud%2Fykikv2giz78SjCOFhi3X2Lx3PFwKy0%3D) | [demo](https://codepen.io/jplaroche/full/dyjjjEL?width=300&height=250&url=https://cdn.adgrx.com/files/7t/ic1L4RLnkfGxJh-dXBjw/children/adgear_html5_banner_config_vars/index.html) | Simple 300×250 banner ad that loads config variables from Samsung DSP. | ## Support For questions pertaining to HTML5 creative development for delivery via Samsung DSP, contact your *Account Manager* (i.e., Admin).