{"id":26470,"date":"2024-11-14T14:59:29","date_gmt":"2024-11-14T13:59:29","guid":{"rendered":"https:\/\/www.digitizer.rs\/news-stories\/animated-display-ads-and-html5-ad-creation\/"},"modified":"2026-07-20T12:31:41","modified_gmt":"2026-07-20T10:31:41","slug":"animated-display-ads-and-html5-ad-creation","status":"publish","type":"post","link":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/","title":{"rendered":"Animated display ads and HTML5 ad creation"},"content":{"rendered":"<div class=\"wpb-content-wrapper\" id=\"wpb-content-root\">[vc_row full_width=&#8221;stretch_row&#8221; css=&#8221;.vc_custom_1487086373501{padding-top: 80px !important;padding-bottom: 140px !important;}&#8221;][vc_column][vc_column_text css=&#8221;.vc_custom_1584705883889{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"font-weight: 400; color: #000000;\"><span style=\"font-weight: 400;\"><strong>Animated <em>display<\/em> ads<\/strong> are a very effective and popular way of advertising. <\/span><span style=\"color: #fd6600;\"><a style=\"color: #fd6600;\" href=\"https:\/\/www.digitizer.rs\/news-stories\/kako-koristiti-google-web-designer\/\">In the previous blog<\/a><\/span>, we introduced you to the interface and basic functions for designing and creating HTML5 ads and advertisements. <em><span style=\"color: #fd6600;\"><a style=\"color: #fd6600;\" href=\"https:\/\/webdesigner.withgoogle.com\/\">The Google Web Designer<\/a><\/span><\/em>.<\/span><\/p>\n<p><span style=\"font-weight: 400; color: #000000;\">In this article, we&#8217;ll take a look at some of the more advanced features of<em> Google Web Designer<\/em>, as well as how to store and implement the ad itself in <span style=\"color: #fd6600;\"><a style=\"color: #fd6600;\" href=\"https:\/\/support.google.com\/google-ads\/answer\/2404190?hl=en\">a <em>Google Display<\/em> campaign<\/a><\/span>. You&#8217;ll learn how to create animated <em>display<\/em> ads.<\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705784187{padding-top: 30px !important;}&#8221;]\n<h1 style=\"text-align: left;\"><span style=\"color: #ff6600;\"><strong>How are animated Display ads made?<\/strong><\/span><\/h1>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705859197{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\">How to create animated display ads and how to use them effectively in a well-designed campaign, read below.<\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705718920{padding-top: 30px !important;}&#8221;]\n<h2 style=\"text-align: left;\"><span style=\"color: #ff6600;\"><strong>Follow Us<\/strong><\/span><\/h2>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705649369{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"font-weight: 400; color: #000000;\">Events are a way of setting up actions in response to a user&#8217;s action, <em>a timeline keyframe<\/em>, or some other occurrence in an ad or HTML document.<\/span><\/p>\n<p><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Objects and actions are connected in a special window that can be opened by selecting the object, pressing the right click and selecting the &#8221;<\/span><i><span style=\"font-weight: 400;\">add event<\/span><\/i><span style=\"font-weight: 400;\">&#8221; option.<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575841860719{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">After selecting the &#8220;<\/span><i><span style=\"font-weight: 400;\">Add event<\/span><\/i><span style=\"font-weight: 400;\">&#8221; option, a window opens that takes us through 5 steps to set up the event, namely:<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575843214498{padding-bottom: 30px !important;}&#8221;]\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Target &#8211; here we select the object that triggers the event, such as <\/span><i><span style=\"font-weight: 400;\">&#8221;button&#8221;<\/span><\/i><\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400; color: #000000;\">Event &#8211; we choose an event that will trigger an action, such as when a user clicks on a button or hovers the mouse over a button<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Action &#8211; we choose an action that happened as a result, such as opening the second page of the ad, playing a video, going to the <\/span><i><span style=\"font-weight: 400;\">landing page<\/span><\/i><\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Receiver &#8211; select the ad element that performs the action, for example if clicking on the &#8221;<\/span><i><span style=\"font-weight: 400;\">Tap area&#8217;<\/span><\/i><span style=\"font-weight: 400;\">&#8216; makes the image disappear, then the image is &#8221;Receiver&#8221;<\/span><\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"color: #000000;\">Configuration &#8211; some actions require additional details, such as adding the final URL for the <i>landing page<\/i><\/span><\/li>\n<\/ol>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575841935046{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">All events are located in the lower left corner of the event area. Here we add events by clicking on the button &#8216; <\/span><i><span style=\"font-weight: 400;\">&#8216;Add event<\/span><\/i><span style=\"font-weight: 400;\">&#8221;, we edit events by double-clicking on a specific event. The event is deleted by selecting the event and clicking the button   <\/span><i><span style=\"font-weight: 400;\">&#8221;Delete&#8221; <\/span><\/i><span style=\"font-weight: 400;\">in the lower right corner of the board.<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705731275{padding-top: 30px !important;}&#8221;]\n<h2 style=\"text-align: left;\"><span style=\"color: #ff6600;\"><strong>Timeline and adding events<\/strong><\/span><\/h2>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575879876946{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">The event bar is located at the top <\/span><i><span style=\"font-weight: 400;\">of the timeline <\/span><\/i> <span style=\"font-weight: 400;\">And it allows you to link animation to events using tags and event markers. Event markers allow an event to start at a specific point in time (for example, we want something to happen, move, disappear, etc. in the 2nd second of an ad). <\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575843130078{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"font-weight: 400; color: #000000;\">When the animation reaches the event marker in the timeline, the event starts.<\/span><\/p>\n<p><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">We add a bookmark right by clicking on the exact location in the timeline where we want to add a bookmark and from the drop-down menu select the option &#8221;<\/span><i><span style=\"font-weight: 400;\">add even<\/span><\/i><span style=\"font-weight: 400;\">t&#8221;.<\/span><\/span><\/p>\n<p><span style=\"font-weight: 400; color: #000000;\">Event labels are named locations on the timeline. We use them to send the reproduction of ads to a specific point in the timeline, for example:   <\/span><\/p>\n<p><span style=\"font-weight: 400; color: #000000;\">Our click button is pink, purple in color, while after a few seconds it changes color to dark purple.<\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575842076383{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">In this case, we want to add <\/span> a <i><span style=\"font-weight: 400;\">&#8221;mouseover&#8221; <\/span><\/i> event marker <span style=\"font-weight: 400;\">that we add to the event that when someone hovers the mouse over the specified object, the object changes color to dark purple.<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705743048{padding-top: 30px !important;}&#8221;]\n<h2 style=\"text-align: left;\"><span style=\"color: #ff6600;\"><strong>Exit ad and go to the landing page.<\/strong><\/span><\/h2>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575842126832{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">By selecting the &#8220;<\/span><i><span style=\"font-weight: 400;\">Tap Area<\/span><\/i><span style=\"font-weight: 400;\">&#8221; component, we place a transparent element that allows us to initiate the action by clicking or touching the mouse.<\/span><\/span><\/p>\n<p><span style=\"color: #000000;\"><span style=\"font-weight: 400;\">From the component panel, in the <\/span><i><span style=\"font-weight: 400;\">&#8221;Interaction&#8221; <\/span><\/i> section, <span style=\"font-weight: 400;\">select &#8221;<\/span><i><span style=\"font-weight: 400;\">Tap Area<\/span><\/i><span style=\"font-weight: 400;\">&#8221; and drag it to the position where you want it to be.<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575842155262{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Right click to add an event by selecting the option &#8221;<\/span><i><span style=\"font-weight: 400;\">Add even<\/span><\/i><span style=\"font-weight: 400;\">t\u2019\u2019. In the first window we select the last option &#8221; <\/span><i><span style=\"font-weight: 400;\">Tap Area&#8221; &#8211; Touch\/Click<\/span><\/i><span style=\"font-weight: 400;\">. As an action we will choose &#8221;<\/span><i><span style=\"font-weight: 400;\">Exit ad<\/span><\/i><span style=\"font-weight: 400;\">&#8221; in order for the ad to take us to the desired destination outside the HTML document. As a receiver, we select the entire ad, and at the end of the configuration we add the URL of the destination to which we want the click of the button to lead. <\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1584705754140{padding-top: 30px !important;}&#8221;]\n<h3 style=\"text-align: left;\"><span style=\"color: #ff6600;\"><strong>Publishing an ad or HTML document<\/strong><\/span><\/h3>\n[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575842215479{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">Before saving the document, be sure to check if the HTML is functional and if it is necessary to make any changes by clicking on the <\/span><i><span style=\"font-weight: 400;\">&#8220;Preview&#8221; <\/span><\/i><span style=\"font-weight: 400;\">button in the upper right corner and selecting the browser.<\/span><\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575843373651{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\"><span style=\"font-weight: 400;\">After checking the correctness of the animated display ad, the only thing left for us to do is save the ad and prepare it for uploading to one of the platforms we want to use (<\/span><i><span style=\"font-weight: 400;\">AdRoll, Google Display.<\/span><\/i><span style=\"font-weight: 400;\">..).<\/span><\/span><\/p>\n<p><span style=\"font-weight: 400; color: #000000;\">On the left side of the window that pops up, there is general information about the document, such as size, ad validation check, and on the right we choose settings such as the name of the ad and where we want the zipped file to be saved.<\/span>[\/vc_column_text][vc_column_text css=&#8221;.vc_custom_1575843493072{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]<span style=\"color: #000000;\">We are ready to put our knowledge at the service of your business.  <span style=\"color: #fd6600;\"><a style=\"color: #fd6600;\" href=\"https:\/\/www.digitizer.rs\/kontakt\/\">Contact us!<\/a><\/span><\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=&#8221;stretch_row&#8221;][vc_column][vc_column_text]<span style=\"color: #000000;\"><em>Made by Nemanja Nedeljkovi\u0107<\/em> <em>&#8211; Senior Account Manager @Digitizer<\/em><\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=&#8221;stretch_row&#8221; css=&#8221;.vc_custom_1571217766933{padding-top: 150px !important;padding-right: 30px !important;padding-bottom: 30px !important;padding-left: 30px !important;}&#8221;][vc_column][vc_btn title=&#8221;Back to News &amp; Stories&#8221; color=&#8221;black&#8221; align=&#8221;center&#8221; i_icon_fontawesome=&#8221;fa fa-bars&#8221; add_icon=&#8221;true&#8221; link=&#8221;url:https%3A%2F%2Fwww.digitizer.rs%2Fen%2Fnews-stories%2F|title:Back%20to%20NEWS%20%26amp%3B%20STORIES|&#8221;][\/vc_column][\/vc_row]\n<\/div>","protected":false},"excerpt":{"rendered":"<p>[vc_row full_width=&#8221;stretch_row&#8221; css=&#8221;.vc_custom_1487086373501{padding-top: 80px !important;padding-bottom: 140px !important;}&#8221;][vc_column][vc_column_text css=&#8221;.vc_custom_1584705883889{padding-top: 30px !important;padding-bottom: 30px !important;}&#8221;]Animated display ads are a very effective and popular way of advertising. In the previous blog, we introduced you to the interface and basic functions for designing and creating HTML5 ads and advertisements. The Google Web Designer. In this article, we&#8217;ll take a look&hellip;<\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4383,4373,4405],"tags":[4391,4390,4410,4378,4388,4415,4402],"post_series":[],"class_list":["post-26470","post","type-post","status-publish","format-standard","hentry","category-digital-marketing-en","category-google-search-display-en","category-motion-design","tag-ads-en","tag-adverts-en","tag-business-en","tag-content-en","tag-digital-en","tag-display-en","tag-marketing-en","entry","no-media"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Animated display ads and HTML5 ad creation<\/title>\n<meta name=\"description\" content=\"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Animated display ads and HTML5 ad creation\" \/>\n<meta property=\"og:description\" content=\"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/\" \/>\n<meta property=\"og:site_name\" content=\"Digitizer\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webdigitizer\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-14T13:59:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-20T10:31:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.digitizer.rs\/pictures\/kako-se-prave-animirani-display-oglasi.jpg\" \/>\n<meta name=\"author\" content=\"Digitizer\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Digitizer\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/\"},\"author\":{\"name\":\"Digitizer\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#\\\/schema\\\/person\\\/47210bd4d1d478c044946ce088c5556e\"},\"headline\":\"Animated display ads and HTML5 ad creation\",\"datePublished\":\"2024-11-14T13:59:29+00:00\",\"dateModified\":\"2026-07-20T10:31:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/\"},\"wordCount\":1201,\"publisher\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#organization\"},\"keywords\":[\"ads\",\"adverts\",\"business\",\"content\",\"digital\",\"display\",\"marketing\"],\"articleSection\":[\"Digital Marketing\",\"Google Search &amp; Display\",\"Motion Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/\",\"url\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/\",\"name\":\"Animated display ads and HTML5 ad creation\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#website\"},\"datePublished\":\"2024-11-14T13:59:29+00:00\",\"dateModified\":\"2026-07-20T10:31:41+00:00\",\"description\":\"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/animated-display-ads-and-html5-ad-creation\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"News &#038; Stories\",\"item\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/news-stories\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Animated display ads and HTML5 ad creation\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/\",\"name\":\"Digitizer\",\"description\":\"Google Ads - Social - Email Marketing - Web Design - Video Editing\",\"publisher\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#organization\",\"name\":\"Digitizer\",\"url\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Digitizer\"},\"image\":{\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/webdigitizer\",\"https:\\\/\\\/www.instagram.com\\\/webdigitizer\\\/\",\"https:\\\/\\\/www.tiktok.com\\\/@webdigitizer\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/digitizer\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/digitizer.rs\\\/en\\\/#\\\/schema\\\/person\\\/47210bd4d1d478c044946ce088c5556e\",\"name\":\"Digitizer\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g\",\"caption\":\"Digitizer\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Animated display ads and HTML5 ad creation","description":"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/","og_locale":"en_US","og_type":"article","og_title":"Animated display ads and HTML5 ad creation","og_description":"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.","og_url":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/","og_site_name":"Digitizer","article_publisher":"https:\/\/www.facebook.com\/webdigitizer","article_published_time":"2024-11-14T13:59:29+00:00","article_modified_time":"2026-07-20T10:31:41+00:00","og_image":[{"url":"https:\/\/www.digitizer.rs\/pictures\/kako-se-prave-animirani-display-oglasi.jpg","type":"","width":"","height":""}],"author":"Digitizer","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Digitizer","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/#article","isPartOf":{"@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/"},"author":{"name":"Digitizer","@id":"https:\/\/digitizer.rs\/en\/#\/schema\/person\/47210bd4d1d478c044946ce088c5556e"},"headline":"Animated display ads and HTML5 ad creation","datePublished":"2024-11-14T13:59:29+00:00","dateModified":"2026-07-20T10:31:41+00:00","mainEntityOfPage":{"@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/"},"wordCount":1201,"publisher":{"@id":"https:\/\/digitizer.rs\/en\/#organization"},"keywords":["ads","adverts","business","content","digital","display","marketing"],"articleSection":["Digital Marketing","Google Search &amp; Display","Motion Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/","url":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/","name":"Animated display ads and HTML5 ad creation","isPartOf":{"@id":"https:\/\/digitizer.rs\/en\/#website"},"datePublished":"2024-11-14T13:59:29+00:00","dateModified":"2026-07-20T10:31:41+00:00","description":"Animated display ads are a very effective and popular way of advertising. In our new article, learn more about the more advanced features of Google Web Designer.","breadcrumb":{"@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/digitizer.rs\/en\/news-stories\/animated-display-ads-and-html5-ad-creation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/digitizer.rs\/en\/"},{"@type":"ListItem","position":2,"name":"News &#038; Stories","item":"https:\/\/digitizer.rs\/en\/news-stories\/"},{"@type":"ListItem","position":3,"name":"Animated display ads and HTML5 ad creation"}]},{"@type":"WebSite","@id":"https:\/\/digitizer.rs\/en\/#website","url":"https:\/\/digitizer.rs\/en\/","name":"Digitizer","description":"Google Ads - Social - Email Marketing - Web Design - Video Editing","publisher":{"@id":"https:\/\/digitizer.rs\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/digitizer.rs\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/digitizer.rs\/en\/#organization","name":"Digitizer","url":"https:\/\/digitizer.rs\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/digitizer.rs\/en\/#\/schema\/logo\/image\/","url":"","contentUrl":"","caption":"Digitizer"},"image":{"@id":"https:\/\/digitizer.rs\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webdigitizer","https:\/\/www.instagram.com\/webdigitizer\/","https:\/\/www.tiktok.com\/@webdigitizer","https:\/\/www.linkedin.com\/company\/digitizer"]},{"@type":"Person","@id":"https:\/\/digitizer.rs\/en\/#\/schema\/person\/47210bd4d1d478c044946ce088c5556e","name":"Digitizer","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/79f8cf59594ab9d12475710f3565615d638c108ffaaf169c20f368fc3618bdd3?s=96&d=mm&r=g","caption":"Digitizer"}}]}},"_links":{"self":[{"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/posts\/26470","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/comments?post=26470"}],"version-history":[{"count":0,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/posts\/26470\/revisions"}],"wp:attachment":[{"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/media?parent=26470"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/categories?post=26470"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/tags?post=26470"},{"taxonomy":"post_series","embeddable":true,"href":"https:\/\/digitizer.rs\/en\/wp-json\/wp\/v2\/post_series?post=26470"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}