Open In App

How to Open a Hyperlink in Another Window or Tab in HTML?

Last Updated : 23 Nov, 2024
Suggest changes
Share
4 Likes
Like
Report

In HTML, this can be easily achieved using the 'target' attribute of the anchor ('<a>') tag. By setting 'target="_blank"', you instruct the browser to open the linked document in a new tab or window. This approach is widely used in web development to provide seamless navigation and improve the accessibility of external links or supplementary content.

<a target="_blank" rel="relation_name" href="link">Link Name</a>

Approach to Open Link in a New Tab

  • Start by defining the basic structure of your HTML document with <!DOCTYPE html>, <html>, <head>, and <body> tags.
  • Inside the <head> section, include a <title> tag to provide a title for the document.
  • Within the <body> section, add the content you want to display on the webpage. Use a <p> tag to include any text. Insert the hyperlink using an <a> tag, and set the href attribute to the URL you want to link to.
  • Add the target="_blank" attribute to the <a> tag. This tells the browser to open the link in a new tab when clicked.

Syntax

<a target="target_name" rel="relation_name" href="link">Link Name</a>

Note: Here, the rel attribute is used to describe the relation between the current document and the linked document and the target attribute is used to specify the target link.

Example 1: Here, target=”_blank” is used to open a hyperlink in a new tab.

HTML 
<p>A computer science portal for geeks <a target="_blank" href="https://www.geeksforgeeks.org/"> GeeksforGeeks </a> </p>

Output

target_output
Output

Example 2: Here, rel=”noopener noreferrer” is used as a security measure.

HTML 
<p>A computer science portal for geeks <a target="_blank" rel="noopener noreferrer" href="https://www.geeksforgeeks.org/"> GeeksforGeeks </a> </p>

Output

target_output
Output

C
chaitanyashah707
Article Tags :

Explore

Lightbox