Author: Steven Neiland
Published:

Warning: This blog entry was written two or more years ago. Therefore, it may contain broken links, out-dated or misleading content, or information that is just plain wrong. Please read on with caution.

So tonight I was working on my blog and I decided to put in some bookmarks. For some reason my mind completely blanked that you use the name attribute on the hyperlink tag. A quick quick google later and I was cooking, but during the process I learned that the name attribute of the hyperlink <a> tag is obsolete in html5 which came as a bit of a surprise since it still works from what I can see.

Previously

Previously if we wanted to link to a particular point on a page we would use a <a> tag with a unique name on it like thus.

<a href="#C1">Chapter 1</a><br/>
<a href="#C2">Chapter 2</a><br/>
<a href="#C2">Chapter 3</a><br/>
<a href="#C3">Chapter 4</a><br/>
<a href="#C5">Chapter 5</a>

<h2><a name="C1">Chapter 1</a></h2>
<p>blah blah...</p>

<h2><a name="C2">Chapter 2</a></h2>
<p>blah blah...</p>

<h2><a name="C3">Chapter 3</a></h2>
<p>blah blah...</p>

<h2><a name="C4">Chapter 4</a></h2>
<p>blah blah...</p>

<h2><a name="C5">Chapter 5</a></h2>
<p>blah blah...</p>

New HTML5 Way

With html5 we now use the "id" attribute on any html tag. So for example we would rewrite the above as follows, putting the id attribute on the h2 tags.

<a href="#C1">Chapter 1</a><br/>
<a href="#C2">Chapter 2</a><br/>
<a href="#C2">Chapter 3</a><br/>
<a href="#C3">Chapter 4</a><br/>
<a href="#C5">Chapter 5</a>

<h2 id="C1">Chapter 1</h2>
<p>blah blah...</p>

<h2 id="C2">Chapter 2</h2>
<p>blah blah...</p>

<h2 id="C3">Chapter 3</h2>
<p>blah blah...</p>

<h2 id="C4">Chapter 4</h2>
<p>blah blah...</p>

<h2 id="C5">Chapter 5</h2>
<p>blah blah...</p>

While I was surprised that the name attribute is supposedly no longer supported I must admit that I think the method of putting an id on an element is a lot cleaner to my eye.

What Do You Think?

Reader Comments

Post a Comment

Comment Etiquette:

  • Please keep comments on-topic.
  • Please do not post unrelated questions or large chunks of code.
  • Please do not engage in flaming/abusive behaviour.
  • Comments that contain or appear to be advertisments, will not be published.
  • Comments that appear to be created for the purpose of linkbuilding to commercial sites will be removed.

We are all adults here so play nice.

*
*



Archives Blog Listing

Tag Listing

Learn CF In A Week

Treehouse

 
Fork me on GitHub