by anthony on 07/18/11 at 3:19 pm
Imagine a user who is filling out your form to buy your product. They suddenly run into a field that they’re wondering about. The good news is that you have a help tip next to the field to answer their question. The bad news is that it opens on mouse click, instead of hover. If your help tips open on mouse click, you could make users worry more than they need.
Fear of Leaving the Form
Many users are afraid of help tips that open on mouse click because they expect the links will take them to another page away from the form. The user has just spent their time filling out a large part of the form. The last thing they want to do is to lose all their information by clicking a link that takes them off that page. Even though the link opens the help tip in a pop-up window, the user doesn’t know this. To them, links are affordances used to navigate to another page. When they see a link, that’s what they’re thinking. This can either make them skip the help tip and guess what goes in the field, or forget about filling out the form altogether.
Your help tips should open on mouse hover for many reasons. When users hover over a help tip, it instantly shows. They don’t have to debate whether clicking the link will take them to another page or not. Therefore, there’s no fear of losing their current form information. Help tips are usually short and compact that opening them on hover is more efficient than opening them in a pop-up window. After a pop-up window opens, the user has to close it so that they can continue filling out the form. This takes users time and effort to figure out and do. However, a help tip that opens on mouse hover easily closes when the user moves their mouse off it. Help tips on mouse hover don’t just subdue users’ fears, they’re quicker and easier to use too.
Accessibility of Mouse Hovers
A mouse hover is different from a mouse click, but you can make it accessible too. To create a hover effect, you would typically use the onMouseOver event handler. However, this is not enough for keyboard users. They need the onFocus and onBlur event handlers with it as well. These event handlers allow users to trigger mouse hovers with their keyboard. Visit the links below to learn more.
As users fill out your form, they should feel comfortable every step of the way. If they need help with a form field, your help tips should open on mouse hover so that they don’t have to worry about leaving the form and losing their current information. A successful form isn’t just easy to use physically, it’s one that’s also easy to use mentally. This is where users can fill out a form free of all fears and doubts. The way you design your user interface controls that.