Snook.ca

Top of Page

I spent years working on government web sites; a side effect of working in a government town. And if there's one thing the government has it's information. Lots of it. They like to post it to the web in bucketfuls. Of course, with that you'll find long documents.

Inevitably, I'd get asked to pop "Top of Page" links liberally throughout the page. Space them out just far enough that you hoped you never saw two in the window at the same time. The standard template — that every page on every government site is supposed to use — has that link sitting at the very bottom. But I always wondered...

Do we even need them?

I say, no. I feel this way about any feature that serves to mimic something a browser already does. Like print buttons that just execute window.print(). Or bookmark links that were meant to add the page to your browser (I'm not even talking of the multitude of social bookmarking links that have popped their silly heads all over the place). Or back links as if the user never realized how to use that back button in their browser.

But those other "features" are rarely used these days, unlike our friend the "Top of Page" link which I still see all over the place (although admittedly less so in the blogosphere). It's about time to see it fall by the wayside like the rest of them.

Conversation

I completely agree with the print/bookmark thing... But on the top of page link? I'm somewhat hesitant to write it off.

We have to consider the fact that you, I, and probably most that are in the web community, consider ourselves "power users" - that is, people who are considerably ahead of the curve when it comes to operating our browser. Our visitors, however, are sometimes not quite as adept.

This argument goes to the very roots of the usability discussion. For instance, target="_blank" - a user SHOULD know that they can open their links in a new window, but do they?

Personally, if I see a 'Return to Top of page' link, I find it so outside the scope of how I operate a browser that it rarely registers to click it; even if it seems more logical, since generally it's easier to make a mouse click than shift my hand to the keyboard and press my 'home' button. However, the same argument could be made for the backspace key, rather than hitting the back button.

Now, that's just me. You, or others within the blogosphere, could be entirely different. My point is that perhaps it's not time to write off functionality that could perhaps enhance the way we interact with our browser. I suppose the question becomes instead, where is the line to be drawn?

I see the 'back to top' feature in the same way as 'skip to content' and other such on-page navigation. Not perhaps useful if there's nothing at the top of the page but certainly a desired function on a mobile device or where content nav is at the top and the page is seriously long with some hefty scrolling involved.

You suggest that browsers have a 'back to top' function but the only way of doing that I'm aware of is pressing the 'Go' button or pressing the 'Home' button. This escapes way too many people in my experience so people just scroll and moan. I see it daily.

Personally, I rarely if ever use a "top of page" link, much as with "print this page" links. As Ryan points out though, most of the people reading this blog would probably be considered "power users."

So it comes down to a question of audience (something that your article perhaps hints at with it's acknowledgement that there are less "top" links in the blogosphere).

Regarding "print" links, I used to fight tooth and nail to leave them out. However, after several clients (and their customers) asked with genuine concern how people (i.e. they) would print the page, I realised that "print" links are genuinely helpful for some users.

Even regular users of the web may be used to seeing (and therefore relying on) the "print" link. Just make sure you use unobtrusive JS to create them (but that's another topic entirely).

The same may very well hold true for "top" links. They benefit some users, and will only ever "offend" the few of us who consider these things worth getting worked up over (myself included).

Ed also makes an interesting point about their usefulness within mobile devices, although that doesn't mean the link can't be hidden in a "screen" stylesheet of course.

I'm not sure that this is the same issue, but there is some similarity:

Whilst thinning out code on one of my sites (down to 10kbs per page) last week it occurred to me that the "top of page" links could just as easily link to the #wrapper or #header - and not to a "#top" named element. The testing proved positive. Consequently another big change in my design process.

Your post has forced me to ask if UP and DOWN images within a website and whether they are still necessary. More testing to do. Ah, the joys of website development!

(POSTSCRIPT: As said in my previous posts: Your site is pure inspiration. There are many components I learn and apply!)

Ed: "back to top" is nothing like "skip to navigation". While the former is (like Jonathan feels) unnecessary, the latter is very helpful for non-sighted users. A sighted user can quickly (in a part of the second) notice where content or a sidebar or even a footer begins, but those with screenreaders need to have the whole page read out until they figure out where's what. That can take minutes. Good browsers have "back to top" built in (typically <kbd>Home</kbd> or <kbd>CTRL-Home</kbd>).

I have mixed feelings about this. If in the end the objective is to improve the experience for the majority, it may be good to have those features. Not everybody knows how to do Ctrl+P to print, some people don't even know where to go at all. A print button makes it more visible, and it also saves you going to the file menu, opening it, and finding the print in there. As for the back to top links, I'm divided, but I think as others pointed out that many people find them very useful. As power users, we sometimes lose track of how many people out there really don't know the first thing about anything tech and you need to babysit them through everything. So this is probably a relative thing, you need t consider who your audience is and make a decision.

Mislav says: "back to top" is nothing like "skip to navigation". While the former is (like Jonathan feels) unnecessary, the latter is very helpful for non-sighted users.

It's not about being blind. What about small screens. Skip to content/nav etc is a means of whizzing through document and not having to scroll. Back to top is exactly the same. It's a means of on-page navigation where assistance adds usability. This is not about accessibility.

As for screen readers, I think you're misinformed. Headers and listing links are the primary source of navigation with screen readers and users of such tools most certainly do not read the entire page.

I'll say again, most people do not know the shortcuts of applications. Navigating a document is usually done with a primary device. I, for one, only use the mouse. I use the keyboard when characters are called for. As for calling for the application menu options to navigate, rarely do people go beyond back and forward.

if I need to go to the top of a long page, I roll the mouse wheel. I'm perfectly aware of the Home button on my keyboard but I don't use it. Back to top which takes me to a list of actions such as search, nav, headers etc is a usable feature in certain documents and something I use if it's there.

Certainly there are many users that are not aware the Home button on their keyboard will take them to the top of the page. For those that do know, perhaps they prefer mouse navigation over keyboard navigation. I'm not sure if we should get rid of it just yet. For those really long documents with a TOC at the top, I'd even say it should be mandatory.

I think the 'back to top' links can still be useful, particularly when it comes to smaller screens like cell phones and other hand-held devices. Browsing is difficult on most phones, and until mobile browsers get up to speed, anything to make browsing easier is still useful in my opinion.

With that said, I'm not advocating a return of the 'Back to Top' link all over everyone's websites because (like the print buttons) that functionality already exists within the browser.

please bare in mind that blind people do need them to navigate smoothly through your documents (and most cellphones andd pdas too btw.). i know that screenreaders actually have other features that make these links needless, but most blind people don't know that they have these features, and even *if* they know, they're mostly too complex for them to use. so in the end: *we* need them still, but you can make them /invisible/, if you like :-)

Recently I've made good use of my own 'back to top' buttons - prior to relaunching a discussions service for the University I have gone through each discussion board checking dates of last update, general content themes, and contacting the moderator to ask about usage and intentions for their boards. Navigating pages of my own making has been made so much easier with this feature - critically because it's never more than a few screen inches away from the rest of the links I've been using.
A bit of slick SQL would have pulled all the info I need out far quicker, but denied me the refresher course in my own interface - and finding those buttons 'essential'.
Duplication yes, but helpful and courteous.

I definitely think this is a function which should be implemented by the browser, like the Print and Back/Forward buttons. However, except for the Home key, there is currently no such button in the browser, nor any menu item refering to it. So, no one could get to know the shortcut without accidentally finding it out.
Hence, I propose to add a small horizontal line above the scrollbar, which would scroll to the top of the page, and one beneath the lower triangle. This is something which could be generally available everywhere in the operating system, so, for example, you could use these handy little things too in your text editor.

Otherwise, I think it could form an entry in the "Go" menu of Firefox, underneath the Back, Forward and Home entries.

P.S: The title tag of this page currently contains "Top of Page - Snook.ca - Snook.ca". You may want to remove the double Snook.ca