Best practices for the navigation

Best practices and a heuristic evaluation can shorten your path to great test results. See our test suggestions for the navigation here.

Win on mobile: The importance of clarity

 

A/B testing suggestions for the navigation

When building digital experiences, aesthetics is often favoured over clarity and speed. But the most important factor for consumers is finding what they're looking for fast. Shift your focus to clarity in navigation and site search and customers will most likely respond positively.

Below are the answers to the question "When browsing websites on your smartphone, how important would you say each of the following are in terms of your overall experience??" Note how findability gets more responses than aesthetics:
 

Most important when using a mobile site

 

1. A/B test adding functionality to your search

Users looking for specific products usually turn to site search. And visitors who search are on average four times more likely to convert. With that in mind, it’s easy to understand why great search functionality is vital for websites.

Make life easier to valuable customers by testing these site search functions…

  • Auto-complete
  • Spelling suggestions
  • Relevancy ranking so that the first search results are the strongest
  • Alternative suggestions when no results are found
  • Previous searches are saved without log in
  • Search results can be easily scanned
  • Fold out search bar
  • Work on a list of synonyms, as “no results” will make visitors think you don’t have the product

 

2. A/B test optimising search filters

Search and product categories can deliver endless results. Speed up conversion by providing filters that allow customers to get what they want from search.

Improve your search filters by...

  • Implement advanced filtering with the ability to select several options
  • Provide sticky filters so they are easy to find
  • Usability tests can reveal the kinds of filters your customers want

 

Mango improved search by adding spelling suggestions and alternatives when no results were found. This plus a few other alterations increased the mobile conversion rate by 4.5%.

Read the complete success story here.
 

Mango case with improved search

 

3. A/B test folding out a search bar instead of only having a search icon

Since visitors who search often convert more often it's important to give them easy access to the search feature. Test folding out a search bar to increase visibility.

 

Success story

Lyst replaced a search icon with a search bar in the header and increased usage by 13%.

Read the complete success story here.
 

Lyst case with folded out search bar

 

4. A/B test reducing text and increasing clarity with bullet lists, subheadings and icons

Findability is also increased by creating strong clarity and information hierarchy on the site.

Most consumers don’t read web pages — they scan and connect words with icons and images. Test replacing large paragraphs of text with easily digestible icons, bullets lists and imagery.

  • Remove all unnecessary words
  • Use bullet lists to improve clarity
  • Use clear headings and subheadings
  • Use icons to get your message across
     

Ways to reduce text walls

Clarity in web design

 

5. A/B test removing automated sliders

Images can take a long time to load, so a slider with several images risk making visitors stare at a blank screen. It's also difficult to read messaging on a slide – further reducing clarity.
 

Reasons not to use sliders

 

6. A/B test adding labels to icons

Don’t take it for granted that everybody will understand the icons in your site’s header. Test adding labels to the most important icons.
 

Labeled icons

 

Success story

The design history of Google Translate shows how icons may need labels to become clear. The Google Translate team noticed this during research interviews as people were asking for features that already existed – the camera translation and real-time conversation modes. This was confirmed by running a survey which showed 38% of users not knowing of these tools. 

The team tested labeling the icons and the result was that usage of all features increased across the board, with the handwriting being used as much as 25% more than it was before! 

Read the complete success story here.

 

Google case showing the power of labels under icons

 

Next step

See the heuristic evaluation of category and product pages.

 

 

Set up test in Optimize

About Optimize

  • Easy to set up

  • Uses the full power of Google Analytics

  • Free version available – get started today

 

Was this helpful?
How can we improve it?