My customer hired a SEO company to evaluate their site.
The major complaint was the amount of link combinations on the category pages. The spiders are creating thousands of links from one category page because of the Sort by, # per page, Grid, Compact list, etc. options the customer has to layout the category page. She said all these links created by the cart and seen by the spiders (that are really the same page) are hurting the ranking.
She asked me to change all the Sort By, # per page, View by Grid, View by List, etc links from <a href links to use jquery links to hide them from the spiders.
Does this make sense?
Has anyone done this?
By the way I have Disallow: /*? in the robots.txt file and I thought this told spiders to ignore links with a ? in it. But she showed me that the spiders still will index these links, they just won’t add them to the rankings because of the robots.txt exception. But since they are still spidered they hurt against the duplicate page and content. She said to use jquery links to hide all these links from the search engines.
See below:
<br />
Reducing the number of anchor links per page for bots and spiders without fundamentally altering the user experience or the presence of these links is rather straightforward with a little jQuery magic.<br />
Essentially, what you're doing is changing <a> links in the page source to some other element such as <span>'s, then using jQuery to rewrite them back to <a> links after the page has loaded (the document.ready event in jQuery).<br />
Consider the following typical static navigation using an unordered list:<br />
<ul id="navigation"><br />
<li><a href="/hats/">Hats</a></li><br />
<li><a href="/scarves/">Scarves</a></li><br />
<li><a href="/boots/">Boots</a><br />
<ul><br />
<li><a href="/boots/work/">Work Boots</a></li><br />
<li><a href="/boots/fashion/">Fashion Boots</a></li><br />
</ul><br />
</li><br />
</ul><br />
In this particular case, we're interested in 'hiding' the subcategory links for Boots, but want to leave the top level category links (Hats, Scarves, Boots) as native <a> anchor tags to facilitate indexing by bots.<br />
The solution has two parts:<br />
change the <a> tags of the subcategory items to <span> tags, moving the href attribute to another attribute such as 'rel'<br />
use jQuery to change the spans back to anchors once the page loads<br />
Part 1: Change anchors to spans<br />
<ul id="navigation"><br />
<li><a href="/hats/">Hats</a></li><br />
<li><a href="/scarves/">Scarves</a></li><br />
<li><a href="/boots/">Boots</a><br />
<ul><br />
<li><span rel="/boots/work/">Work Boots</span></li><br />
<li><span rel="/boots/fashion/">Fashion Boots</span></li><br />
</ul><br />
</li><br />
</ul><br />
Part 2: Add jQuery method to handle the rewrite (can be in the head of the document or just before the closing body tag)<br />
<script type="text/javascript"><br />
$(function() {<br />
$("span","ul#navigation").each(function() {<br />
$(this).replaceWith('<a href="' + $(this).attr("rel") + '">' + $(this).html() + '</a>');<br />
});<br />
});<br />
</script><br />
The function above will fire only once the document has loaded (i.e., the document.ready event as specified by the $(function(){ }) syntax), and will rewrite all target spans within the #navigation ul parent element back to anchors by using the rel="" attribute's value as the value for the final href="" attribute.<br />
The net effect of all of this is that you are explicitly presenting only specific links to bots as 'true' anchor tags, with the rest appearing to bots simply as span tags (or whichever element you choose). This will reduce link bloat, from a search engine spider standpoint, and increase (slightly) the amount of 'text' on the page by virtue of the presence of the new span tags.<br />
Note: one gotcha is that for a brief moment while the page is loading and prior to the span-to-anchor Javascript function firing your pseudo-link span tags will be just that, <span>'s; in order to avoid UFOC (unstyled flash of content) issues, you will most likely want to style these types of spans in an identical manner to how the <a> tags they are meant to replace; normally this should mean nothing more than appending the span declaration to the style. For example:<br />
ul#navigation a { display: block; color: #fff; text-decoration: none; }<br />
would become:<br />
ul#navigation a, ul#navigation span { display: block; color: #fff; text-decoration: none; }<br />
etc.<br />
You may target the spans to be rewritten in any way jQuery allows, including by class, so if you have pseudo-links spread out across multiple areas on a page, you may find it more convenient to target <span class="magic" rel="/some/url.html">Link</span> than by parent element. Your mileage will vary of course depending on the complexity and size of the page, and some methods of targeting DOM elements are more efficient than others. For more details, consult the jQuery documentation.<br />
```<br />
<br />
Any help or advise would be appreciated.<br />
David