<h2> Links - Bad?

Quick question.

Is it incorrect to do the following.

Code: Select all

<h2><a href="#">Example</a></h2>

If so, why?

Thanks,
Pádraig

I have recently gone on the basis that you shouldn't have anchors within a header element, mainly because Ryan told me not to but I honestly can't see a reason why they shouldn't be. That said I try not to where possible. But take a blog archive, for example, you may have quite a few h2's on a page as the article titles and those titles would have to link to the full document. As longs as it's all correctly nested then I see no reason why you shouldn't.

If anyone has a good reason not to put anchors in headers then please let me know. Is there some seo or accessiblity issue that I am unaware of?

Pete.

Well I'd say the reason you wouldn't is because a headline is just that, a headline. A headline isn't a link.

So it would probably confuse Google bots, and direct them around your site, while they aren't reading your pages?

But why shouldn't a headline be link. I've been doing some research and I can't find much on the subject. And there is nothing that says don't do it. Yes what goes between hx tags should be a headline or its equivalent but that doesn't mean it cannot be a link. Header elements are use to create structure within a document. A heading or subheading may after an intro lead to a nother page where there is more information.

Would you advocate not linking blog titles in an archive? In situation where you have a heading that you want to link, I would suggest linking it. The alternative woule be to have 'Read more...' text or something similiar alongside the header which is bad practice. Link text should be descriptive. So a h2 that is a link with text saying "An article on cheese" is of more value than a link saying "Read more..", in my opinion. As I said originally though, if it isn't necessary then don't do it and I can't think of many cases when it would be necessary but I can't sse how it would be damaging.

Pete.

I think I will go with the "read more" option then lol.

There's nothing fundamentally wrong with making headings into links. It's entirely possible that a piece of text could have a structural role of both heading and link.

In most cases it feels a bit odd, however (to me, anyway).

With regard to "news snippets", another option is to mark them up as a definition list, with the <dt> as the "heading" and the <dd> as the short description.

Nice to see you again mike.

At any rate I agree, as I've said, and sometimes I will make headings links as well. Though there are very few situations in which I would do this.

As goes the definition list, Mike, I think that is stretching their use a little far. I wouldn't use a dl like that, I see the logic but I don't think the element fits that use well enough. It's a tricky one though.

Pete.

Back from climbing, shortly to go caving. It's a hard life

The <dl> element certainly causes disagreement among semantics geeks (such as me, and, I venture, you)

The W3C are remarkably laconic about the correct uses of <dl>.

Some designers say <dl> should only be used to mark up a definition of terms:

Code: Select all

<dl>
<dt>Carrot</dt>
<dd>Orange root vegetable of humorous shape. Consumed in vast quantities by Robert Kilroy Silk.</dd>
<dt>Potato</dt>
<dd>Tuber that embarrassed Dan Quayle.</dd>
<dt>Potatoe</dt>
<dd>See Dan Quayle</dd>
</dl>

Other designers consider the term "definition" to be more abstract. You can use it as a way of attaching a title (<dt>) to connected information (<dd>).

Of course, a heading does the same job; and in most cases, headings are the right element. But sometimes a simple title-information pairing does not merit a heading. Pull-out boxes, for example: those short highlighted boxes with titles such as "Key tip", "Did you know?", "Fun fact", and so on.

For those, I would use a <dl>. This presents well when stylesheets are off, and it avoids confusing the structure of the document with lots of low-level headings.

The point here is rather subtle. Headings <h1> through <h6> create a hierarchical structure to a document. This has two semantic properties: containment and importance. The <h1> contains all the other headings; they are sub-headings. The <h1> is also the most important heading on the page (you can define importance in terms of how readers use headings to scan a page).

But not all information can (or should) be hierarchically structured. Sometimes you want to emphasise an element without giving it a higher structural weighting in the document. Emphasis does not always mean "this is more important"; sometimes it means "this is different", "this is another way of looking at things", or "this is an aside".

You can use <dl>s to emphasise title-information pairings, without being forced to make the title part of the main document structure.