6

We have a primarily form-based application. Most field labels are hyperlinked to a formal instructions document via context-sensitive help links (the mouse cursor changes to show this.) This works well to let the user know that information is available if they feel they need it, but in some cases we want to give them the idea that: This is a complicated option that might behave counter to your intuitions. In our documentation, these potential gotchas are often boxed off with an upside-down triangle icon.

How can we best indicate this on or around the form field? Some ideas we've considered, along with concerns:

  • a small question mark icon — may feel more like "information is available" rather than "look here even if you're pretty sure you've got it."
  • a small yellow upside-down triangle with an exclamation point — may look too much like a warning that there's something wrong with the user's entered data.
  • the first several words of the documentation text in small type, expandable by clicking, or other text like "see important information" — may simply add too much clutter to the form.
  • Googling for "more info icon" suggests a light bulb, or an ⓘ, or perhaps an i in a cartoon word bubble — the circled i may be an okay compromise in attention-grabbing, between a ? and a warning icon.

Do any of these, or something else, sound like the right thing to you? I've pictured these to the right of the entry field or the label, but perhaps there are better options for that, too. Any examples I can look to for guidance on web pages or existing applications?

Here's an example of this kind of information for our astronomical application domain: Warning: If your object has significant proper motion and the reference target does not have the same proper motion, do not use positional offsets to specify your object.

6
  • 1
    But your example is a warning, not simple information. A warning should be different and a triangle-exclamation-mark seems appropriate. Sep 9, 2013 at 15:54
  • I hear you. Two more detailed concerns with that: We use a similar warning icon (to the left of the field label) to warn about user data that's allowed but looks like a likely mistake. I'm also not sure how to make sure it looks like something to click on. One more notion: does the best solution depend if this is a mandatory piece of data? I'd be hesitant to put a warning icon attracting attention to a field that many users would leave blank. Sep 9, 2013 at 16:22
  • If the design is counterintuitive, you have to make it intuitive without forcing the user to read the doxx. Sep 10, 2013 at 10:12
  • @DeerHunter, the comment is appreciated, but I think it's a bit facile to (so "boldly") say. Vocabulary, for example, is often a major concern because a technical term can refer to somewhat different concepts (among scientists who've worked with different telescopes, or among different operations and engineering groups.) All of these groups are our users, and while we make great efforts to communicate among groups and revise vocabulary and avoid mismatch, it's not always doable. We're specifying very expensive operations, and users have to know exactly what they're getting. Sep 11, 2013 at 3:23
  • @JoshuaGoldberg - if this is mission-critical software, put all the warnings into one screen. The potential for costly mistakes vastly dominates the cost of devoting some extra screen space to clarifying terminology. Sep 11, 2013 at 6:10

1 Answer 1

3

Using different icons could be an option (like the suggested light bulb in grey vs. the same in red to make it stand out, or even a different icon like a triangle with exclamation mark). It's easy to get this wrong or confusing (unclear what icons mean, color blindness).

You're saying it's in some cases that it's probably not intuitive. If it's a long form adding more icons and always visible, distracting text is probably not the best option.

How about displaying the information only if the corresponding field has focus? One option to display this, just an example:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

1
  • Thanks. I especially like the last suggestion about waiting until the field is focused. Sep 11, 2013 at 3:24

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.