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
-
We added hundreds of pages to our website & restructured the layout to include 3 additional locations within the sub-pages, same brand/domain name. How long could Google take to crawl/index the new pages and rank the keywords used within those pages?
We added hundreds of pages to our website & restructured the layout to include 3 additional locations within the sub-pages, same brand/domain name. The 3 locations old domains were redirected to their sites within our main brand domain. How long could Google take to crawl/index the new pages and rank the keywords used within those pages? And possibly increase our domain authority hopefully? We didn't want our brand spread out over multiple websites/domains on the internet. This also allowed for more content to be written on pages, per each of our locations service's, as well.
Web Design | | BurgSimpson0 -
Does anyone have data on the effect of multiple H1 tags on a page?
One of my website's sub-domains is fed information from a job board master-template, thus my site (and hundreds of other sites) is just branded styling pulling from one external source. Because of the way this master template is set up (not very concerned with SEO best practices), I have found the need to hide the H1 coming from the master template, and display a new separate H1 in my styling. This is being done with user-experience in mind, but how will search engines respond to having two H1s (one hidden, one visible) on a page? I understand that a single H1 is usually ideal, and hidden page components are typically frowned upon because they don't add user value... but in this case, the hidden component is solely for the benefit of the user. I would like to find the best balance of SEO and UX, so I am very interested in any experimental data or case studies on a similar situation.
Web Design | | pbailey0 -
Content Migration & cost of moving pages
Hope you are all having a great day! I am wondering if anyone would be able to provide general feedback. I work for a medium size company in Chicago. Currently our site is static html and we are seeking to migrate to Wordpress. After speaking with a number of website companies and receiving proposals, I am trying to understand if there is an approximate going rate or range for moving content from static html to a CMS like Wordpress? i.e. a cost per page? We don't have any dynamic content. Most of our pages are text and images. The site itself, including the blog is around 220 pages. Thanks in advance for any insight or resources!
Web Design | | SEOSponge0 -
Nofollow links to resources used to save bandwidth?
I have a site on volusion, www.ecowindchimes.com. Until recently I was doing fairly well (top 3 for keyword(s) for 6 years) in serps. I was hit by the an update around july of last year, and did a full page redesign in november. My site has been losing ranking for its main keyword "wind chimes".
Web Design | | sbetzen
One change I noticed is that no-follow was removed (when the designers added a lightbox popup for the sound) from the many many links I have for my sound files of the wind chimes (I house them on a separate server to save bandwidth, which is expensive at volusion). The webaddress the sound-files are on doesn't even have a page... it is just there for the files. (there are ~100 files linked to on almost every page of the site where a product listing shows). Should I go through and no-follow all of these links again? Is that hurting me?
I suspect it is, but it is a lot of work for nothing if that is not the problem.0 -
Home page redirect - will this cause an SEO problem
Hello, We are using Wordpress to build a wiki site. The wiki plugin we're using (Wordpress Wiki lite) can only be set up on an internal page like nlpwiki(dot)org/wiki Can we redirect the home page to the /wiki subdirectory and use nlpwiki(dot)org/wiki as our home page? I've never done that, just wondering if it will be indexed as the home page or if there are any connonical issues. Thanks!
Web Design | | BobGW0 -
Content position on page
I am in a limo service industry where people are not looking for great content or product description, all they want is a nice Lincoln Town car and a competitive price. Because I need to get more pictures in front of my customers rather than more content I am not sure if by not having the content high up in the page will affect my rankings. We are transitioning to a new template where we have more control over the layout of the website but because of the slider that we have on the homepage the content needs to go further down. We could insert some content in each of the slides but the page would start looking too "busy". We want the customers to see very clearly what we offer. They see the picture, click for more info and book the service. How important still is to have your keywords in the first hundred words on a certain webpage? Can we get away with having the content read by search engines after 3 - 4 slides and their description (about 20 words total) ?
Web Design | | echo10 -
How WP Themes work with Navigation Structure for SEO and JQuery Headers?
I am trying to find the best WP Theme for our company. I noticed most of them do not offer a left hand side navigation on the home pages, and usually are on the right side on the inside pages. I always thought that Home Page links were very important for SEO. Currenly we have a left drop down navigation with all of our product catagories, keyword optimized. The structure follows for all the pages. Is this not as important to Search Engines anymore? Is it better to have a products link, to all the products and then the inside pages, have just a navigation bar, for that particular catagory? This seems to be very common on all the templates i am seeing. I also noticed, and really like the JQueary Tabs. I would use this for displaying, PDFs and Specifications Charts. Also, some home page images are using a jquery slider with some text, linking to a page. Is Jquery the new javascript and do search engines see what is in the code? I also noticed they all have footers that have links and some other information. Is this a SEO must have?
Web Design | | hfranz0 -
Which CMS Should Use?
I have a desinger working on a new webiste and he's suggesting that WP creates design limitations (He's doing quite a bit of HTML 5 I believe...I'm not sure) and obviosly has secruity concerns. He suggested TextPattern, which I've never heard of. Has anyone had any experience with it? Also, what CMS are you using (besides WP) that you really like and is SEO friendly? Thanks
Web Design | | LuminConsutling0