12

Seems that a "Back to Top" button is helpful and useful — especially for mobile sites.

However, on websites that want to come across as "classy", it may sound a little primitive.

Personally, I believe that instructions should be clear, as should buttons — so nothing like:

"Click Thy Cursor Here to Return to the Commencement of this Web Document"

So meeting half way, what are good, intuitive alternatives to "Back to Top"?

3
  • 2
    "Free ride back to the top" has a nice fun tone, depending on the audience. It is my personal favorite. Commented Jan 18, 2013 at 20:31
  • I would in fact using the word "back" altogether, as this has an ambiguous meaning for "back in browser history", "back to the previous page in the navigation hierarchy" etc. Commented Jan 18, 2013 at 22:18
  • 1
    "To the Top", "Go to Top", "To Top", are better?
    – Baumr
    Commented Jan 19, 2013 at 2:06

8 Answers 8

14

You could use "Return to Top", "Jump to Top" or "Skip to Top". I would avoid using anything but "top", honestly. Alternate words like "beginning" or "start" indicate a time span or activity and are more related to media controls. If you're going for classy "Return to Top" is not a bad choice.

1
  • 4
    +1 for mentioning 'jump' as the user didn't necessarily start at the top e.g. if they used an anchor link. Commented Dec 15, 2012 at 13:37
5

What about just using the word "Top"? As long as your style clearly indicates this is a link (along the lines of Top - or even better, with a tiny arrow pointing up right next to it) would - in my view - make the target of this link quite clear.

1
  • 1
    Great suggestion. "Top" is commonly used across blogging platforms such as wordpress, and tumblr.
    – HeyCameron
    Commented Dec 15, 2012 at 3:37
4

You can't go wrong with "Return to top", space permitting. Back to top is favoured as it's two characters shorter. I've noticed a trend for just an upward arrow icon, which works for me.

4

An arrow icon might be more subtle than wording here. There should be some indication that the bottom of the page has been reached, so an clickable icon/image should do the trick without any wording.

Here are some examples:

http://www.psdlayout.com/

http://www.ja-nic.sk/#head

(I had lots of other links, but I'm too new here so I can't post more than two.)

2
  • 2
    In those particular examples I would expect the arrows to collapse each individual section. I would be rather annoyed if I had browed very far down the page it thinking I could collapse something it shot me back up to the top so I'd have to find my place again. I find one, distinct, fixed button, separate from other content to be most effective.
    – Henry
    Commented Dec 16, 2012 at 15:05
  • +1 for the suggestion, thanks! But I agree with Henry that those examples aren't great :P
    – Baumr
    Commented Dec 16, 2012 at 17:02
1

"Document Top"

But I wouldn't stray from "Back to top". It's standard, the most recognizable and usable.

1

I use an up-arrow and the word "Top".

Regular

To-Top Button
Hovered

To-Top Button, hovered

Here is why I use it:

  • It is intuitive - Everyone knows where it's going
  • It is clear - Don't have to worry about ambiguous wording like 'Back to Top'
  • It is simple - Minimal wording to reduce crowding of the button.
1

Most websites seem so make use of the words "back" and "top" most of the times (see this list for examples) in various combinations (back to top, back to the top, to top, top,...). I do not completely understand what you mean with it not being "classy" enough. What is your definition of classy and which analysis shows that users find it insufficiently classy?

If you really want something different, here is my suggestion:

scroll up!

Add a nice animation of course when it is clicked, so not just opening the webpage again.

0

I usually just use an arrow that points to the top of the page. The asset appears when the user scrolls down the page.

1
  • 2
    Do the users of your sites understand what this arrow means?
    – JonW
    Commented Dec 16, 2012 at 2:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.