Issue 50

When you link to external websites and set the link to open in a new tab (target="_blank"), you should include the rel="noopener noreferrer" attribute. This issue checks whether all external links that open in new tabs have these security attributes properly set.

A passing implementation requires:

• All external links with target="_blank" include rel="noopener noreferrer"
• Both noopener and noreferrer tokens are present (not just one)
• The rel attribute is properly formatted with correct spelling

Example: A link to an external site: <a href="https://example.com" target="_blank" rel="noopener noreferrer">Visit Example</a>

Proper rel attributes for external links are important because they:

• Improve Security: Prevent reverse tabnabbing attacks where the external page can manipulate your page through window.opener
• Protect Privacy: Prevent sending referrer information to external sites when noreferrer is used
• Follow Best Practices: Modern browsers recommend these attributes for all external links opening in new tabs
• Protect User Experience: Prevent external pages from being able to redirect your page to a malicious URL

While this issue doesn't directly impact rankings, it's considered a best practice for website security and user privacy, which indirectly supports your overall SEO health score.

1. Audit your external links: Check all links that have target="_blank" and ensure they include rel="noopener noreferrer".

2. Add missing attributes: For each external link opening in a new tab, update the HTML to include both tokens:

   <a href="https://external-site.com" target="_blank" rel="noopener noreferrer"
     >Link Text</a
   >
   

3. Update templates and components: If you use shared templates or components for external links, update them to automatically include these attributes.

4. Check for partial implementation: Ensure you're not missing one of the two tokens (some sites only have noopener but not noreferrer, or vice versa).

5. Test after changes: After making changes, re-crawl your site to confirm all external new-tab links now have proper rel attributes.

Example 1: Missing rel Attribute

Problematic State (Fails): An external link opens in a new tab without security attributes:

<a href="https://external-site.com" target="_blank">Visit External Site</a>

Corrected State (Passes): Add both noopener and noreferrer tokens:

<a href="https://external-site.com" target="_blank" rel="noopener noreferrer"
  >Visit External Site</a
>

Example 2: Missing One Token

Problematic State (Fails): Only one token is present:

<a href="https://external-site.com" target="_blank" rel="noopener"
  >Visit External Site</a
>

Corrected State (Passes): Include both tokens:

<a href="https://external-site.com" target="_blank" rel="noopener noreferrer"
  >Visit External Site</a
>

Example 3: Internal Links (No Issue)

No Issue (Passes): Internal links don't require noopener noreferrer:

<a href="/contact" target="_blank">Contact Us</a>

This is fine because it's an internal link (same domain).

PixyScan performs external link security checks through the following logical steps:

1. Link Extraction: PixyScan crawls your pages and extracts all external links (links pointing to different domains).

2. Target Filtering: PixyScan filters for external links that have target="_blank" attribute (links that open in new tabs).

3. Rel Attribute Check: For each external link with target="_blank", PixyScan checks the rel attribute to verify it includes both:

   • noopener token
   • noreferrer token

4. Token Validation: PixyScan parses the rel attribute value and checks for the presence of both required tokens (case-insensitive).

5. Issue Identification: PixyScan raises issues when:

   • External links with target="_blank" are missing the rel attribute entirely (SUGGESTION)
   • External links are missing one or both required tokens (SUGGESTION)

Note: PixyScan analyzes links in raw HTML only and does not execute JavaScript. Links generated only by JavaScript cannot be detected for this check.