Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Andy Taucher
Andy Taucher
33 Points

How to implement good SEO/Indexing on one page scrolling site?

What's the best practice when it comes to optimizing a one page site that has only a few section on it. For instance 5 "pages" or sections that would each have their own URL, title and description that triggers on scrolling to that section on the page. I've looked at infinite scroll with pushState, waypoints with history.js, the list goes on. There just isn't any working examples or tutorials out there that I could find.

3 Answers

James Barnett
James Barnett
39,199 Points

What is your goal? When people talk about SEO on one-page sites, they are typically referring to on-page SEO techniques to help their ranking with specific keywords.

If you are only interested in ranking for just a few keywords then it could work.

You'll need to pay attention to:

  • crawlable: make sure Google can crawl the page with CSS & JavaScript off
  • load time: load JavaScript after content and lazy loading images
  • HTML structure: seperate using section each section gets it's own h1
  • urls: each section gets it's own url technically it's an anchor link
  • navigation: make sure history works between urls

further reading http://searchengineland.com/single-page-websites-seo-182506

Ken Alger
STAFF
Ken Alger
Treehouse Teacher

Andy;

Great topic. There is some helpful information out there, but single-page SEO does make for more of a challenge.

Discussion links:

SEO Tricks for One Page Sites

Strategies for JavaScript/AJAX heavy Sites

Backbone.js's Tutorial

Google's Matt Cutts had this to say on the topic:

It’s going to depend on what your particular area is, what the topic is, and what kind of layout you come out with. But if it works for you and for users to have that all on one page, for the most part, it should work for Google as well.

Hope it helps and welcome to Treehouse.

Ken

Andy Taucher
Andy Taucher
33 Points

Thanks for the resources guys. The best way I've seen this feature used is here http://flowerbeauty.com/ All of the tips and tricks that all the articles state are great, but none of them have a downloadable example to dig into. I'm not the best with javascript so building something like that from scratch based of of their suggestions is pretty tough. I'll keep trying though.

My main reason for it, is a client has a scrolling one page of all their services. They want to keep the page as is, but just implement seo for each section. Their page can be seen here http://www.candlewoodpartners.com/what-we-do/ as you scroll you can see the different service sections we want to apply this practice to.

Thanks again.