Web Design: Logo & Search Bar

In the previous article Web Design: Find the elements of a website several elements of a webpage have been discussed. Both contents and the navigation system (menu) have been described. The focus of this article will be on the integral elements of a webpage which tell the user where they are at the moment and help them get to an interesting content quickly. Thus, this article will be devoted mainly to a logo and a search bar.

Logo

Jacob Nielsen’s publications state that the most common practice is to link logo with the home page. This means that clicking on the logo will move us to the home page of the website. Although this practice seems intuitive, many web developers must take extra care to have a heading saying: “Home page” next to the logo as many users do not consider logo (webpage identification) to be a part of the navigation system. It is true that, in fact, few users know that logo will enable them to move from other pages to the home page.

There is no problem with logo’s position as a standard webpage layout puts logo in the upper left hand corner. It is interesting that even in Arabic countries, where the reading system goes from the right to the left, logo has been started to be put on the left rather than the upper right hand corner. This has been influenced by English-speaking users who more and more often have come to Arabic websites looking for information.

Example for Logos

What Should Logo Look Like

It must be remembered that logo is a sign identifying a company or a product. It appears not only on a website but also on business cards, envelops, leaflets and web advertisements. It is important that the logo should give a uniform and consistent representation of the company. This means that if, for example, we advertise a cottage in the mountains for rent, it is best if we use motifs associated with that: e.g. mountains or a cottage with a chimney and smoke coming out of it. Colours, shapes and font used to create a logo should constitute a uniform whole and make an integrated, easy to remember picture. Logo on a web page should be in a reasonably noticeable size. The basic principle is that the simpler the logo is, the better it is to remember and evoke appropriate associations.

You will find more about logo in our article entitled Logo Design.

Search Bar 

Example for Search Box

Many users reach useful information through Google search engine. Google enables web designers to place a search box (Google Site Search) on their web page giving them a ready-made source code of the search bar, which they can take from Google Web Elements. Users then may search either a given web page or a global Google site.

Usually the search bar is placed in the right hand side of the page and it is simple to use. Users enter a search term into a box and confirm it by pressing the Return/Enter key. A new functionality of the search bar is called autosuggest and it fills the search box with suggestions connected with a given search term (for instance, if we start entering: devel in the search box, the automated suggestion will probably be: development).

Placing a search bar on a web page enables the users to look through the content of the whole website and to find the information they need. Instead of creating your own, often inaccurate search bar, which may burden the web server, the developers can now use Google search bar and insert it onto their own pages. The basic configuration takes about 15 minutes and does not require any programming.

Ask your web developer for more information or contact us if you need any help with preparing a professional website.