The Pitfalls of Parallax Web Design

*Mobile users, please note:
Your regularly 
scheduled blog post will appear beneath this extremely long parallax web page image …             

User Experience Parallax Website DesignAnother somewhat popular web design format is parallax design. And although the name may not be overly familiar to you, I’m betting you’ve experienced this type of site, at least a few times.

A parallax website is a site that is often referred to as a “scrolling website.” They’re typically comprised of a single page, or just a handful of pages, with the homepage containing a TON of information.

On these scrolling websites, what happens is you start scrolling down for more info, and down, and down, through what appears to be a never-ending scroll. And as you scroll, there are layers of imagery and text on the page moving at different “speeds” to create visual interest, tell a story, create depth effect, etc.

This is often a lot of fun for a designer to build, as it provides opportunity to be really creative. But it’s bad for UX because it’s really hard for the visitor to easily locate the exact information they need. In addition, parallax sites make it hard to know which end is up. In fact, all of those moving parts may cause you to feel nausea (not kidding).

It’s almost like parachuting out of an airplane, but you’ve got to keep your eyes closed the whole time — so you never know where the ground is.

This can be very unsettling for the viewer who’s looking for “solid footing” as soon as they arrive on your site. What I mean by this is that website visitors, mostly unconsciously, have a need to understand the lay of the land when they arrive on a website. They want to feel grounded, and be able to quickly understand where they are without having to think about it.

Since we use the internet every day, it’s easy to forget that it’s a virtual platform made up of pixels that we view. To assure a good UX, we’ve got to provide visitors with this sense of solid footing by implementing all of the user experience strategies we’ve talked about thus far. They need to know “this end is up, and this end is down.” Solid footing, on solid virtual ground. We don’t want them feeling like they’re free-falling or off balance — which is exactly what often happens with parallax sites.

If you’re on a desktop computer, you see an example of a parallax site on your right. If you’re on a mobile device, you probably saw the image at the top of the blog post (and wondered what the heck was going on).

The website in this example goes on, and on for nine whopping on-screen “pages” (on a 13” Mac). Yellow lines represent scroll points, meaning you wouldn’t be able to see what’s below the yellow line without scrolling.

One final note about Parallax web Design…

… is that like anything else, there’s no hard, fast “best practice” for every circumstance. I’ve seen some parallax sites for artists (showing one piece of art per “page”), and musicians (showing one album and/or music video per “page”) that work really well. But for most businesses and organizations, there are far better choices that provide a remarkably better user experience.

Thank you for visiting the Cuppa SEO blog!

Tagged with: , ,
Posted in How To, User Experience (UX), Web Design
Subscribe to Our Blog

Enter your email address to subscribe to this blog and receive notifications of new posts by email.