What is your opinion in the use of jquery for a continuous scroll type of page layout?
-
So, I'm in 2 minds about this; let me start with a bit of background info.
Context
We have a new client who is in the final days of their new site design and were when they first contacted us. Their design essentially uses 5 pages, each with several pages worth of content on each, separated with the use of jquery. What this means is a user can click a menu item from a drop-down in the nav and be taken directly to that section of content like using internal anchor links as if it were a separate page, or they can click the top-level nav item and scroll through each "sub-page" without having to click other links.Vaguely similar to Google's "How Search Works" page if each sector of that page had it's own URL, only without the heavy design elements and slow load time.
In this process, scrolling down to each new "sub-page" changes the URL in the address bar and is treated as a new page as far as referencing the page, adding page titles, meta descriptions, backlinks etc. From my research this also means search engines don't see the entire page, they see each sub-page as their own separate item like a normal site.
My Reservations I'm worried about this for several reasons, the largest of them being that you're essentially presenting the user with something different to the search engines. The other big one being that I just don't know if search engines really can render this type of formatting correctly or if there's anything I need to look out for here.
Since they're so close to launching their new site, I don't have time to set up a test environment and I'm not going to gamble with a new corporate website but they're also going to be very resistant to the advice of "start the design over, it's too dangerous".
The Positives
For this client in particular, the design actually works very well. Each of these long pages is essentially about a different service they offer and the continuous scrolling through the "sub-pages" acts as almost a workflow through the process, covering each step in order.It also looks fantastic, loads quickly and has a very simple nav so the overall user experience is great. Since the majority of my focus in SEO is on UX, this is my confusion. Part of me thinks that obscuring the other content on these pages and only showing each individual "sub-page" to search engines is an obvious no-no, the other part of me feels that this kind of user experience and the reasonable prevalence of AJAX/Paralax etc means search engines should be more capable of understanding what's going on here.
Can anyone possibly shed some light on this with either some further reading or first-hand experience?
-
Hi Michael, thanks for the input.
I completely agree with you about content length but perhaps I'm a little confused here.
If search engines aren't going to see content hidden by jquery, would that not mean the only content I'm seen to have is what's immediately visible on page load?
-
Google is NOT going to see the content that's rendered by scrolling. In general, more is better in terms of content on a single page (provided it's not crap of course). See this article from Search Engine Land.
For those same reasons, having it on separate pages isn't as good an idea. If you think about how RankBrain is supposed to work, Google is going to be looking for terms on the page that commonly co-occur with the page's primary target search term on other pages on the web about that topic. So, by farming subsections of content out to other pages, you're shooting yourself in the foot, as Google is only going to give you brownie points for covering the subtopics in the very first page.
A better way to do this:
- put all the content on one page
- in the onload() or the Jquery document ready function, hide all but the first page's worth of content
- now, you can react to a scroll by calling Jscript functions to hide the currently shown content and show the next page's worth...all on the same URL
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
SEO Problem With My Pages ?
Hi everyone, I created a self-hosted custom PHP website the page is ( custom cosmetic boxes ), but it doesn't show up on Google. I tried to follow tutorials on the HubSpot, but even my site sucks. Please help me where I am wrong. Maybe the little thing is left unattended, which makes it void.
Web Design | | fbowable
Please help me.0 -
Too Many Links on One Page - What to Do?!
Hello Geniuses, Prodigies, and Experts of the Field, My website pages for www.1099pro.com have too many links on one page, something like 150-175, and I understand that each page should ideally be under 100. Most of these links, approx 105, come from dropdown navigation options in the header toolbar or the footer links. It is my take that these links make our site easier to navigate but I'm sure that they are hurting my pagerank / SERPs. Is there a best way to handle a situation like this? I'd really prefer not to alter the header/footer layout of the entire site by removing 50-75 navigational links. The only other idea I have is below but I have no idea if it would work. For any link that I do not care to pass pagerank, institute a "nofollow" parameter. This would be my favorite option if it is viable.
Web Design | | Stew2220 -
Should i not use hyphens in web page titles? Google Penalty for hyphens?
all the page titles in my site have hyphens between the words like this: http://texas.com/texas-plumbers.html I have seen tests where hyphenated domain names ranked lower than non hyphenated domain names. Does this mean my pages are being penalized for hyphens or is this only in the domain that it is penalized? If I create new pages should I not use hyphens in the page titles when there are two or more words in the title? If I changed all my page titles to eliminate the hyphens, I would lose all my rankings correct? My site is 12 years old and if I changed all these titles I'm guessing that each page would be thrown in the google sandbox for several months, is this true? Thanks mozzers!
Web Design | | Ron100 -
Is there a Joomla! Component For A Blog Page That Is Recommended?
A business partner currently has a page on a Joomla! website that is passing for the blog page. I am not a Joomla! guy so I dont' know much about it. I do know that I don't like a lot of things and prefer Drupal however making a change to Drupal on that site is not an option. We need to upgrade the blog page so that it is more like a blog and I know there has to be an SEO friendly component for a Joomla! blog page. Any ideas?
Web Design | | Atlanta-SMO1 -
Best Practices for home page design for ecommerce website
I know this question is not directly related to SEO, but I figured I have been getting some good help from this forum, so why not? The website is www.vrtack.com. I am looking to redesign the home page. It is an ecommerce website selling equestrian clothing and leather goods. My goals are: 1. Reduce the very high bounce rate and drop-off rate. 2. Fine tune the relevancy of the website towards a handful of keyword phrases. 3. Engage the visitor to create better click-through and to increase the average time spent on the page/site. 4. Page Loading time is of importance. It has to load quickly. I would love to hear some specific suggestions, examples, best practices.
Web Design | | amitramani0 -
Keywords in the page url for best SEO
Hello all, I am working in the keywors structure of a web and I have the following doubt: If I want to target these keywords: great food madrid and my website is: http://www.madridlive.com I do not know if I should keep either: OPTION 1: page url: www.madridlive.com/great-food-madrid or OPTION 2: page url www.madridlive.com/great-food I do not know if the search engines "understands" madrid in "madridlive", therefore I can avoid the "madrid" keyword, dicarding option 1 and going for option 2. Additionally I avoid duplication of the madrid keyword that can be seen as redundancy and also have a shorter page url. Thank you very much and sorry for such a question but I am new in this SEO field...just the excellent SEOMOZ's SEO Guide for beginners! Best regards, Antonio
Web Design | | aalcocer20030 -
I've set up my own site which is still fairly new but I'm a bit concerned that there is a bloackage SEO wise somewhere because when I try to crawl the site on SEOmoz it only crawls one page.
I'm really baffled and none of my research has shed much light on it. My url is www.emporiumofmanliness.co.uk I'd really appreciate any help! Thanks
Web Design | | JoshED0 -
How does using a CMS (i.e. Wordpress/Drupal) affect backlinks and SEO?
So I need to build a website with over 100 pages in it. Elements of the design will probably be moved around and or tested so I need to use a CMS. It's pretty much a review site so while the content will remain static I'd like to employ A/B testing to mess with conversion rates. Wordpress has a plugin for that even. So I'm just wondering, since CMS pages are pretty much created on spot and not retrieved from a library, how this affects backlinks and anchor text? How exactly does the external website point to yours if the URL is dynamically generated? Or am I misunderstanding something? Please recommend any extra resources as well if you can.
Web Design | | seochump0