You’ve probably noticed something new in web design in recent years: sites that animate themselves as you scroll. (If you haven’t, here are a few examples.) This is known as parallax scrolling, and the technique has become a must-have for many websites — especially for digital and design companies looking to make an instant impression.
Thel Brink, creative director of South African branding agency Just Design, says that’s exactly why Just went with parallax scrolling for its website. The goal? “To do something that’s at the forefront of design for the digital world,” says Brink. “We wanted something progressive, new, and modern.” So she turned to Just Design’s sister (digital) agency, Milk Is Good, to create a site that was just that. Given how well it turned out, we decided to chat with Brink and one of the people behind the design, creative director Marc Ewing. The two offered up a handful of great tips about the benefits of parallax scrolling, its challenges, and branding possibilities that any web designer can use.
Always Aim to Create a Better Site Experience
Brink didn’t want parallax scrolling solely for branding purposes. She felt it was important because it also provides two key elements: engagement and interactivity. Ewing agrees. “Parallax creates this depth. When you’re looking at the screen, it feels like you’re diving into the world,” he says. Which, incidentally, is the concept that anchors the Just Design website — a design that evokes the stars and rotating planets; parallax made that possible.
Don’t Put Parallax Before Content
Parallax scrolling offers a lot of rewards, but can come with risks too. Chief among them: getting carried away with it. “The more you use it, the busier the page becomes,” Ewing explains. That can especially become a problem for sites that have content to highlight. “If you’ve got a lot of content to put forward to the viewer, then it’s probably not a good idea to use too much parallax, because you might lose the focal point — which is the content and the written word.” In other words: parallax should serve a site’s content needs first, not smother them.
Use Parallax to Tell Your Brand’s Story
Just Design’s website successfully illustrates that parallax is a great way to tell a brand’s story. “If you want to take a visual approach, it’s definitely the right way to do it,” says Ewing. Brink also feels strongly that it can immerse the reader in ways that other sites don’t. “I think a lot of times, you go to websites and you don’t necessarily read all the stuff that you need to read,” she says. “Parallax provides a nice intro where the story becomes visual with words.”
Try to Use Scalable Vector Graphics — Not PNGs or JPEGs
Just’s website uses a minimalist style with simple illustrations for a reason: the chance to use vectors that wouldn’t bog down the site’s loading time. “If I had to think about using PNGs or JPEGs, the site would have been quite heavy,” says Ewing. “It wouldn’t have loaded very well and would be a bit sticky in places. It would actually hang on your processor quite heavily and hinder the performance of your site. I find that the minimalist approach is sometimes quite a good option.”
Never Sacrifice User Experience
Because parallax is so exciting and flashy (no flash-animation pun intended), it can be tempting for designers to get carried away with making really cool sites. But a site should also do what it’s supposed to: provide a good user experience. “You can design a really beautiful looking page that can be moving in amazing ways, but if the user experience and interface design don’t allow you to navigate through the site, you may as well stop right there,” says Ewing. “User experience and visual aesthetics have to play toward each other.”
Use Parallax as a Branding Opportunity
First impressions matter. Especially for websites. As Brink puts it: “If you’re going to be on the internet, you’ve got to try and stay current. Your message has got to be clear: ‘We mean business.'” If you’re a design agency like Just Design or Milk Is Good, this means a modern, well-designed site is imperative.
“It says a lot about your company and how you feel about design,” Brink adds. “It’s important for companies to showcase themselves in those ways, because if you don’t have a great website, people might stumble across you and think, ‘But these guys don’t even focus on how they look!'” That’s not a first impression you can afford.
Prepare for the Future of Web Design — Whatever It May Be.
“Parallax is not that new, but over the last three years, it’s gained a lot of popularity. It will be interesting to see where people take it in the next few years. Does it stick around? Does it change slightly? Will there be new technology?” Ewing does have his own theories about movement in web design.
“The online space is becoming a lot more dynamic, and it’s quite rich with a lot of animation elements. It might go from parallax to WebGL (which is kind of like 3D graphics, where you’re physically moving through this 3D world). I think we’re moving toward an online space where we’ll see a lot more movement.” The result will hopefully be something parallax scrolling has already helped achieve: better websites. “The more powerful our computers become, and the faster the internet becomes, it just allows us to create way more rich content for the web.”
Do you have any favorite sites that use parallax elements? What do you think the future holds in store for web design? Let us know in the comments!