6

What are the best standards of usage for the help and information icons? (I'm unable to post an image because I am a new user, but the icons are either a ? or an i in a circle, most commonly)

The method I propose, that seems most consistent is (it is terribly inconcistent in use across applications and websites):

The help icon should be used when:

  • it links directly to or launches application/site help
  • Detailed information is necessary, requiring more than one sentance for clarification.

The information icon should be used when:

  • A small amount of helpful text is appropriate
  • May live in the UI or
  • May reveal on rollover

What standards do you put into use? How would you define the proper usages of these? Is there a difference between the i and ? icon, or do you need only one or the other?

Improve this question

3 Answers 3

Reset to default
5

While our User Experience team has not defined this down to the last possible aspect we do provide some reach into these different standards. More specifically we refer to these as Messages and Contextual Help.

The "i" informational symbol is currently being used as part of our set of message elements (See image below). Because our User Experience team works with both internal and external facing applications we have developed for a wide range of possible messages. Depending on the content, developers are allowed to choice the message style that makes the most sense. For the most part the "i" informational message is the most used as it best represents generic messages.

Different message types

These message elements are specifically made for informational purposes only. Meaning that something is important; and the users should be informed. The different styling is to better emphasized specific message types. We find in some cases using the "i" symbol is to generic and these other message styles better reflect the type of content needing to be conveyed.

For the "?" icon we use it as reference for contextual help (See image below). Our contextual help for the moment is tied to the Qtips 2 jQuery plugin. This way users can reveal the contextual help as they need it. This is most commonly used on forms but developers are not limited to linking the icon to another web page.

Example of contextual help from guide

The two icon defiantly have different meaning. The "?" icon has been the long believed defacto standard for help. The "i" informational symbol to my knowledge is slightly newer but has also become a said standard. I would hesitate from using any other icon symbol to reflect either.

Improve this answer
0

I think the method you proposed is the most universal and proper way to tackle the issue. There definitely is a difference between the ! And ? Icons though. I wouldn't use them interchangeably. A ! Can be used more frequently and would provide a quick insight or clarification to an input field, or something similar. A ? Would link to a knowledge base with question and answer type format. Also you can use colored icons with the symbols which may mean different things. A blue ! Would indicate general information. A yellow ! Would indicate something you need to read as caution. And red ! Let's you know that there is an error and to refer to the message for clarification. You would never use a red ? Would you?

Improve this answer
2
  • You don't cite any reasoning as to why these icons and shapes have different uses. Is this just your subjective opinion? If you can provide links to studies related to colour meaning and uses that would improve this answer, but currently it comes across as just your own opinion. Commented May 9, 2012 at 6:06
  • He does however state the standard colours and symbols associated with the most common message types, why are references needed when it's a standard that is so global. Commented May 11, 2012 at 5:31
0

I use (i) for InfoTips that popup with additional information based on hover or interaction with the icon. An InfoTip can contain a link to the help system.

I use (?) for Help. Interaction with (?) would open the application help system or web page.

My thinking is that (i) provides additional - albeit limited - information in-context to the item it relates to.

(?) is for when "I have questions" and the user will need more than a limited InfoTip.

Using (?) should be very visually distinct and not positioned near the end of a line to prevent confusion, as a question mark is common end-of-sentence punctuation.

Example from a recent Microsoft Outlook version illustrates this. Note the stand-alone question mark ? in the upper-right of the dialog box. Choosing that icon opens a web page that is the Outlook and Microsoft Office help system.

Each option has a (i) icon, for additional information about that specific item. The popup InfoTip appears on mouse-hover.

enter image description here

Improve this answer

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.