Ask Eric: Questions & Answers

December 19, 2003 – submitted by Elizabeth Spardel of Huntington, NY

Question: Hi. We have a customer building a site that allows users to access white papers and previous seminar videos. My question is regarding placement of registration. Is it better practice for users to register once upfront without know exactly what seminars or white papers are available, or, let them access the site and when they select a presentation they then are prompted to register (at which point they would only register once and then be cookied for remaining sessions). Also, do you know of any sites with research regarding the registration process? Thanks for your input

Eric's response: In usability the correct answer is generally "It depends". However this time it is solidly and scientifically "The Latter". Force registration as LATE in the process as you can and of course Only make them do it once.

November 28 , 2003 – submitted by Ria Breuer of Venlo, Netherlands

Question: In the corporate Web team we are developing a number of animations for the Web site. These animations are supported by some text elements. For example, "Conventional technology. Long paper path: through the middle of the machine to the sensitive photoconductor and fusing area. Complex internal mechanism results in many potential jam areas and wasted paper." We have conflicting opinions about the format of such text. Whereas some persons argue these must be full sentences with verbs, others argue that people do not read on the Web and that such text must be written in bulleted format. My feeling is that bullets are typically used for lists, but I am looking for some research results or other proof to support that feeling. Can you help? What is best in terms of user-friendliness on the Web?

Eric's response: We know that paragraphs are a poor way to show procedural instructions. Use a step chart (numbered list of tasks). Put the instructions in active voice, with an action verb first. Use short words and short sentences. If you are just labeling items then of course a noun construction works fine ("Paper Path").

October 3 , 2003 – submitted by Steve Michener of Austin, TX

Question: We are building an on-line application and are debating over how to display error messages. In the Science and Art of Effective Web Design it indicates that you should tell the user which field they have a problem with and then give the solution. However some team members think that this leads to a lot of repetitiveness (i.e. Borrowers Last Name - Please enter the last name). What is your opinion on this? Also, what is your opinion on using "Please" in the solution?

Eric's response: You have to tell the user which field is in error. BUT, you can best do this by highlighting the field. Putting the field label in the error message is a very awkward solution.

The word "Please" is not very helpful. In some cultures occasional use is considered important to give the interaction a polite tone (e.g., UK, and India). But in the USA market it is generally superfluous.

September 11, 2003 – submitted by Gulshan Panjwani of Mays Landing, NJ

Question: Hello Dr. Schaffer – I was wondering about the value of using metaphors in UI design. Being from a foreign country, the desktop metaphor was "Greek" to me and I have been a computer user for only 4 years now. Hence the whole emphasis on the metaphor use for intuitive behavior is not true in my case. I just learned to use the computer the right way and I got quickly acquainted and gain expertise on all Operating Systems. Hence I do not really see the value of using a metaphor for good user interface design.

My computer use is not very critical, but some people's use of the interface is very critical, e.g., Air Traffic Controllers. I was wondering that in such cases does the metaphor use support performance or do you think that practice and experience override the value of the metaphor used?

Thank you.

Eric's response: Gulshan, metaphors are in fact a very useful tool in good interface design. But like all tools it has limited correct applications. Gratuitous metaphors work poorly. I remember one of the earliest online services created an image of a city with buildings that were labeled as the different stores in their shopping facilities. This did not help the user to understand anything. It was a waste of download time (and at 1200 BAUD!).

There are plenty of cases where metaphors do help. They specifically (and only) help where the user does not immediately understand how to use the interface. Making something that works LIKE something they are familiar with is immensely useful. So paint packages and spreadsheets model common user experience and so are very helpful. I remember sitting with Mike Nelson at AT&T trying to figure out how people could collect software together that they wanted to purchase. He said "Why not use the metaphor of a shopping cart?" I said "Wow. Might work!"

There is a real danger in using metaphors in a cross- cultural environment. Use a Cricket metaphor in the USA and you will fail. Baseball won't work in India. Even the mailbox icon makes little sense in the UK, where mailboxes look quite different.

Finally, we have to watch for broken metaphors. The computer desktop is a great example. Does your desktop at the office have WINDOWS in the top of it? (that you can move about, resize, and MINIMIZE???). Do you keep your trash can on top of your desk? I think not.

August 4, 2003 – submitted by Shivanand Amravathi of Hyderabad, India

Question: We are health care solution providers.Our application automates processes of an entire hospital. I would like to know the kind of colors that can be used to represent different states of transactions in our application.

The colors should be intutive and not effect the mood of the user. I propose to use pastel colors.... Can you recommend any....

Eric's response: There is really no color that you can use. Because about 9% of your male users will be color blind, you can not RELY on color to do anything. Therefore, you MUST have a code or other indicator to clearly show the state of the transaction. You can then use color to make recognition quicker for users that can see it.

There have been many studies of color usage and mood. Colors are ASSOCIATED with moods. So in an American context black in depressed and red excited. But seeing your color codes will not AFFECT mood.

Pay attention, as you suggest, to the semantic value of the color. Use red for a problem, green for OK. etc.

