How should implement Hashbang (AJAX) in content page tabs?

Question

As some of you may know, Google is now crawling AJAX. The implementation is by far something elegant, but at least it still applies to Yahoo and Bing AFAIK.

Context: My site is driven by Wordpress & HTML5. An Custom Post Type has tree types of content, and the contents of these are driven by AJAX. The solution I came for not using hashbangs (#!) until fully understand how to implement them is rather "risqué". Every link as HREF linking to *site.com/article-one/?tab=first_tab*, that shows only the contents of the selected tab (<div>Content...</div>). Like this:

<a href="http://site.com/article-one/?tab=first_tab" data-tab="first_tab">This First Tab</a>

As you may note, data-tab is the value that JavaScript sends with AJAX Get, that gets the related content and renders inside a container. At the other side, the server gets the variable and does a <?php get_template_part('tab-first-tab'); ?> to deliver the content.

About the risqué, well, I can see that Google and other search engines will fetch *http://site.com/article-one/?tab=first_tab* instead of http://site.com/article-one/, making users come to that URL instead of showing the home page with the tab content selected automatically.

The problem now is the implementation to avoid that.

Hashbang: From what I learned, I should do this.

1. HREF should become site.com/article-one/#!first-tab
2. JS should extract the "first-tab" of the href and pass it out to $_GET (just for the sake of not using "data-tab").
3. JS should change the URL to site.com/article-one/#!first-tab
4. JS should detect if the URL has #!first-tab, and show the selected tab instead of the default one.

Now, for the server-side implementation, here is where I'm kind lost in the woods.

1. How Wordpress will handle site.com/article-one/?_escaped_fragment_=first-tab?
2. Do I have to change something in .htaccess?
3. What should have the HTML snapshot? My guess is all the site, but with the requested tab showing, instead of showing only the content.

I think that I can separate what Wordpress will handle when it detects the _escaped_fragment_. If is requested, like by Google, it will show all the content plus the selected content, and if not, it's because AJAX is requesting it and will show only the content. That should be right?

Answer 1

I'm gonna talk third person.

Since this has no responses, I have a good one why you should not do this. Yes, the same reason why Twitter banged them:

http://danwebb.net/2011/5/28/it-is-about-the-hashbangs

Instead of doing hashbangs, you should make normal URIs. For example, an article with summary tab on should be "site.com/article/summary", and if it is the default one that pops out (or is it already requested) it also should change to that URI using pushState().

If the user selects the tab "exercises", the URL should change to "site.com/article/exercises" using pushState() while the site loads the content throught AJAX, and while you still maintain the original href to "site.com/article/exercises". Without JavaScript the user should still see the content - not only the content, the whole page with the tab selected.

For that to work, some editing to the .htaccess to handle the /[tab] in the URL should be done.