I’ve been checking out how big and smallish brands are using their websites to engage with visitors. Parallax website design keeps popping up on almost every third website I’ve visited. It looks like this trendy design technique could be the new black in website design and is probably here to stay for a while, until the next big design style emerges. Parallax website design is quite attractive and can without a doubt be used in clever ways to tell stories and increase engagement.
Warning: the links in this post are best viewed from a laptop or desktop computer. You’ll find out why from my review below.
What is parallax website design?
Parallax website design or parallax scrolling is a newish website design technology which makes it possible to give the different layers of a website an illusion of depth as you scroll through. It’s usually a long one-page site that keeps scrolling and scrolling… like a roll of paper towel.
The background moves at a different speed to the rest of the page. The depth is made to look a bit like watching a 3D movie, while the scrolling gives the effect of slowing down time. You know, like in The Matrix (not a fan but thought you might relate!).
Parallax originates from the Greek word παράλλαξις (parallaxis), meaning alteration. According to the Merriam-Webster encyclopaedia, it’s “the apparent displacement or the difference in apparent direction of an object as seen from two different points not on a straight line with the object.”
Brands are using lots of full-sized images and pages with attention-grabbing content that draw visitors into, up, down and across their sites. In some cases, and perhaps only with bigger brands with more cash to play with, you can even interact with the products or watch as they twist and turn to give you a 3D look of the products from various angles. Surprises jump out at you, words zoom off and colours of objects could change upon you clicking, rolling or dragging the mouse. They’re all different, unique and you’d get the impression that each big brand is trying to outdo the other (I didn’t type that!).
Check out Bagigia (also seen below), for an example, but to be able to view the parallax effect you need to view from a laptop or desktop computer. I’ve listed a few others further below. With Bagigia, the bag twists and turns to give you a view of the product as if you were holding it in your hand to inspect it.
What parallax scrolling makes visitors do
Parallax scrolling gives a more dynamic and rewarding experience to visitors and puts some interactivity so that we’re not just clicking through static and possibly ‘boring’ pages. It’s usually something new for the visitor, which means if you’ve never seen this before you’ll definitely be ‘wowed’.
Although I’m sure visitors are interacting with each site upon first visit to play with and check out what the objects do and how they can use their mouse to manipulate the site, I’m curious to see what the true marketing objectives are behind these clever designs. I know that whenever I’ve visited one of those parallax sites I’ve scrolled through a few of the products but only to check them out and toy around for a few seconds, rarely minutes.
I originally went to one website because someone mentioned the products. I didn’t expect the design there but thought it was pretty spiffy and innovative. I made a purchase, not because of the design but because I had already decided on my purchase before my visit. I didn’t visit the other sites to make a purchase but to see how their use of parallax scrolling differ. Seeing the design didn’t convince me to interact beyond the first few pages or to make a purchase. They were not selling anything that I was interested in. So, I was not converted from looker to buyer.
But, having said that, I’m giving a big YES for entertainment… Yes, ENTERTAINMENT and a way to up the number of minutes a visitor spends on your site, aka reducing bounce rate. It is great as a clever way of giving visitors better value while browsing. I definitely saw it as something to share on social media and something to talk about with my web design mates and bloggers at networking events.
I like this one by Nintendo, which is in my list further down, because I really, really got something out of the experience, even if I had a go at it just for fun, not shopping.
The downside to using parallax scrolling
From my experience, although a powerful design that presents eye-popping websites to pique your interest while browsing, just like with any new website tool, many mobile devices struggle to display them correctly. Thank God for mobile versions of sites, although your visitors can’t enjoy the same design on their devices. For example, the Bagigia site looks different on the iPad, see below. This is the same page you saw earlier for the same bag, but this is now its mobile version which no longer shows the cool effects.
A static page with a few animating menu options. No twirling, spinning or unzipping animated bag. So if you only ever visit the site via a mobile device you wouldn’t know they spent extra building the parallax desktop site. But, I guess if you’re visiting a site you should be there based on your interest in the product, not to play.
This other site that I won’t mention displayed a “Thank you for visiting on mobile”, with an image and that was that. Not even a link to the menu, not even a message to say best viewed on blah blah. Just a dead end version of their site which looks as if it’s under construction. What in the name of design is that? I’m not sure.
The bottom line (and some examples)
I’ve been told that older computer screens tend to have difficulties displaying the websites. It makes me wonder, then, whether the sites were tested on various devices. Perhaps those who use parallax designs don’t see it as an issue. But why ignore mobile users when we know that mobile is very likely the vehicle of the future that will bring visitors to our sites? In Australia already, according to the latest Nielsen report 33% homes have at least one tablet, and 65% Australians aged 16 and above have a smartphone, with the numbers growing daily. Even some students that I know aged as young as 10-13 years have mobile phones.
My only hope is that soon someone, somewhere, comes up with the solution but please don’t be abusing the parallax website design technique like many did back in the day when Flash was the new black! It got so annoying!
So, here are some of my favourite finds. Let me know which one you like the most. I’ve listed them in no particular order of preference.
Let’s hope they’re still sporting the parallax effect at the time of your viewing! Don’t forget to try from a desktop computer or laptop.
- For Impatient Web Users, an Eye Blink Is Just Too Long to Wait
- What is Parallax? According to Merriam-Webster
First image © iStock.com/RichLegg | Others are screengrabs