1. Enlarge your search box! Why are you hiding it ? Screenshot: TMZ.com  My favorite search box: 2. Make your search button big and clickable. Screenshot: CNN.com (Edited. CNN uses the correct version) 4. Use colors common to your users! Screenshot: google.com

5 quick fixes for non-designers who want to enhance their search results page:

1. Enlarge your search box. Almost every second site I see, internal or external, “hides” their search box – maybe because designers think they’re ugly. If you want your people to search: make it easy. I like to add a little gradient on the top of the search box, and to make the corners round. That makes it look inviting to write in.
2. Make your search button big and clickable. Make sure the search-button is as tall as your search box, but make it come out of the page, with a clear color or an embossment. The goal is not to make it look cheesy… but to make it look clickable.
3. Use already designed material as an inspiration. Make sure that your search results, and the rest of the website for that matter, matches your company brand identity or design hand book. Use the correct colors and fonts – they are probably thought through by a designer already.
4. Use colors familiar to your users. - Blue is for links – Green is for URLs etc. telling visitors where the result came from – Red is for alerts and error messages If your brand identity doesn’t have hex-codes for these colors … ask your designer or design partner for then. Kindly.
5. Enlarge your body text size. Many designers tend to user small text in their sketches … maybe to get more room for nice pictures? Your users are probably interested in the result when they are searching, so why don’t we make the text readable. A nice size for a readable body text is 14 og 15px, with a line-height of 17/18 px. Not 12 px Arial…

And a general tip: Don’t try to reinvent the wheel! When working with search design, see how Google, Amazon and Bing format their URLs, links, file type-icons, etc. and make your version of it. Surely you can try another way, but then you should also user test it properly before you launch it.

What are your suggestions to improve search design?

First of all: How do we define the term logical design? By logical design we mean graphic design with the user in focus: Design inspired by interaction design that takes the seriously principals of usability seriously – both on screen and paper.

If we say that design is “art”, we can define logical design as “crafts”. Attractive things that at the same time has a purpose, and that is like it is for a reason.

Logical design on a CD leaflet means the design that instantly tells the audience what kind of music they can expect when pressing play. Logical design on a website makes it a no-brainer for the customer to click the right places (thereby enhancing the call-to-action), what is clickable and so on. Logical design on a brand identity is the design that to the greatest extent possible enhances the brand values, without extra confusing visual elements.

But the challenge appears when our customers asks for web design with “an edge” or “a website different to all other websites”. Because with web design in particular, we have our customs and principals:

• Links in blue, underlined text
• The logo at the top left corner
• Obvious clickable submit-buttons
• The main text in black on a white background
• Clear labeling of what site you’re on
• Headline on every site
• and so on …

By now you’re probably expecting me to come up with a solution of how to combine attractive design with logical design. But again I turn again my own headline: Logical design and exciting design are not opposites. Logical design, done the right way, results in happy users and happy customers, because they both can take a look at the design, and say: “Yeah, that’s just the way it should be!”

Logical design is about making good design, without breaking too many of the rules that we know work – just to appear “innovative” and different.

Take a look at a beautiful design made more logical

Examples of websites we consider both pretty and logical to us as users:

The Norwegian site of the mobile operator Telenor.

The websites of the Norwegian Travel Operator Ving

The online Annual Report of Statoil.