0

Take a look here - http://jsfiddle.net/9wFJS/2/embedded/result/

Which of the three is good? This is inspired by a conversation here...

I like the second one, but two users disliked it. One saying that it doesn't look sexy on click and would be better if the placeholder is removed on click. The other said he personally dislikes centered input boxes.

I would like to know, is there any general problem with centered input boxes? And finally, which among the three from the demo is best?

  • Once a user clicks into the box does the text follow the watermark? – DarrylGodden Jul 29 '14 at 10:39
  • 2
    For what purpose would they be used? Log-in page on a social network? As part of a mortgage application form? As a website search field? Also - if the label disapears as soon as you click into the field, how are you supposed to know what you're supposed to put in it then? Or worse - if you come back to the form later with everything filled in, you'll have no labels anywhere indicating what the fields are for. – JonW Jul 29 '14 at 10:46
  • 1
    Ok, my answer coming up – DarrylGodden Jul 29 '14 at 10:54
  • 1
    It depends on your definition of "cool". This is mainly a site about usability and user experience, not so much about coolness. – Bart Gijssens Jul 29 '14 at 11:11
  • 1
    I think the question is valid - why else whould we have left-, center-, and right-aligned fields in input forms? The formulation of the question is bad, though. UX is not about "sexy", "cool", or even "good" - as all these require to refer to context (coolness has changed a lot over time :-) which is not given in these words. UX is about usefulness for a purpose and about conforming to expectations, amongst others. Can you point out which contexts, purposes, expectations you think will make the center-aligned field more appropriate than the others? – virtualnobi Jul 15 '18 at 12:51
8

In the West we start writing and reading from the left and move to the right. As such, if the input would exceed the visible space of the input box, it makes logical sense to start from the left.

If your centred search only allows for X characters, which would not take it past the bounds of the input box then the centred text-box could work.

If you were designing for cultures who read right to left then I could only see the latter being usable in that scenario.

  • for the second point, there is a limit (2k characters), but ofc not to the bounds of the input box. and, I guess thats a valid point. Thanks for pointing out :). Waiting for some more suggestions from other fellow users. – user3459110 Jul 29 '14 at 11:00
5

They are not cool!

In western countries most of people read from left to right, aligning them to the left will increase the speed of people reading them thus completing their goal. There are a lot of good articles on uxmovement about this, also Luke's Werbowski book Web Form Design expalins everything you need to know about web forms...

0

I think there might be some confusion about whether it is an actual input or an action, but that's probably just visual design styles that need some tweaking.

Also, where you put the label is quite important, because when you have a lot of input fields you want people to be able to scan them easily, which is not easy to do when they are centre aligned.

Just try putting a few of them together and aligned them in the different ways and you'll see what I mean. Luke Wroblewski has already done a lot of research on form design that you can reference, but feel free to test it with your users and see for yourself.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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