The importance of the search functionality in mobile Apps and responsive web sites

By October 10, 2017Design

The coming of mobile-first approach has marked the past three years and as we discussed in another article, in 2017 the mobile-first digital experience has become a reality since users turn to mobile devices more frequently than desktop.
For example, according to a Brightedge research, the 51% of customers use mobile devices to discover new brands and products and 57% of research now are made on mobile devices and 43% on desktop.
The more products are searchable, the bigger is the possibility to succeed in selling them expanding my business. For that reason companies are moving to mobile developing responsive mobile sites and Apps.

What’s one of the most important features in an App or in a web site?
The search functionality for sure!
As shown by the last trends and researches, search is a fundamental activity especially for a user who uses a mobile App or a responsive website because it’s the main tool to find what he wants in the shortest time.
But, how it could be a search bar? It has to facilitate the user’s activity making it easier and faster.

Below you can find some useful tips.

If in your mobile App or your web site the search function is essential, design the layout to make it immediately visible.
A suggestion could be to place it in the middle of the page and making it visible without scrolling it.
Furthermore, remember that from a UX point of view, the user shouldn’t take any action to find what he’s searching for; so, it’s better to avoid an icon that must be clicked to let the search box appear.

Quick recognisable
If for space reason, it’s not possible to expand the tool bar, you can use an icon to make it recognisable, but be sure that it’s the most correct one, for example an icon that the user can identify immediately with the search function (e.g. a magnifying glass).

With search inputs and auto-suggestions
You have to facilitate users search activity making it easier so, a quick suggestion or a hint/tooltip in the search box could help them in understanding what they can search improving interaction.

Placed it in each page
If the search function is the most important functionality of your App or your website or if you have lots of products and content to display (e.g. for an e-commerce website or App), your search bar should be placed in each page and not only in the home. The best solution is to place it in the same position so it could be more recognisable.

Provide it where users expect
Also its positioning is important!
According to a study by A. D. Shaikh and K. Lenz, the site search engine should be placed in the upper right corner of the web page (17% of participants) or near the upper left corner (13% of participants).

Show search progress
If it’s not possible to display immediately all the search results, it could be better to add a progress indicator like a progress bar to show users that the search is in progress and to give them an indication of how much time it’ll take.

Maintain user’s query after searching
Always to facilitate user experience in searching products or content in the App/website, it’s important to respect user’s effort providing his most recent searches.

Avoid “no results”
Even if the user search has failed and there’re not matching results, it’s important to show some alternatives, for example suggesting products with a similar category.
In fact, a white page can be a frustrating experience for the user and he can decide to quite the search.

Discover the expertise of our design team!