Non-standard symbols indicates special function

Question

Everyone most web users understand that the asterisk (*) indicates that the fields on a form are required. But what about non-standard symbols?

Our UX team is currently working with an application dev group where there is a need to flag special functionality related to specific text boxes. In this particular case, this new flag would indicate that the related text box accepts wild card characters.

Mockup Example:

^{download bmml source – Wireframes created with Balsamiq Mockups}

What would be the best way to indicate special functionality that is related to a particular set field(s)?

Answer 1

Mint by Shaun Inman had 'required' labels in the form:

Instead of 'Required' labels you could have 'Wildcard' labels

Answer 2

Putting a small label "wildcard" with a mouseover tooltip indicating that "this text box accepts wildcard characters" could be a solution.

You can put this label above on the left of the text box or, if your text box title is to large, below.

Answer 3

icc97 beat me using the image I was going to use :) but considering the use case that some fields can be required and also support wild card charecters, I would recommmend using a combination of both the * and the required tag as shown in the example used by icc97

So your screen would look like this

The required tag label can be used to denote when a field is required and the asterisk can be used to denote that a wildcard is accepted in the text entry. The asterisk off-course must be denoted in in a legend below. With regards to the positioning of the asterisk I recommend looking at this article * Is This A Required Field? and the article The UX of Required Fields

I also recommend looking at this excellent question What's the best way to highlight a Required field on a web form before submission? to get additional inputs on how to position the asterisk and highlight a legend

Answer 4

Why flag for where something is allowed, instead of flagging when something erroneous is entered:

^{download bmml source – Wireframes created with Balsamiq Mockups}

As @mervin points out below, different functionalities of the different types of fields should be visualized. "Special functionality" though, as the OP describes it, is hard to visualize. The problem needs to be either written out in text, or resolved, for example by finding a way to let all the input fields have the same functionality.

Answer 5

I often see option symbols in Pizza menus:

Pepper sign here means "extra spicy" (or even several signs with different number of peppers to visualize different stages), there also may be a "vegetarian" sign, etc. And at the end of the every page of the menu there is a legend describing every sign.

So, I think that it's okey to use non-standard symbols which will allow your users to quickly identify different types of inputs and understand how they're working, just don't forget to describe them these signs somehow:

Answer 6

1. It looks like all your fields allow wildcards. Except Middle Initial, so why not make it support them as well?

2. Also, do your users really make use of wildcard capabilities? Have they demonstrated a need for such? In my experience, substring match is usually sufficient, and in fact people expect substring matching.

3. Then, put a banner message above the fields:

   "These fields support [[wildcards]]." (with a hyperlink to usage information)

   Or quick instructions:

   "Fields will also match substrings (e.g., 'Sam*' will match 'Sam', 'Samantha', and 'Samuel')."

Answer 7

It's a good idea to keep the * for required fields and if you don't want to clutter the UI you could add an extra label inside the 'wildcard' fields with example of accepted characters.