Hyperlinks are one of the most powerful elements within a website. Improperly using hyperlinks can actually cause issue with Google’s search spider.
To remedy issues with links especially when linking to content, javascript can be your new best friend. Over the weekend I noticed one of the pages I build out was incorrectly referencing DIV’s so to combat the issue I quickly looked around the internet and pieced together a solution. Below is a function that uses jQuery / Javascript function which allows you to link to ID referenced elements from an anchor:
function goTo(id){
$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}
When calling this from an anchor the code would look somewhat like:
<a onclick="goTo('main-content);" href="javascript:void(0)">link text</a>
As you can see inside the onclick I am calling my Javascript function “goto” with the particular ID that im referencing. People typically use “#” for their HREF but Google’s spider will crawl that and cause a crawl error so its best to reference a Javascript void instead.
I currently do not have an example however in the next few day’s im working on a example area which will house all my scripts. Once that area is live I will update this post and incorperate it here, however the example script above is complete enough to allow this script to run completely.