If you haven’t yet come across it, take a moment to check out Google’s mesmerizing, informative new “How Search Works” infographic. Since the success of your business’s Web presence depends heavily on its ability to play nicely with Google’s algorithms, you’ll want to review the core concepts of its search functions anyway.
You might also draw inspiration from the medium that Google uses to convey the simple concepts at the core of “How Search Works.” Unlike many of the infographics that you’ve come across in your web travels, “How Search Works” leverages “parallax scrolling” to engage and inform its viewers.
Parallax scrolling has several key implications for web marketers. Crucially, it eliminates the clutter-versus-cohesion conundrum that once vexed anyone who designed and operated a content-driven website. In the past, webmasters who used infographics to tell stories or provide information had two basic choices:
They could include all of their information on a single, cluttered page that required endless amounts of scrolling to view; or force their viewers to click through multiple screens to advance the story.
Both of these arrangements risked alienating and / or boring viewers.
These days, you might prefer to sidestep the choice between a cluttered single-page infographic and a jumpy multi-page by using animations or even GIFs to tell your story. However, these media have plenty of drawbacks of their own. Window animations can have inadequate contrast on small screens and may have little room left over for explanatory text to be interjected. Full-screen animations can chew up bandwidth, be slow loading and often appear grainy due to inadequate resolution.
Both kinds of animation take a significant amount of time to design and polish. They also require greater bandwidth and may not translate effectively to mobile interfaces. Meanwhile, GIFs have limited functionality as informational tools and may annoy viewers who can’t shut them off. Although some designers choose to convey information by using text to break up long series of GIFs, such a layout may sacrifice cohesion.
Parallax scrolling eliminates virtually all of these concerns. If you’re old enough to remember the early days of console-based video games, you probably have fond memories of navigating Donkey Kong or little Mario through a dangerous, swiftly-moving foreground that was imposed on a tranquil, slow-moving and inaccessible background.
If so, you intuitively grasp the basic concept of parallax scrolling. Even if you didn’t devote large chunks of your childhood to exploring Super Mario World (I didn’t), parallax scrolling is easy to understand. It imposes fast-moving, dynamic images against slow-moving, static or patterned background images to create an illusion of three-dimensional depth on a two-dimensional surface. In other words, parallax scrolling is that depth-creating trick that’s familiar to anyone who played video games before the advent of high-powered gaming consoles. In modern applications, parallax scrolling can be projected on a horizontal or vertical axis.
“How Search Works” uses parallax scrolling to reveal its message one easy-to-understand segment at a time. Since the story unfolds organically as the user scrolls down the page, it’s immune to clutter and won’t overwhelm by developing too quickly. Users can “pause” the story at any time by ceasing to scroll down the page, and it’s always possible to backtrack in order to review a missed element. Without multiple screens or links to interrupt the story’s flow, “How Search Works” engages its viewers without belittling or confusing them.
It’s a great hook: Once you start watching “How Search Works,” it’s tough to tear yourself away. Wouldn’t it be nice if every visitor to your site felt the same way about your organization’s story?
Countless marketing firms now use parallax scrolling to craft engaging, informative infographics that grab their viewers’ attention, increase average visit times, and promote purchases and subscriptions. Many use parallax scrolling as a basic component of their sites’ designs. Some require their visitors to engage with a parallax scrolling interface in order to reveal important new aspects of their online presence.
The potential uses for parallax scrolling are nearly endless. You could use it to reveal information about your brand or organization in an engaging manner. You might offer a coupon or deal to customers who scroll through a series of simple tasks or brain teasers. You might even include parallax scrolling as a key component of a gamification scheme that introduces your product or service to a host of new customers.
While parallax scrolling isn’t cheap to implement and has the potential to frustrate Web design novices, it might be too powerful for your business to ignore for much longer. If you’re looking to spice up your online presence and engage your target audience, you can’t afford not to understand this concept.
