IWD recently considered using a one page parallax website for one of our new websites; we were in love with the notion of guiding visitors through our narrative. After we excited our designers with the prospect of parallax , our eCommerce SEO experts were quick to observe some damaging impacts that would result if precautions aren't taken...I will preface this post by saying that it is possible to have a parallax website and focus on SEO; you just need to adjust your strategy.
Parallax WebsitesIf you haven’t heard of parallax websites, odds are you have been to a parallax website. Using parallax designs for websites is very popular these days for brands looking to convey their story or highlight their product in a fun, unique way. Basically, parallax websites boil down to a one page website that tells everything! As the user scrolls down the page, the deeper they journey into your brand. Here are some great examples of creative parallax websites:
Pretty cool eh? There is a reason they are wildly popular: designers and users love the simplicity and experience. So...should you jump on the bandwagon and go parallax? Before you answer the question, be sure to think about SEO and how this will impact your website.
How Parallax Impacts Your SEO
1. One Page DilemmaThe biggest issue when it comes to SEO and parallax is the fact that parallax converges your website to one page. As attractive as managing only one page may seem, this will drastically damage your organic ability to rank for numerous keywords. Take a look at Flower Beauty & Makeup’s (parallax site) organic keywords report vs. Mally Beauty & Cosmetics report:
Flower Beauty is only ranking for 137 keywords compared to Mally Beauty's 1,079 keywords...Why the major difference? Mally Beauty’s website isn't competing in the makeup industry with only one page...they have numerous pages that allows them to rank for a variety of keywords Flower Beauty can’t. It is simple math: more keywords = more traffic / lead opportunities. Here is what one-page Parallax websites do: take a website that has 12 pages and condense the website down to 1 page. Now, think of all of the content that has to be removed since you are merging 12 unique pages into 1 simple page: Hopefully now you can see the BIG issue with using / converting to a one-page parallax website.
2. URL StructureOne of the best SEO techniques is structuring your URLS to help search engines classify your website by deploying targeted keywords in your url. For instance, look at Candy Warehouses url: http://www.candywarehouse.com/occasions/valentines-day-candy/ The URL aligned perfectly with my “Valentines Day Candy” search on Google. With a one page parallax website, you can’t use your targeted keywords in the url. There was a clever short lived solution to not being able to have multiple urls ranking for various terms that used multiple anchor links (linking to another section on the same page) on the page. By doing so, you would have unique URLs on for your website. Example: Flower Beauty uses anchor links for their one page parallax design: http://flowerbeauty.com/lips/ http://flowerbeauty.com/eyes/ http://flowerbeauty.com/drew/ It is a clever solution that allows you to still use multiple URLs on your website and unique meta titles and descriptions, however, duplicate content would occur. When Google loads /lips it indexes all of the content on that page (which happens to be the entire website). So the content in /eyes is included in /lips indexation, thereby resulting in duplicate content. And we all know that Google shames websites with duplicate content.
3. H1 TitleSimilar to using targeted keywords in your URL structure, H1 titles are another important element to labeling your page for search engines. It is best practice to only use one H1 tag on a page so once again, you are pretty limited with one page parallax websites. When you visit Volusion’s Web Design page, you and the search bots instantly know that this page is for ‘Professional Web Design’ since it is classified as the H1 title. You can start to see how tricky it would be if you were targeting ‘Professional Web Design,’ ‘Professional Developer,’ ‘Professional eCommerce Templates,’ etc. and had sections on your page dedicated to them.
SEO + ParallaxNow that we have reviewed some of the major issues with SEO and parallax, the good news is it is possible to merge the two. Since you can get hit with duplicate content by deploying anchor links on the page, try using parallax only on your homepage or product feature page and have sub-pages. This would allow content on the homepage to direct users to additional pages that have their own PA, meta info, keywords, etc. in order to learn more about a particular service or feature. Spotify uses a parallax homepage design while still maintaining sub-pages full of content. How is it working out for them? Checkout the number of pages indexed by Google: 1,530,000 results! Now let’s compare this with a one page parallax site:
2 results…Case in point that a strong strategy for using parallax websites while maintaining SEO power is to utilize subpages. By using sub-pages, you can continue to attract a diversity of links and traffic to your website. Now, your sub-pages can use parallax designs as well if you want; the fact that you are adding additional pages to your website provides additional depth that one-page sites don't have. Another great solution is to incorporate a blog on your parallax site. Blogs have tremendous value when trying to attract visitors to your website or showcase industry knowledge and trust. If you are considering adding a blog to your website, be sure to optimize it appropriately and research keywords that you can deploy in your post. This will help promote your post online. Biamar does a good job using a parallax website while also having a blog to add valuable content pages to the website. Comment below if you have any advice to add for those trying to reconcile a parallax website with SEO on their minds!