HTML5 is one of the most popular baseline used to code powerful and dynamic websites and ads. It is designed to better integrate with video and rich media driven internet, allows engaging ad options and offers greater monetization opportunities, particularly within mobile and video.
With HTML5 as one of the year’s trending topics, many people have stereotyped that if a website, or ad, is created in HTML5, it is automatically considered as responsive. Sad to say, it’s not true. As matter of fact, whether you use HTML5 or not, the level of responsiveness is however, still dependent on how you create.
There are 2 kinds of a responsive ad or website. Each kind has different advantages and downsides so it is up to you to choose what best fits your needs.
Fully Responsive Design (Fluid Design)
A Fully Responsive ad or website is capable of resizing easily regardless how big or small the screen is and will fluidly adjust all content to ensure it fits. Simply saying, the version of your ad or website displayed at 67% of its total width is different than at 68%, 69% etc. using this design is advantageous in the sense that you can be able to fully render each ad or page regardless of the dimension available and fully utilize available space. The only drawback for this type of design is slightly reduced control since any range of dimensions is possible and must be planned beforehand compared to 4-8 set breakpoints used in adaptive designs.
Adaptive Design (Breakpoint Based Semi-Responsive Design)
Unlike the Fully Responsive design, the adaptive design establishes set breakpoints which content is designed to resize to once a threshold is passed. Designs can be specified at 25% of total width, a different one at 50%, 75% and 100%. Content may be altered significantly to ensure that the most important message is conveyed while various secondary visual elements are added or subtracted depending on which breakpoint is met.
Other Things to Consider
HTML5 fonts re-size easily
Responsive ads align best with responsive pages
A responsive website is not the same as a mobile app, or a mobile-specific version of a website
Adaptive design typical breakpoints: 320px, 480px, 760px, 960px, 1200px, and 1600px in width