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?
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.
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...
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.
