Skip to content

Security Vulnerability & Accessibility: External links missing rel="noopener" and aria-labels #124

@JaiswalShivang

Description

@JaiswalShivang

🐛 Describe the bug

Description

Several external links in Footer.js and About.js leverage target="_blank" without the accompanying rel="noopener noreferrer" attribute. Additionally, icon-only links (using React Icons) lack descriptive labels for screen readers.

Vulnerability (Security)

When using target="_blank" without rel="noopener noreferrer", the destination page receives partial access to the linking page via the window.opener object. This exposes the application to reverse tabnabbing attacks, where a malicious destination page could redirect the user's original tab to a phishing site.

Accessibility Issue

The social media links contain only SVG icons (e.g., <FaGithub />) with no text content. Screen readers will effectively be silent or announce them as "link" or "unlabeled graphic," making navigation impossible for visually impaired users.

Locations

  • src/components/Footer/Footer.js
  • src/components/About/About.js

Suggested Fix

  1. Add rel="noopener noreferrer" to all external links.
  2. Add aria-label="Description" to all icon-only anchor tags.

Example:

<a 
  href="[https://github.com/AOSSIE-Org](https://github.com/AOSSIE-Org)" 
  target="_blank" 
  rel="noopener noreferrer" 
  aria-label="Visit AOSSIE GitHub Organization"
>
  <FaGithub />
</a>

Metadata

Metadata

Labels

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions