8

What we should write inside "Search box"?

Blank (noting)

Search

....Search

Search here

Enter you search term

Type here.......

Or something else.

5 Answers 5

8

Definitely don't leave it blank and use the keyword "search". I'd use "Search..." or a simple "Search".

And unless your website is aimed at advanced users, I'd suggest having a separate button they can click on(usability tests are good reminders on how little people use keyboard shortcuts).

4
  • 1
    Search button is my advice also. Sep 8, 2010 at 7:58
  • 2
    And don't forget to pre-fill the search field with the last search done by the user. Nothing more annoying than type again all the search string to refine the query.
    – Hugo Cornejo
    Sep 8, 2010 at 9:41
  • I also liked the mozilla example : support.mozilla.com/en-US/search Sep 8, 2010 at 16:15
  • 1
    Separate button gets +1 filling the field with 'search' gets -100, using last query string gets +1
    – Nathan-W
    Sep 15, 2010 at 7:46
8

Placeholders usually make sense only when there’s no label associated with the input.

Don’t be afraid to use detailed placeholders, for example:

  • Search by name
  • Search by domain or keyword
  • Search events
  • Search history
  • Search inbox
  • Search programs and files
  • etc

…but “Search” is normally sufficient. Or leave it blank and use the wording “Search” on submit button.

Google on the other hand does not need a placeholder – it’s obvious. Google wants to keep his front page dead simple and UI noise minimal.

5
  • 1
    I'd add to that with "be sure that the text inside is not there when user starts to type". Also feel you should always use a label or at least a title attribute for accessibility.
    – Susan R
    Sep 7, 2010 at 23:38
  • @Susan R- Yes that i have. I did it with javascript. Sep 8, 2010 at 2:17
  • If you are coding your site correctly you ill have a label associated with all form input fields. It's part of the HTML standard and required for w3c accessibility compliance. If you really ,jst include a pre filled string of "search" use JavaScript to populate the value as well as remove it. If users have js blocked or turned off, the field is not cluttered.
    – Nathan-W
    Sep 15, 2010 at 7:44
  • @_Nathan_W_ It is OK to use title attribute to identify form controls when the label element cannot be used. See the WCAG 2.0 technique: w3.org/TR/WCAG-TECHS/H65.html
    – Taimar Teetlok
    Sep 15, 2010 at 18:29
  • Better yet: Use an actual label but position it inside the box.
    – DA01
    Dec 9, 2010 at 18:10
6

Nothing. Put your prompts and hints next to the text box. It takes very little additional space and can still be seen quickly enough. It would take a pretty extreme case to justify putting prompts in text boxes. Its downside:

Some designers change the style of the prompt text to try to make it look distinct from actual input, but there is no clear appearance that says “this is not a filled field.” Some use gray text, but that may make users think the field is disabled, so they don’t even try to use it.

And you have to make sure your code is right so the prompt clears and it never becomes part of the Search criteria. At the same time you must never clear input by the user or else they can’t tweak a search that didn’t work well enough.

It’s more trouble than it’s worth.

And seriously, the incredibly vast majority of users know a text box when they see one. They don’t need to be told “Type Here” or “Enter your search term.” That’s just clutter.

1
  • Amen. a-men. Simple is always better.
    – Nathan-W
    Sep 15, 2010 at 7:48
2

+1 for what both Zoltan and Taimar said - please don't leave it blank.

However, whatever you put in the search box, please make sure that the text disappears when search terms are entered. Please note that I'm not JUST talking about when the user types into the search box, but also when the user drags text into the search box.

1
  • +1 for giving an example of additional trouble with trying to clear and restore the text box. Pasting with context-menu and mouse is another example. Sep 21, 2010 at 23:25
1

Working on something similar at the moment. In my case, I have dropdown beside the search box that lets you switch between foosite and google. It defaults to "Search Foosite..." and when you change the select, the search input value changes to "Search Google...".

In either case, the text disappears when you focus on the search input.

Not 100% sure if this is the best way to do it though. Kind of just going on my own experience.

Also, I decided not to include a 'Search' button, seeing as most search boxes these days omit it in favour of the user just pressing enter to submit the form/do a GET.

1
  • Hope you're making sure your "get" meets accessibility and is obvious for usability... and that your users are all advanced enough to figure out.
    – Susan R
    Sep 8, 2010 at 13:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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