Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have been experimenting with right aligned background image treatments in input boxes for the web lately. Are there any rules of thumb for this type of implementation?

Is it considered great contextual feedback or a distraction?

Examples:

|_____________| <--intial state

|__________ X_| <--bad feedback

|__________ ✔_| <--good feedback

share|improve this question
add comment

4 Answers 4

up vote 8 down vote accepted

So would it be an X until it becomes good feedback?

If so, I would change that part. Don't show anything until it is recognized as good feedback then when the focus is taken off check for bad feedback.

People don't like negative while they are still working on the answer. Its like a nagging mother.

share|improve this answer
    
Updated question with initial state. –  rick schott May 5 '11 at 19:03
add comment

I think you should place the feedback to the right of the input box instead of in it. And I think you should have different feedback on different input text boxes. On password boxes, it's always nice to see how strong your password is as you type. On social security numbers (which is often difficult) I think some feedback for not correct input is useful when the user stops typing (timeout 1 second perhaps) - but when it is correct it should directly and clearly state it's right. On other text inputs, wait for validation on out of focus, as @jonshariat says.

share|improve this answer
    
While focus is still on the field, I would never provide feedback as an error (about the difficult social security number), but in a guiding way: grayish background and a hint to the right format. Only show an error, or maybe even more friendly - a notice, when focus is on the next fields. –  Lode May 6 '11 at 6:21
    
That's even better. Thanx, I'll think of that in my next design. BR –  Benny Skogberg May 6 '11 at 7:03
add comment

I've applied an 'invalid' style to fields as a person blurs out of the field. The style I used was a bolder, red outline to the field and a '!' icon on the right edge.

It's nice to reward people as they fill out a form, but having each and every field change state might get a bit distracting. The primary goal is to let people catch invalid fields before submitting, so I'd maybe limit it to the errors.

I'd avoid an 'x' only because some browsers now offer an 'x' icon as a clickable interaction to clear search fields.

share|improve this answer
add comment

It's good to provide feedback - it confirms for the user that they are making progress and that the system is still alive.

I'd move it out of the field and to the right (sorry Benny). I'm assuming it's an English language website when I say this - we read from left to right. Putting the feedback to the left of the field is drawing my attention backwards, not helping me with the natural reading flow - that puts an unnecessary hurdle in the path.

See the Twitter signup for a good example. https://twitter.com/signup

share|improve this answer
    
Your absolutely right. It should be to the right of the box. My bad (need to tell the difference of left¦right) I'll change my answer. –  Benny Skogberg May 6 '11 at 5:52
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.