Using target=”_blank” for links in an HTML page will generate errors when running code through the W3C validator. Well, if you are using the older Transitional document type it would not, but errors will for sure be reported for Strict document types. An easy and quick solution is to create a JavaScript handler for your links. This tutorials explains how to create an SEO-friendly (of course) W3С valid replacement for target=”_blank” by using only a few lines of jQuery code.
Here are two easy solutions to solve the task. In both solutions we will walk through each link in a page and apply our handlers to them so they will open in a new window. You should use the code below in your <head>…</head> tag, i.e.:
{code type=html}
<head>
…
<script type=”text/javascript”>
// Put the code here
</script>
</head>
{/code}
Or you may save it to a separate file and link it in the <head>…</head> tag, i.e.:
{code type=html}
<head>
…
<script type=”text/javascript” src=”path-to-js-file.js”></script>
</head>
{/code}
Solution 1
While the target attribute is depreciated by W3C Strict standards, it is available via the DOM object. For the first solution, you can apply target=”_blank” via JavaScript. It will open in a new window and still be W3C valid. Here is the code:
{code type=php}
$(document).ready(function(){
$(’A[rel="_blank"]‘).each(function(){
$(this).attr(’target’, ‘_blank’);
});
});
{/code}
Solution 2
While the first solution is to apply ‘_blank’ value to a native link’s attribute ‘target’ via JavaScript, the second solution is to handle the click on the link and open it in a new window. Please note that both alternative methods are absolutely SEO friendly and W3C valid. The code for the second solution is:
{code type=php}
$(document).ready(function(){
$(’A[rel="_blank"]‘).click(function(){
window.open($(this).attr(’href’));
return false;
});
});
{/code}
That’s it ;) Click the Demo button to see it in action.
Image may be NSFW.Clik here to view.
