{"id":354,"date":"2011-02-20T16:00:26","date_gmt":"2011-02-20T21:00:26","guid":{"rendered":"http:\/\/osric.com\/chris\/accidental-developer\/?p=354"},"modified":"2011-02-20T16:05:51","modified_gmt":"2011-02-20T21:05:51","slug":"opening-links-in-a-new-window-without-the-target-attribute","status":"publish","type":"post","link":"https:\/\/osric.com\/chris\/accidental-developer\/2011\/02\/opening-links-in-a-new-window-without-the-target-attribute\/","title":{"rendered":"Opening links in a new window without the target attribute"},"content":{"rendered":"<p>Web developers often use the attribute <code>target=\"_blank\"<\/code> to force a link to open in a new window. However, if you use an <a href=\"http:\/\/validator.w3.org\/\">HTML validation service<\/a> to check your web pages, you know that the target attribute is not valid in strict versions of HTML and XHTML.<\/p>\n<p>There is a simple way to have a link open in a new window using Javascript. You may have seen code like this:<br \/>\n<code>&lt;<!-- -->a href=\"#\" onclick=\"window.open('http:\/\/osric.net')\"&gt;osric.net web hosting&lt;<!-- -->\/a&gt;<\/code><\/p>\n<p>That method has some serious drawbacks, though:<\/p>\n<ul>\n<li>The user now sees <em>#<\/em> in the browser&#8217;s status bar instead of the actual destination URL<\/li>\n<li>The link fails if the Javascript fails (or if the browser has Javascript disabled<\/li>\n<li>Search engines may not follow the link<\/li>\n<\/ul>\n<p>I&#8217;ve written a summary of the issue and the methods I&#8217;ve found so far that best address it. I moved it to a page outside this blog because of the Javascript examples, which were easier to include on a separate page:<br \/>\n<a href=\"http:\/\/osric.com\/chris\/javascript\/javascript-anchor-target-blank.html\"><br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/osric.com\/chris\/accidental-developer\/wp-content\/uploads\/2011\/02\/javascript-new-window-screenshot-300x199.png\" alt=\"\" title=\"How to best use Javascript to open links in a new window\" width=\"300\" height=\"199\" class=\"alignnone size-medium wp-image-357\" srcset=\"https:\/\/osric.com\/chris\/accidental-developer\/wp-content\/uploads\/2011\/02\/javascript-new-window-screenshot-300x199.png 300w, https:\/\/osric.com\/chris\/accidental-developer\/wp-content\/uploads\/2011\/02\/javascript-new-window-screenshot.png 999w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p><a href=\"http:\/\/osric.com\/chris\/javascript\/javascript-anchor-target-blank.html\">How to best use Javascript to open links in a new window<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Web developers often use the attribute target=&#8221;_blank&#8221; to force a link to open in a new window. However, if you use an HTML validation service to check your web pages, you know that the target attribute is not valid in strict versions of HTML and XHTML. There is a simple way to have a link &hellip; <a href=\"https:\/\/osric.com\/chris\/accidental-developer\/2011\/02\/opening-links-in-a-new-window-without-the-target-attribute\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Opening links in a new window without the target attribute<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10,8],"tags":[171,169,350,172,174,173,170],"class_list":["post-354","post","type-post","status-publish","format-standard","hentry","category-best-practices","category-javascript","tag-anchor","tag-html","tag-javascript","tag-target","tag-validation","tag-window","tag-xhtml"],"_links":{"self":[{"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/posts\/354","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/comments?post=354"}],"version-history":[{"count":9,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/posts\/354\/revisions"}],"predecessor-version":[{"id":365,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/posts\/354\/revisions\/365"}],"wp:attachment":[{"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/media?parent=354"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/categories?post=354"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/osric.com\/chris\/accidental-developer\/wp-json\/wp\/v2\/tags?post=354"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}