Mobile app version of vmapp.org
Login or Join
Jessie844

: Name of web layout made up of full-width sections Is there a name for the type of web site layout in which the body of the page is divided into horizontal sections; each section is 100%

@Jessie844

Posted in: #PageLayout #WebsiteDesign

Is there a name for the type of web site layout in which


the body of the page is divided into horizontal sections;
each section is 100% wide but has content of fixed width (that is typically centered);
the background of each section is usually different?


Examples:

www.ogurcak.com/ http://www.spacex.com/about


I am not looking for templates, just for the name of this kind of layout.

Edit: There does not seem to be a name for it. I will call it "sandwich layout".

10.04% popularity Vote Up Vote Down


Login to follow query

More posts by @Jessie844

4 Comments

Sorted by latest first Latest Oldest Best

 

@Heady304

They're often referred to as: "single page websites."

sixrevisions.com/web_design/the-science-behind-a-single-page-website/ http://www.awwwards.com/websites/single-page/ searchengineland.com/single-page-websites-seo-182506

10% popularity Vote Up Vote Down


 

@Ravi4787994

You can't really apply one label to this style.


It is fluid in the sense that it expands and contracts to use the whole viewport.
It typically used for vertical designs because it helps to break up the scrolling depth.
It is most commonly found on one page sites because it is well suited to a lot of content.
And it has certainly been a fashionable approach to site design over the past 18 months. I suspect it will begin to die back before long, at least in those cases where it's not particularly appropriate.


One Page Love is a good reference for use cases in this style.

10% popularity Vote Up Vote Down


 

@Margaret771

You can find these type sites searching vertical scrolling or infinite scrolling.

10% popularity Vote Up Vote Down


 

@Miguel516

A common term is 'Vertically Scrolling Websites'.

Here is an example of the term in use.

'Parallax Scrolling' is also used when the background images and content move at different speeds when scrolling.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme