Recently I have seen a lot of new websites have been redesigned that each paragraph or section have different background colour with full width.

For example: http://theme-fusion.com/avada/

enter image description here

What is the purpose of this layout design that is becoming very popular?

I have notice with that type of design, a page become large and more scrolling. Hence poor readability.

  • 2
    I'm not sure why you equate more scrolling with poor readability. Why do you say this? Poor readability compared to what?
    – JonW
    Commented Aug 11, 2014 at 10:58
  • 2
    Man I hate these kinds of websites, they often contain a large chunk of text but information density is often incredibly low. Often these sites get used as one big commercial. Examples are the one you mentioned, apple.com/ios/ios8 , kitkat.com/android Some websites just use it for their frontpage, which I'm fine with if the information density is kept normal. For example: esize.com Some sites just go over the top though, making the header HUGE so you can't even see anyinformation you're looking for. One plus though, they are often optimized for Phones/Tablets. Commented Aug 11, 2014 at 11:21
  • I think your wireframe is incorrect because those sections are exactly what designate each text area. You have sections AND a text area - both outlined. In reality the sections are what distinguish each text area. It's subjective really but it just breaks up the content into chunks and makes it more visually appealing.
    – user43251
    Commented Aug 11, 2014 at 13:00

5 Answers 5


Another personal opinion:

Think of it as a (perhaps animated) multimedia magazine experience

Colors, fluid/animated and fullscreen / big elements is just the thing for the moment

Fullscreen adds some air/spaciousness to the viewing experience

Colors make each page/section stand out more. And more fresh/vibrant as oppose to old and dry "texty"

I think most people enjoy scrolling down and read the pages/sections like a newspaper/magazine, instead of constant clicking, reading and then scrolling up to click on next item

Some do it with style, others just copy the trend without thought


As with "web gradients 2.0", "tickered text", overly animated sites or the paralax effect, it's trend. However, "divided content" also fundaments on that people don't care if they have scroll longer pages, as long as they get to the part they want to read.

Less clicking and carefully selected text in each "divided content" means that you're less likely to confuse the visitor and all the content he needs to find is on this very spesific page.

It also shakes up the notion that long pages can be boring, by making content appealing/interesting to look at.

Here's one reference talking about this: http://thenextweb.com/dd/2013/12/29/10-web-design-trends-can-expect-see-2014/7/ (They're calling it "long scrolling sites")

In my experience, "divided content" is often used, but not restricted to, web pages concerning conferences. Here is one example: http://max.adobe.com/

And as with any "new" technology:

Don’t use technology for the sake of it. Innovation means taking risks, exploring new avenues, and making the most of opportunities. It does not mean doing things just because you can.

(Source: https://econsultancy.com/blog/62335-14-lousy-web-design-trends-that-are-making-a-comeback)


I think the most compelling argument for these types of layouts is that they are used specifically for sites that want to tell a story. They are narrative in nature and progress naturally from top to bottom with scroll in easily digestible chunks with lots of space for large impacting visuals.

Some of the examples in this article from Smashingmagazine.com demonstrate this.

This article from Uxmag is more focused on parallax but also mentions the storytelling aspect of this type of single page layout.


Maybe someone else has a better answer than me, but in my experience this is simply a design trend that is being copied because it 'looks cool' and 'others are doing it'.

However, in some cases where people put thought into their work it can be used to try and differentiate different sections on a page (e.g. Product Description, List of Features, Reviews, Tips, etc.). In that case though, it should never be applied in such a way that it becomes distracting or worsens the readability.

Note: this is my personal opinion and not fact.


Page sections with different background colours are not optimised for readability. Instead, they are designed to generate enough user interest and get them to click that 'Call to Action'.

A landing page visitor 'scans' the page, scrolling to the bottom very fast. If you put in too much text there, the visitor is likely to bounce. So the words are few and carefully chosen.

These carefully chosen words need to get the visitor's attention. So they are coupled with a beautiful background (colour or picture), not unlike how a brochure is set up.

  • Offtopic: Slightly pessimistic view.. Many of said pages are also just designed to look nice, modern and appealing. Not only to quickly "get users to click that 'Call to Action'". Depends on the site of course
    – mowgli
    Commented Aug 10, 2014 at 22:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.