

Parallax techniques use well defined imagery, JQuery and CSS3 to create a truly unique browsing experience. Throw out your misconceptions that Flash and video are the only ways to achieve the third-dimension. Custom Web Design Trends: Parallax Scrolling One of the hottest new trends in web design is a technique called parallax scrolling, which is the latest addition to a growing list of effects used to create a sense of depth on a web page. If you've got a taste for cutting edge design, call me and we'll push those boundaries with your brand. In closing, I would love to work on one of these sites. Check out the running shoes in the second frame. It just oozes modern design and really drives home the Nike brand. The site doesn't do much with the background, but does a beautiful job moving imagery within the content - sliding, floating and fading.Įven heavy hitters like Nike are getting in on the fun. The website for upcoming Drupalcon Denver has been highly acclaimed for its parallax effects. The content on the page is a third layer and also moves at a different speed. The clouds layered over the ocean creates an visually interesting bird's eye view. So many web gurus have turned the technique on its side and created the parallax illusion vertically. By my estimation, they're still getting the hang of vertical scrolling and their brand-spanking-new browser, IE7. Typically, horizontal scrolling is frowned upon by user experience experts because the general population just isn't ready to scroll horizontally. Notice the illusion of depth created by the landscape layers. Use the scroll bar at the bottom of the page to move from left to right. Eric Johansson uses parallax scrolling in a horizontal manner. Let's start with an example similar to the anecdote I've laid out above. Then, as the user scrolls through the website, the layers move at different speeds, creating a perception of depth. The stripes on the road, the trees, the mountains and the sun all become a separate background image. So how does this translate to the web? Basically, we slice up the scene into layers. We perceive each of these elements moving at different speeds and this phenomenon contributes to our perception of depth. And the setting sun doesn't seem to moving at all, does it? Now, relative to your seat in the car, what do you perceive to be whipping by the fastest? The striped center line on the road, right? The trees on the side of the road aren't moving quite as fast, but they're faster than the mountains in the distance. You're in the back seat staring out the window, taking in the beautiful view. Picture this: You've taken the scenic route to Ma's house for Thanksgiving. One of the hottest new trends in web design is a technique called parallax scrolling, which is the latest addition to a growing list of effects used to create a sense of depth on a web page.
