Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Create a W3C validated anchor link with target="_blank"

Tags:

css

xhtml

target

I have the following piece of HTML that creates a new window when clicked:

<a href="/path/to/site" target="_blank">glide by the people</a>

Problem is that it does not pass the W3C validator. How do I create a link like the above that does validate?

like image 513
Chris Avatar asked Mar 10 '10 21:03

Chris


4 Answers

Use this doctype:

<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhmtl1/DTD/xhmtl1-transitional.dtd"> 

1.0 transitional accommodates some html "legacy" code, including target="_blank".

like image 197
ghoppe Avatar answered Oct 31 '22 09:10

ghoppe


Assuming strict XHTML, you would bind an onclick event to the anchor in question. Something like:

<a href="/path/to/my/link" onclick="window.open('/path/to/my/link');return false;">My link</a>

One would also argue that you should be binding that onclick action separately with external JavaScript due to progressive enhancement and separating behavior from your markup, but that's the basic way to go about it.

like image 37
ajm Avatar answered Oct 31 '22 09:10

ajm


  1. Validation isn't the be all and end all of coding quality.

  2. Some things are "standard" in browsers without being a w3c standard.

  3. Using a bit of JS is a little overkill when the function already exists.

like image 39
Rich Bradshaw Avatar answered Oct 31 '22 08:10

Rich Bradshaw


I think you're asking the wrong question. The target attribute is not valid in strict XHTML 1.0 no matter whether you insert it with JavaScript or just have it in the server response.

If you really want that attribute, you have to use a different doctype, but that's not really the right answer either.

You should ask yourself why you want the attribute. I'm guessing you're trying to create a new tab or window. Needless to say this is generally considered bad design (it takes control away from the user), but if you really want to do it, you could do it with JavaScript.

Here's how:

Keep your links but add a special class, e.g. "popup" to them. Then add a line of JavaScript (preferably using a framework like jQuery or Prototype to make it easier) that takes all links with that class and gives them an on-click handler that results in the creation of a new tab/window and cancels the default action (i.e. stops the link from working as a link). That will still annoy people as it overrides the expected behaviour, though.

What you should not do is replace the links with dummy links and rely on JavaScript for the links to work.

Disregard that. The target attribute is no longer deprecated in HTML (the living standard or "5", depending on whether you follow WHAT WG or the W3C). The correct answer today is to just replace your DOCTYPE with this:

<!doctype html>

Note that it no longer has to be uppercase nor actually look like a full SGML DOCTYPE declaration. It's just a vestigial artefact identifying the document as standards compliant HTML.

like image 28
Alan Plum Avatar answered Oct 31 '22 10:10

Alan Plum