7

There's a web design trend that I've been seeing more and more in sites I come across. The thing is, I don't know what it's officially called, so I don't know how to look for the topic in web design sites or blogs. I'd like to find tutorials and articles regarding tips and best practices, but I haven't found any and don't know what people are calling this design style.

Basically, it's having a long front page (or inside pages too) with lots of horizontal sections with big images and text. It's sort of like one-page sites, but it's not one-page. It's sort of like Parallax, but it doesn't really use the parallax effect (not necessarily at least). It also goes very closely hand-in-hand with responsive design, as it shares that long vertical format made for lots of scrolling.

A couple of examples of what I'm referring to: www.marketo.com, www.ginzametrics.com, www.kinhr.com

I'd appreciate any help finding the official name of this, if there's any, or also any related articles or resources. Thanks!

Adrian Pauly
  • 147
  • 1
  • 7
  • A word that tends to appear alongside these kind of designs is "flat" design. Not all pages like that are flat designs, and not all flat designs are pages like that, but it's often used. [Couple of examples on here](http://dribbble.com/search?q=flat+web+page) – Chris Brown Aug 09 '13 at 00:07
  • 1
    "endless scrolling" I think? Here's a beautiful example: http://orange.com/sirius/histoire/en/history-highlights/ – erewok Aug 09 '13 at 01:00

2 Answers2

5

I believe the technical term you're looking for is single-page application or single-page interface.

Google search results for the phrase "single page website" show that it is used to describe the same types of sites. One page website comes up as another synonym (onepagelove.com provides a collection of single-page site designs, for example).

However, single-page application seems to be the most official and comprehensive term. Relatedly, it is actively used as a question tag here at Stack Overflow: https://stackoverflow.com/questions/tagged/single-page-application

Community
  • 1
  • 1
nklauza
  • 1,501
  • 1
  • 12
  • 12
  • Well, that comes pretty close, but a lot of the sites I've seen are not actually not single page websites. See http://www.kinhr.com for example — it's got a lot on a single page, but it has a few additional pages as well. But I think it comes close enough since a lot of the design principles remain the same. Thanks! – Adrian Pauly Aug 09 '13 at 06:54
4

They are "long page scrolling" designs. See: http://www.dtelepathy.com/blog/inspiration/long-page-scrolling-designs

A single page application is NOT the same as a "single page website". First of all, the difference between an application and a site is that a site is simply used to display information whereas an application provides a function or utility or service to the user. Applications are interactive by necessity. In addition, single page apps may have more than one "screen" or "view", but these views are loaded in via AJAX calls behind the scenes and do not require a page refresh. Examples of single page applications include Gmail and Facebook.

A single page website does not necessarily have a long page scrolling design.

chrisco512
  • 629
  • 3
  • 10