If you use the color in a small area for coding (e.g., you make a red dot to show the problem) then use highly saturated colors so they are quicker to discriminate and stand out. If you are making the whole form a given color you will need pastels so they do not interfere so much with legibility. I would in general avoid making the whole form a given color as it is difficult to avoid legibility problems even with pastels.

August 4, 2003 – submitted by Ann-Marie Lind of Lexington, MA

Question: My question is about the use of color. The system I am working with already uses color in a way that is very meaningful to the user. Color is used to alert the user to the urgency in dealing with certain objects seen on the display. We have reserved the use of certain colors (red, yellow, green) for categorization of this alert data. However, now we also need to display color-coded weather data in relation to these objects. This is recognized National Weather Service precipitation intensity data that also uses red, yellow, green. If the precipitation colors are superimposed on the display of objects, it would of course make it impossible to see the color-coded alerts.

We've thought of various alternatives: a.) show greyscale for precipitation intensities, b.) enable flickering or swiping between the display of objects and the display of weather, c.) play with the saturation of hues and assess the visual effect. We haven't tried any of these alternatives yet, but thought it would be good to get your opinion. Have you run across this issue and seen it satisfactorily resolved in some other system? Do you have any suggestions? Thanks for your help.

Eric's response: First let me caution; unless you have users screened for color vision you should not rely on color as the only way of showing criticality. You need some other way to show criticality in addition to color.

I assume that the NWS radar charts are central to the user's activity. If this is true I would not degrade the image by switching to a greyscale image. Instead, consider moving the text so that it does not overlap the image. Also, you can use an inverse background on the text (show the text in a white or black box). You can even use color for the background to make the text stand out more. For example try a dark red (maroon) background with yellow text.

March 7, 2003 – submitted by C. Sama of Omaha, NE

Question: Hello Eric. Recently with my new 19 inch flat panel, many Web sites including yours fill approximately only 2/3 of my screen. I am one click up from 800x600 resolution. Most Web pages fill the entire screen. Is this something I may just have to live with owing to the fact that not all things were created equal? For example: Yahoo.com fills the entire screen, and msn.com does not. askeric.asp fills just over 2/3 of the screen. I am using Microsoft and Intel all the way. 3.06 GHz processor and all the rest.

P.S. My browser header etc. fills all spaces.

Eric's response: Actually it does not matter what size screen you have. What matters is the resolution you are set to in your Windows system (right click on your desktop, pick PROPERTIES, then look at SETTINGS). Most Web pages are written for 800x600 and will fill that area. There are methods for coding a Web page to adjust for your screen resolution (sometimes called 'liquid pages'). But most Web pages don't employ this. So... You have to live with it.

You can read more about this topic in our October, 2002 newsletter.

February 3, 2003 – submitted by Ahuva Levkowitz of Israel

Question: My company develops many Windows-style applications that are used worldwide. Is there a standard way to indicate that a field in a form is compulsory? It seems that the de facto Web standard is to use an asterisk in the field label, but I can't seem to find a Windows standard.

Is there a Windows standard? Can I use the asterisk in a Windows application? Many thanks for your expert direction!

Eric's response: There is not really a standard even in the USA! Required fields are marked with different shaped symbols. The symbols are different colors. The symbol is placed before the label, after the label, before the field, or after the field. The legend is placed at the top, or bottom, or is missing. There are also other approaches like bolding labels for required fields. Or bolding and highlighting the text box. There is also a common placement of the word "Required" after the text field and sometimes in parentheses. SIGH!

I have been using a red triangle to the left of the label for required fields. I do like the triangle better then an asterisk because it has a bit less visual noise. Also the asterisk implies that there is a note at the bottom (which is likely to be at the top or is missing). But I am not sure this is much better then the other solutions.

It is MOST important to make one decision and keep it. It is really poor practice to have several different methods in a single site or application.

I will watch for an evolving standard. But for now rest assured that this is only a limited problem anyway. Most users will get the idea quickly, and if not, will be guided by your error handling.

January 26, 2003 – submitted by Terence Karselis of Chesterfield, VA

Question: I am designing a pin for my local Lions club. The design calls for diamond shape sitting on one of its points. Around the edge of the diamond are four words. BRANDERMILL - MIDLOTHIAN - WOODLAKE - ANNIVERSARY.

My question: I used the modified 'z' layout with BRANDERMILL - WOODLAKE as the upper left and upper right edges., and WOODLAKE - ANNIVERSARY as the lower left and lower right edges. A colleague insists that the name should read in a continuous clockwise direction as BRANDERMILL - WOODLAKE-MODLOTHIAN - ANNIVERSARY.

Would you kindly shed a little light as to the correct layout

Thank you.

Eric's response: Boy do I get to work on a diverse set of issues in this job! The key issue is that it is the anniversary of the three clubs. So we need to make that clear. I assume there is a reason for not going with an alphabetical order (perhaps Woodlake is older or paying more toward the pin duplication).

In your design I am concerned that the term anniversary is not standing out and not clearly referring to the three clubs. Your friend's in not much better. Again the term "Anniversary" is mixed in with the club names and does not stand out.

Instead consider having all the text aligned with the top left border of the diamond. Start with the term "Anniversary". Put it in bold and add a separator after it. Perhaps a little lion head. Then have the three club names listed in the same orientation.