Internal links with name or id?

Question

Internal links with name or id?

If I want to reference a part within some page I use links with a Pad (#); such as: http://mi.pagina.com/#ancla, it will jump inside the page to the part identified with the anchor #ancla.

There are two methods that work to create that inner anchor / link:

Using a a with the attribute name:

<h2><a name="ancla"></a>Título de Sección</h2>

Or using any element with a id:

<h2 id="ancla">Título de Sección</h2>

Except in cases exceptional (I checked that browsers react differently in case of conflict), it seems that the two work the same. is there any difference between the two methods? Is either way better than the other?

3

Author: Alvaro Montoro, 2016-08-05

Source

1 answers

score 5 · Accepted Answer

¿is there any difference between both methods?

The main difference in theory is that the first method is "obsolete but conforming" in HTML5, in other words it can still be used although it should not, according to W3: Obsolete but conforming features the attribute id:

Authors should not specify the name attribute on a elements. If the attribute is present, its value must not be the empty string and must neither be equal to the value of any of the IDs in the element's home subtree other than the element's own ID, if any, nor be equal to the value of any of the other name attributes on a elements in the element's home subtree. If this attribute is present and the element has an ID, then the attribute's value must be equal to the element's ID. In earlier versions of the language, this attribute was intended as a way to specify possible targets for fragment identifiers in URLs. the id attribute should be used instead.

The difference in practice should be, depending on the specification, that the browser first looks for an element with a id equal to the one specified in the anchor (#ancla), which is 'case sensitive', if it does not find it then it will look for an element with the attribute name.

The explanation for this second point can be found here: Navigating to a fragment: the indicated part of the document

1 Apply the URL parser algorithm to the URL, and let fragile be the fragment component of the resulting URL record.

...

7 Not decoded fragid: If there is an element in the DOM that has a name attribute whose value is exactly equal to fragid (not decoded fragid), then the first such element in tree order is the indicated part of the document; stop the algorithm here.

¿one of the two ways is better than the another?

Based on the theory, that is, the HTML5 documentation that we saw in the previous point, the best would be the second method, since the first is not valid and may someday not support browsers that follow the specification strictly.