Responsive design is the process of arranging the layout in a way that all the important information is presented in a user-readable way in any kind of device or screen size. Our approach is by using a fluid grid layout that can adapt the layout to different screen sizes.

In fluid grids, we define a maximum layout size for the design. The grid is divided into a specific number of columns to keep the layout clean and easy to handle. Then we design each element with proportional widths and heights instead of pixel-based dimensions. So whenever the device or screen size is changed, elements will adjust their widths and heights by the specified proportions to its parent container. This optimises the layout and design of websites on smaller-screen devices such as mobiles and tablets.

How to create a responsive site using a responsive template

To use a responsive template for your site, select the responsive template from the templates page here. You can choose to preview the template, or select the template to immediately begin editing your responsive site.

How to add a responsive page to an existing site

As of December 2016, the 'Responsive page (beta)' feature is now available to all users. To add a responsive page, simply select a 'responsive page (beta)' from the list of page types when adding a page to your site.

Need help?

No problem, check out our responsive page guides in our dedicated help section!

You can also suggest a new feature.

Did this answer your question?