A recent web trend in the space of online story telling is ‘parallax scrolling’ – the art of animated additional assets on a long form page of text (that’s my definition, here’s Wikipedia’s. It’s a very cool and more immersive way of rendering the story and associated assets for the reader whilst enjoying an in depth story or article. To me it feels like the next step on from the hyperlink – it allows the assets previously linked to to be embedded in a way that is not only less disruptive but more creative, presenting a richer experience.
The originator was this, still gorgeous read – Snow Fall – in the New York times.
There are plenty of examples of great parallax scrolling story telling, and even an a Google Doc with a definitive list of all sites created this way to help you get your creative juices flowing (link – opens in Google Drive).
However, in some cases, the implementation of parallax scrolling can cause SEO issues unless SEO is considered early enough in the build phase.
Such is an SEO’s lot that often clients come knocking on the door with their brand new shiny website an want it to work with SEO after the fact and this seems to have been the root of many issues and confusion around whether parallax scrolling is a step back for visibility.
Let’s take a look at the fundamentals of how to request a funky new website with parallax scrolling without jeopardising your hard fought SEO rankings.
The first thing to bear in mind that one page isn’t a great way to structure any online content as the search engines will struggle for relevance when the entire topic is stretched over one page. That’s why there’s oft been published an optimum number of words, and if you want to get really geeky an optimum keyword density for the 2 or 3 primary search terms for each page (please don’t get hung up on this!).
So structuring your content over separate URLs is key.
The second thing to bear in mind is that duplicating your content is also a no-no for SEO. So one long page with all your content on and then other pages with the same content on but chunked down is also less preferable.
So telling the search engines which piece of content to view is key.
So what so you need to tell your developers? Simple: use a coding language like php to reference one unique file of text content and render it either as a local anchor in the full text story page for the reader, or as a single file for a search engine.
In this way when a user visits they will be taken to the right part of the article/story for their query, and a search engine will be served the usual, relevant content to rank you accordingly.
There’ plenty of other reference sites to visit on the subject below, but if you have any specific questions do drop us a line or ask a comment below. Good luck, but before you go here’s the great parallax Life of Pi site: http://journey.lifeofpimovie.com/
Very useful SEO implementation guide on Awwwards
Search Engine Land sounding off on the perils
Spanish proof of concept tutorial
Barry Schwartz of Search Engine Round Table
The obligatory Mat Cutts video on the matter (please read between the lines!)