1

I've got a scenario where I have a set of buttons. These buttons are actually links to pages with different functionality. Furthuremore the buttons should tell the users what the redirected page functionality is. Sort of a description of the feature.

What is the best way to visualize such a scenario. I've used the following way.

Following is the button listing.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Following is the way I used to show the information.

mockup

download bmml source

The text area will expand when the user hover over the button, and will redirect when clicked on the button. Is this approach the best? or is there any way I could do it in a better way.?

2
  • 1
    This sounds like something the button label alone should be able to fix. You can't really explain for each link what the user will see, you can only describe what your user will do once they click (send something, view something etc.). If you really need to add a disclaimer, like agreeing to the terms by clicking, put that text underneath the button, not inside of it. Oct 31, 2017 at 10:44
  • 1
    Depending on your target audience you might not want to rely on hovers for conveying the information. Remember touch screens don't have hover states.
    – Martyn
    Oct 31, 2017 at 16:06

2 Answers 2

1

It would be really helpful to understand why each button needed an explanation and are not self-explanatory by the button name itself. From the example above it also seems there's a tendency for the description to be quite long, so how big will your text area be.

We can find a lot of references for buttons with external descriptions in configuration/ setting pages. However, they mostly take up the pattern as below and this might affect your page layout.

enter image description here enter image description here enter image description here

0

Describe what the button does above it and make sure it makes sense in the context of the whole layout. Also, be very careful with the text inside the button. Use a clear, actionable verb that leaves no room for confusion.

Your Answer

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

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