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.


download bmml source – Wireframes created with Balsamiq Mockups

Following is the way I used to show the information.


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.?

  • 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 '17 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 '17 at 16:06

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, privacy policy and cookie policy

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