1

I'm sure that this has an "answer" somewhere, but I find myself having difficulty articulating what I'm looking for in a search query.

Is there a standard text formatting to use when directing user to click a form control within the current form. For Example, suppose I have the text, To apply same message to all, click Apply To All, and there is a button or checkbox on my form labeled "Apply To All". Is there a recommended way to style the words "Apply To All" within the help text so that the user will know that I am referencing a control located on that form?

Or is it bad for UX that I have to reference a control apart from the control; in other words, is a tooltip over the referenced control more appropriate? Or perhaps placement of the 'Apply To All' button in such a way that there is no other function it could possibly have, and even having the previous help text would be redundant?

I can't tell if I'm being clear. This feels really clunky to type; so if anything is unclear, please ask for clarification.

EDIT: Below is a quick sketch illustrating what I'm looking for

enter image description here

  • 2
    Could you perhaps add a mockup of your idea? It'll be easier to understand and easier to provide suggestions. – msp Aug 19 '14 at 13:14
  • You can use emphasis (italics), bold words or put it in 'quotes'. For ex. To apply same message to all, click 'Apply to All' – Tyzoid Aug 19 '14 at 13:22
  • 1
    It would definitely help if we could see what you're talking about but, in general, I'd want to avoid having instructions that say "press this button" and instead do everything I could to make that button self-explanatory through its labeling and positioning. – Matt Obee Aug 19 '14 at 13:25
2

You want help text to be placed where the user has a question (e.g., “How do I apply this message to all the emails I’ve listed?”). You also want a control to be placed where the user is ready to activate it (e.g., “I’ve written my message and entered my emails, now I want to apply the message to all the emails.”). It follows that, in a properly laid out form, the help text should be near the control it relates to.

From what I’ve seen, instructions about specific controls in a centralized location (e.g., the top or bottom of the form) is a waste of space. Users don’t read them, believing they can figure out the form without them, and usually they’re right. If users do get stuck, they’re unlikely to be successful hunting around the form for help –they probably won’t find it among all the other irrelevant stuff filling the page.

So yes, put the help text as proximal as you can to the related control. There are 6 levels of proximity.

  1. Make the help text be the control label. So instead of separate help text “to apply same message to all, click Apply to All,” you simply label the checkbox “[ ] Apply same message to all” (where [ ] is the checkbox).

  2. Embed the control in the help text. This is most helpful to avoid long cluttering buttons with long captions. So you have “Apply same message to [All] emails,” where [All] is a command button, and the rest is static text.

  3. Place the help text near the control. This is best for subsidiary or clarifying information that may not be apparent from the control itself. So you have “[Apply to All] --Sends message to all emails, logs the transaction, and waters the recipients’ cacti.” Sometimes section headers and titles (e.g., step labels) serve in this capacity.

  4. Put the help text in a tooltip or balloon. This is generally best for when the users are wondering what a control does, rather than how can they complete the next intended step in the process. If you do it for one control, you probably should do it for all similar controls, otherwise users may never discover it (even then they may not). Tooltips regularly provide help text for all icons, for example. If the help text tends to be more than a few words, you may need to provide users with a means to turn the balloons on an off.

  5. Add a Help link beside the control. This opens a popup or message box with the help text. The link could be simply a question mark. The popup can be self-dismissing, perhaps disappearing when the user releases the mouse button, thus making it more like a tooltip with better discoverability and user control.

  6. Searchable help. Finally, you can provide a link or other controls at the top of the form for searchable help, where the user can enter “Send message to all emails” and get a window explaining how to do it. The controls need to be at the top of the form so users are likely to notice they’re there before they actually get stuck.

Level 1 is the most proximity, providing instantaneous help, while Level 6 is the least proximity, requiring the most work for the user, and, debatably, the least likelihood of success. You want the most proximity (e.g., Level 1, 2, 3) you can get away with. However, the high proximity levels tend to tolerate the least amount of help text before the form gets too long and cluttered. Certainly, in your case, where the help text is only two words longer than the control label, you can very likely use Level 1 or 2. You’ll have to go to lower proximities only if you have to provide more extensive instruction. If you’ve properly designed your form, the vast majority of users won’t need extensive instruction, so that shouldn’t happen too often. You can, and probably should, employ multiple levels in the same form, each successive level catching a smaller number of increasingly desperate users. Searchable help becomes the last resort.

There are rare cases of inherently complicated tasks or domains where users regularly need extensive instruction. If that’s the case for you, you need to re-think how you rollout your app. You may need to provide training, perhaps through on-line demonstrations and tutorials. Then you don't have to rely on help so much.

However, if you’re seeing a need for a lot of help text for the average user, then you should take a second look at your form design. As commenter Matt Obee points out, your form should be as self-documenting as possible.

  • Clear precise language may help. I know it’s only a mockup and I have no knowledge of the task, but it's not clear what “apply to everyone” means. Maybe the problem is your users don’t understand it either, in which case the help text won’t help no matter where it is. If you mean “email message to all addresses” say that, rather than “apply message to everyone.”

  • You have a list of emails the message applies to if the user selects Apply to All. So what does the message apply to if the user doesn’t select apply to all? Maybe you need two radio buttons –one with Apply to All next to the list of emails, and an alternative Apply to X (whatever X is). Or, if the alternative is for the user to select an email from the list, then what you need isn’t “Apply All” but “Select All.” Assuming you support multi-selection, this adds flexibility –a user can select all emails, then deselect certain emails (e.g., the guy the surprise party is for).

  • Remember you want the control to be placed where the user is ready to activate it. Right now it’s not clear what “all” or “everyone” means because the check box is far from the email addresses and separated by a border. Maybe you need to move the checkbox (or radio button) to the right side so it’s clear it means all the emails listed (not all the emails in the whole company or the whole world).

  • Awesome answer which I suspect I will reference again. Thank you! – dgo Aug 21 '14 at 13:29
  • +1 for: "From what I’ve seen, instructions about specific controls in a centralized location (e.g., the top or bottom of the form) is a waste of space." That being said I think a repository of instructions is still necessary. Its usefulness is limited but the effort in creating a FAQ and allocating link space for it is minimal. (It's also good to see all the points in one place and reviewing them periodically in case you've put in contradictory or confusing information.) – Mayo Nov 14 '14 at 15:26

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.