# The “link” role is unnecessary for element “a” with attribute “href”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/the-link-role-is-unnecessary-for-element-a-with-attribute-href
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `<a>` element with an `href` attribute is one of HTML's most fundamental interactive elements. Browsers and assistive technologies inherently recognize it as a link — it's focusable via the `Tab` key, activatable with `Enter`, and announced as "link" by screen readers. This built-in behavior is part of the element's **implicit ARIA role**, which is `link`.

When you explicitly add `role="link"` to an `<a href="...">` element, you're telling assistive technologies something they already know. The W3C validator flags this as unnecessary because it violates the principle of not redundantly setting ARIA roles that match an element's native semantics. This principle is codified in the first rule of ARIA use: **"If you can use a native HTML element or attribute with the semantics and behavior you require already built in, instead of re-purposing an element and adding an ARIA role, state or property to make it accessible, then do so."**

While a redundant `role="link"` won't typically break anything, it creates noise in your markup. It can also signal to other developers that the role is necessary, leading to confusion or cargo-cult patterns. Clean, semantic HTML that relies on native roles is easier to maintain and less error-prone.

The `role="link"` attribute is legitimately useful when a non-interactive element like a `<span>` or `<div>` needs to behave as a link. In that case, you must also manually implement keyboard interaction (focus via `tabindex`, activation via `Enter` key handling) and provide an accessible name. But when you already have a proper `<a>` element with `href`, all of that comes for free — no ARIA needed.

## Examples

### ❌ Incorrect: redundant `role="link"` on an anchor

```html
<a href="/about" role="link">About Us</a>
```

The `role="link"` is redundant here because the `<a>` element with `href` already has an implicit role of `link`.

### ✅ Correct: anchor without redundant role

```html
<a href="/about">About Us</a>
```

Simply remove the `role="link"` attribute. The browser and assistive technologies already treat this as a link.

### ✅ Correct: using `role="link"` on a non-semantic element (when necessary)

```html
<span role="link" tabindex="0" onclick="location.href='/about'" onkeydown="if(event.key==='Enter') location.href='/about'">
  About Us
</span>
```

This is the legitimate use case for `role="link"` — when you cannot use a native `<a>` element and need to make a non-interactive element behave like a link. Note the additional work required: `tabindex="0"` for keyboard focusability, a click handler, and a keydown handler for `Enter` key activation. Using a proper `<a>` element avoids all of this extra effort.

### ❌ Incorrect: multiple anchors with redundant roles

```html
<nav>
  <a href="/" role="link">Home</a>
  <a href="/products" role="link">Products</a>
  <a href="/contact" role="link">Contact</a>
</nav>
```

### ✅ Correct: clean navigation without redundant roles

```html
<nav>
  <a href="/">Home</a>
  <a href="/products">Products</a>
  <a href="/contact">Contact</a>
</nav>
```