Opening Links in New Tab

Open Links in a New Tab (HTML)

Basic Syntax

<a href="https://www.example.com" target="_blank">Visit Example</a>

Recommended Security Practice

Always add rel="noopener noreferrer" for security and performance:

<a href="https://www.example.com" target="_blank" rel="noopener noreferrer">Secure New Tab Link</a>

Why Use rel="noopener noreferrer"?

• noopener prevents the new tab from accessing the window.opener property (security measure against potential phishing attacks)
• noreferrer prevents the browser from sending the referrer information (privacy protection)
• Improves page loading performance in some browsers
• Protects against reverse tabnabbing vulnerabilities
• Recommended by web security experts and modern browsers

Additional Best Practices

• Clearly indicate when links open in new tabs (e.g., with an icon or text)
• Avoid excessive use of new tab links as it can disrupt user experience
• For internal site links, prefer same-tab navigation unless there's a specific reason
• Consider adding visual indicators for external links that open in new tabs
• Test your links on different devices and browsers