Opening a new window with a link

Now that we have gone over how to create a basic hyperlink in HTML and covered how to create mailto tags to send email. Sometimes you may want to create an external link to websites. To do this, you may not want your visitors to leave your website but just open a new web browser window with the new link. That way, your visitors do not have to navigate back to your website, they can simply close the web browser window when they are done reviewing your external link.

We will use the link below to make  basic hyperlink:

<a href="/support/nextpage.html">Click here for the next page </a>

The basic form will remain the same however a few things will change. Since we're creating an external link to a website we will need to edit the link in the code. When referencing an external link, you will need the http:// in front of the full URL.

<a href="http://www.separate-domain.com">Click here for  the next page</a>

Now, since we have updated the URL the link will go to, when a visitor click on the link it will take them to the new site but in the same window. To change this, and have a new window open we will use the "target" attribute. To open a page in a new window, we will use the target="_blank" attribute. So now if we add the to the above code, it will look like this:

<a href="http://www.separate-domain.com" target="_blank">Click here for the next page</a>

This will now open the link in another browser window. You can change the text to whatever you would like at this point. 

Please check the next article on Anchor Links and How to Create Theme. If you missed our previous article, please see the Creating an Email Link in your Webpage tutorial. For more information on this course please visit Inserting Links into a Website