Responsive banners are designs that adapt to any aspect ratio. This makes them perfect for full-screen advertisements, expandable designs, wallpapers and Digital Signage.
To start building a Responsive Design, select a Responsive Blank Canvas or Responsive Template in the template selection screen.
Choosing one of these options will automatically link to the All Sizes view for Responsive In-Page aspect ratios. The tabs in the Sizes panel allow for viewing In-Page and Fullscreen aspect ratios, as well as shifting between Landscape and Portrait sizes.
Fullscreen aspect ratios are selected based on the aspect ratio of different commonly used screens to view designs, such as 16:9, 4:3 and 5:3. This makes them perfect for interstitial advertisements, landing pages and digital signage. In-Page aspect ratios are designed to be used for banners that will be displayed on the same page as other content, similar to how Fixed size banners are currently served. These are used for Responsive Wallpapers and Fixed-Dimension Responsive designs.
Building a responsive design is done the same way as building a fixed-size project. As with a fixed size design, enter the editor for the first aspect ratio by clicking on the size. After finishing the first aspect ratio, use it to activate the rest of the aspect ratios that you will need for your project.
It is recommended that you activate as any aspect that your responsive design may be viewed in. This will ensure that it will look good no matter what aspect ratio is used.
After building all of the different sizes for the project, the final banner will be able to respond to the aspect ratios that you have applied. For an example of a responsive design in action, see the GIF below.
Responsive designs are set to adapt to the container that they are served into. In order to make sure that this design is able to adapt to different screen resolutions and sizes, it's important to make sure that the container, or "DIV", that the design is served into is also responsive.
Responsive DIVs, like responsive designs, are set to adapt to changing screen resolutions. Serving a responsive design into a fixed size DIV will not allow for the design to adapt to differing screen sizes and resolutions.