

Objects on the page have to stay properly contained within the page at all times, so one of the ways to achieve this is to have the objects ‘flat’ on the page rather than allowing them to be ‘stacked’. There are many reasons as to why this is necessary, but essentially it is because a responsive page is scaleable that it is a requirement that the page structure is maintained at all times, at any scaling point. In responsive design, stacking one object on top of another is not usually possible and all object rows in a page must be contiguous to one another. You will see that this time the object just snaps back to sit under the second object. Now try to move the bottom object further down the page so that it is on its own. Instead the objects will appear move to a different row, again one on top of each other. If you try to stack any of these objects one on top of the other, you will find that it is not possible. You will see that the yellow triangle sits on the top row, the rectangle shape is below it on the second row and the EverWeb logo sits beneath the rectangle on the third row. Now go to the Page Settings tab and change the Page Layout from ‘Centered Layout’ to a Responsive one. to yellow, to see the two shapes clearly on top of each other. You can change the color of the triangle e.g. The two shapes appear on top of each other so you will se the triangle as it is the same color as the rectangle that it sites on top of. For example, create a Fixed Width page then add a rectangle to it. In a responsive page design this is not possible.

In a fixed width design page design, objects can be stacked one on top of the other. One major area of design difference is how objects are handled on the page.
#Everweb responsive design manual
Again, check out the EverWeb User Manual to get up and running quickly. These are the kinds of circumstances where you will quickly find out that everything is different but the same. If you have already been using EverWeb’s Fixed Width Page Layout for your site, you may want to convert your existing site to a responsive one, or you may simply want to design a completely new site.

If you are designing a Responsive website in EverWeb for the first time, take a look at EverWeb’s YouTube video site to help get your started, or the EverWeb User Manual within the product which has a whole chapter dedicated to get you quickly productive. As such, whilst EverWeb works in the same way as before, the fundamentals of designing a Responsive website is distinctly different to designing a Fixed Width website. This goal was achieved, however, the concept of Responsive Website Design is in many way different to Fixed Width website design. For example, adding a new page, editing a TextBox, drag and dropping objects, accessing menu options and and so on would all remain the same as before. One of the design goals that we wanted to make sure of was that you could use EverWeb with a Responsive Page Layout in exactly the same way as you did with a Fixed Width Page Layout. This all changed in EverWeb 2.8 when the Responsive Page Layout was added. If you have been a long time user of EverWeb you will probably know already that when it first came out you only create websites with a Fixed Width Page Layout. In this post, we explore how objects in a Responsive Page Layout in EverWeb are handled when you are building your responsive website.

In the previous post, we discussed how objects are stacked in Fixed Width page layouts and how you can change the order of objects within the stack, even when you have a Master Page attached to your page.
