Get google to index JavaScript pages as separate pages

Question

I have a product page with say 10 products, that loads up all the content when the page loads. Then JavaScript hides content till a product is selected. Then JavaScript hides and unhides information. It is this way rather than separate html pages for each item for design and updating purposes.

Google indexes the content fine, but instead of indexing 10 product pages it indexes the page as 1 page. Can I get Google to index each JavaScript section as a separate page?

I have made the links with #!, as I read that this would help, but it has not. Like this:

http://site.com/products.html#!PRODUCTA

Is this possible or I have to go back to separate html for each product?

Answer 1

AFAIK you can't. You can do some workarounds, as joesk answered, to fake it.

A solution would be if you load the products with AJAX, e.g. implement the AJAX crawling guidelines and provide "snapshots" of the individuel products.

Answer 2

Why not do both? So leave your existing setup as it and then make a nice clear architecture with the products listed on individual pages for Google to clearly understand. This could be highlighted in a HTML and/or XML sitemap. You can then make these pages the canonical version of the product pages to clarify which page should be deemed the "product" page.