# The “name” attribute is obsolete. Consider putting an “id” attribute on the nearest container instead.

> Canonical HTML version: https://rocketvalidator.com/html-validation/the-name-attribute-is-obsolete-consider-putting-an-id-attribute-on-the-nearest-container-instead
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

Before HTML5, the way to create a link target within a page was to use a "named anchor" — an `<a>` element with a `name` attribute. This allowed other links to jump to that specific spot using a fragment identifier (e.g., `href="#section-5"`). In HTML5, the `name` attribute on `<a>` elements has been marked as obsolete. Instead, the `id` attribute on any element serves this purpose, making the extra `<a>` wrapper unnecessary.

This matters for several reasons:

- **Standards compliance:** Using obsolete attributes means your markup doesn't conform to the current HTML specification, which can cause W3C validation errors.
- **Cleaner markup:** Named anchors add an extra element that serves no semantic purpose. Using `id` directly on the target element is simpler and more meaningful.
- **Accessibility:** Screen readers and assistive technologies work better with semantic HTML. An `id` on a heading or `<section>` provides clearer document structure than a nested anchor element.
- **Browser behavior:** While browsers still support `name` for backward compatibility, relying on obsolete features is risky as future browser versions may change or drop support.

To fix this, remove the `<a name="...">` element and place an `id` attribute directly on the nearest appropriate container element, such as a heading (`<h2>`, `<h3>`, etc.), a `<section>`, or a `<div>`.

## Examples

### Incorrect: using the obsolete `name` attribute

```html
<h2>
  <a name="section-5">Section 5</a>
</h2>
```

The `<a>` element here exists solely to create a link target, adding unnecessary markup.

### Correct: using `id` on the heading

```html
<h2 id="section-5">Section 5</h2>
```

The `id` attribute on the `<h2>` makes it a valid fragment link target without any extra elements.

### Linking to the section

Both approaches allow navigation via the same fragment URL. The link syntax doesn't change:

```html
<a href="#section-5">Jump to Section 5</a>
```

### Using `id` on other container elements

The `id` attribute works on any HTML element, so you can place it wherever makes the most sense semantically:

```html
<section id="contact-info">
  <h2>Contact Information</h2>
  <p>Email us at hello@example.com.</p>
</section>
```

### Incorrect: multiple named anchors in a document

```html
<p>
  <a name="intro">Welcome to our page.</a>
</p>
<p>
  <a name="conclusion">Thanks for reading.</a>
</p>
```

### Correct: replacing all named anchors with `id` attributes

```html
<p id="intro">Welcome to our page.</p>
<p id="conclusion">Thanks for reading.</p>
```

Remember that `id` values must be unique within a document — no two elements can share the same `id`. If you're migrating from `name` attributes, check for duplicates and ensure each `id` is used only once.
