How to Make Links Open in a New Window or Tab

HTML code for opening links in a new browser tab or window


How to Make Links Open in a New Window or Tab

by Christopher Heng, thesitewizard.com

I was asked by a visitor how he could make hyperlinks on his website open a new browser window or tab when clicked. This article answers that question.

Prerequisites

Since the visitor did not specify which web editor he was using, I will assume here that he is working directly in HTML.

Note that this does not mean you cannot follow this tutorial if you use a visual web editor, or if your website uses some sort of blogging software. It merely means that you will need to somehow access the HTML code of your page so that you can modify it. Most web editors and blogging software allow you to do this.

For example, if you are using Dreamweaver, you can modify the HTML code of your web page by switching to the Code view. Instructions for this can be found in the article How to Insert Raw HTML Code in Dreamweaver. Similarly, BlueGriffon users can follow the instructions given in How to Insert HTML Code in BlueGriffon to access the underlying HTML of your page. And KompoZer users can do the same thing with the help of How to Insert HTML in KompoZer.

How to Open Hyperlinks in a New Browser Tab or Window

The short answer is: just add a target="_blank" attribute to your links (anchor tags).

For example, if you have a link that says the following:

<a href="https://www.thesitewizard.com/">thesitewizard.com</a>

Change the above so that it now says:

<a href="https://www.thesitewizard.com/" target="_blank">thesitewizard.com</a>

Now when your visitors click that link, it will open in a new window or tab (depending on which web browser they are using and how they configured that browser).

Note that if your web page uses the "strict" DOCTYPE of XHTML 1.0 or 1.1, you will not be able to do the above and still have your page validate as correct. However, I suspect virtually nobody uses those, so don't worry if you don't understand what I just said in this paragraph. The "transitional" versions of those DOCTYPEs are fine, though, since the target attribute is still supported there.

If you are using Dreamweaver, BlueGriffon or KompoZer, just click somewhere in the link that you want to modify, switch to the mode that allows you to change the HTML code (see the tutorials listed earlier in the Prerequisites section to find out how to do this), and add the target="_blank" attribute.

It Doesn't Have the Benefit You Think It Confers

I know that some new webmasters seem to have got the impression that causing external links to open in a new window helps to keep people from leaving your website. This is an erroneous assumption. If someone clicks on a link and wants to return to your site, they will simply hit the Back button on their browser. Most people, even non-computer-geeks, learn this feature of their browser within a short time of discovering the Internet. The power users learn, in addition, how to right click a link and select "Open in a new tab" (or window) when they need a link to be displayed in a separate tab or window.

When you create links that open in a new window, you are actually preventing newcomers from returning to your website. You may think that they will know how to simply switch back to the original window. My experience with such people suggests otherwise; they are stymied by the Back button not working, and are not even aware that they are looking at a new tab or window. When they can't figure out how to solve the problem, they simply exit the browser (tabs and all).

The situation is not better with experienced users. While they can figure out that they are looking at a new tab or window, and can switch back, they tend to get very irritated at your site for opening windows without their permission. After all, they are power users: if they wanted to open a new window, they will open it themselves; they don't want you to do it without their consent. It's worse if all your links open in new windows (leading to the situation described in my article about usability mistakes made by amateur webmasters).

My general recommendation is to avoid opening links in a new window or tab, if possible. Of course there may be specific instances where this is needed (which is why such a facility exists in the first place, for those rare cases where it may be required). If so, it's best to warn your visitors by saying something like "opens in a new window" next to your link. It won't help the average Internet user (who won't know what you are talking about or how to deal with it), but at least you won't frustrate the experienced Internet users visiting your site.

Copyright © 2015 Christopher Heng. All rights reserved.
Get more free tips and articles like this, on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.

thesitewizard™ News Feed (RSS Site Feed)  Subscribe to thesitewizard.com newsfeed

Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.

Please Do Not Reprint This Article

This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.

Related Articles

New Articles

Popular Articles

How to Link to This Page

It will appear on your page as:

How to Make Links Open in a New Window or Tab





Home
Donate
Contact
Link to Us
Topics
Site Map

Getting Started
Web Design
Search Engines
Revenue Making
Domains
Web Hosting
Blogging
JavaScripts
PHP
Perl / CGI
HTML
CSS
.htaccess / Apache
Newsletters
General
Seasonal
Reviews
FAQs
Wizards

 

 
Free webmasters and programmers resources, scripts and tutorials
 
HowtoHaven.com: Free How-To Guides
 
Site Design Tips at thesitewizard.com
Find this site useful?
Please link to us.