What Is Single-Page Design?Tuesday, May 6, 2014
Single-page design is exactly what it sounds like—an entire website’s content existing on a single URL.
Subsequently, single-page web designs are navigated by scrolling, rather than clicking to different pages. And instead of separating content into different interior pages, content is separated into different sections (or “panes”) that come into view as the user scrolls down the page.
The focus is on creating a great user experience.
3 Reasons To Love Single-Page Web Design
1) Scrolling, as a way of navigating a website, is fluid and easy.
Scrolling has become second nature. We scroll through our Facebook newsfeeds. Nearly everything we view on our smartphones requires scrolling, since content must be narrower and longer to fit on the screen. It seems only natural that long scrolling has found its way into everyday web design.
As you scroll down the No Right Brain Left Behind website, you’ll see how each pane is almost like a different page.
2) It lends to better storytelling.
When there aren’t other pages to click through to, it’s easy to keep your visitors focused. Many nonprofits have adopted single-page web design because the format allows them to tell a seamless story.
Visit the raTrust website to see how they tell the story of the rise of HIV.
3) It looks cool.
What if your website didn’t just inform visitors—what if it also delighted them?
A lot of single-page websites have a very cool effect called parallax scrolling. This gives websites a layered look when scrolling takes place. As a visitor scrolls down the page, images in the “foreground” move at a different speed than images in the “background.”
The Ford Foundation 2011 Annual Report is so stunning, it makes you want to visit again and again.
If you need more than a single page, consider Long-Scrolling design.
Single-page design isn't for everyone. But just because you need multiple pages doesn't mean you can't have cool, long-scrolling pages. Consider creating a hybrid that applies the long-scrolling design technique to one or more of your site's webpages.
Here at Accrinet, we designed a long-scrolling homepage to make it easy for visitors to get a quick introduction to who we are and what we do. After landing on our homepage, visitors can then dig deeper into the interior pages of our site for more content.
On the other side of things, the Partnership for a Better Energy Future’s website has a short homepage and long-scrolling interior pages.
For more examples of single-page design and long-scrolling pages, visit: