Thanks for your note, but I don’t know what you’re talking about. Those links work fine.I was going to send a "No, those links are not fine, here are the details of what's going on..." follow-up but then thought, "If no one has brought this to Nick's attention and I'm the only one in the world who cares about it, why bother?" In lieu of that second email, today's post will briefly discuss the Comments links problem and its very simple solution.
Anchor AWOL
So, I'm looking over a post on the home page of a blog and there's a Comments link below the post. Upon clicking that link, I expect to be taken directly to the Comments section of the individual post page; perhaps other users have other expectations but this is my expectation as a seasoned Web surfer. This isn't what happens at Nick's blog: clicking a Comments link on the ATH home page takes the user to the top of a post page, not to the Comments section that follows (the ad below) the post.
Let's look at the HTML for the Comments link at the bottom of Nick's most recent post, "The Indeed.com Game: Are you as dumb as HR?".
<a href="http://corcodilos.com/blog/7571/the-indeed-com-game-are-you-as-dumb-as-hr#comments"
title="Comment on The Indeed.com Game: Are you as dumb as HR?">Comments (2)</a>Note that the href attribute's URL value ends with a #comments reference. The comments part of the reference specifies the name of a destination anchor within the http://corcodilos.com/blog/7571/the-indeed-com-game-are-you-as-dumb-as-hr document. (The comments string is technically known as a fragment identifier - now there's a term you can throw around at your next networking event, eh?)
I accessed the source of the post page and searched for a comments anchor: per my suspicion, nothing came up. The http://corcodilos.com/blog/7571/the-indeed-com-game-are-you-as-dumb-as-hr#comments URL effectively points to a resource that doesn't exist. In following the Comments link, the link URL resolves to that for the page as a whole, and that's why the user ends up at the top of the page.
Try it yourself by clicking the link below:
Comments for the "The Indeed.com Game: Are you as dumb as HR?" post
I've added a
target="_blank" attribute to the anchor element start-tag so that the link opens in a new window.Getting the target
As you may know, the HTML id attribute can serve "as a target anchor for hypertext links", quoting the W3C. A class="commentWrap" div element holds the Comments section of an ATH post page: giving the commentWrap div an id="comments" attribute is all that is necessary to solve our little problem.
<!-- You can start editing here. -->
<div class="commentWrap" id="comments">
<div class="commentDate">
...I first learned about internal anchors from HTML Goodies's "So You Want A Page Jump, Huh?" tutorial, which discusses the classical way to link to a document fragment, that is, linking via an
<a name="codeword"></a> element. (Actually, the tutorial leaves out the </a> tag, which does need to be present, as commenter Eric points out.) Accordingly, Nick could deploy an <a name="comments"></a> anchor <!-- You can start editing here. -->
<a name="comments"></a>
<div class="commentWrap">
...rather than an id anchor although I myself would go with the latter given that ATH pages are served as XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">and that XHTML deprecates the name attribute of the anchor element.
For all I know, Nick may have said to his Webmaster, "When users click on a Comments link, I want them to go to the top of the post page and not to the Comments section" - if so, fair enough - but if he'd rather have them go straight to the Comments, then that's pretty easy to arrange, as you can see.
No comments:
Post a Comment