This is a simple example showing you the difference between responsive and unresponsive web design.

Please scan the two QR codes below from your smartphone or tablet to compare the two examples.

Unfamiliar with QR codes or how to scan them? Read our introduction to QR codes.

Responsive Webpage

The responsive design fits any screen size. The contents rearrange automatically to fit the screen. There is no need to zoom or scroll horizontally.

Unresponsive Webpage

In the unresponsive design, you need to scroll horizontally or use zooming to see all the contents of the webpage.

Both examples were created from the same spreadsheet. In the responsive example we used the Responsive Blocks feature to design how the content should wrap on smaller screens.

Read the introduction to the responsive design feature

Learn how to create responsive blocks

Download the example spreadsheet