Search bar

The Search bar helps visitors find relevant content

Guidelines

The purpose is to help the user find relevant content. And to do so in a clear and supportive way. At the bottom of the field the most searched for terms from the current page is shown. This feature is dynamic, meaning that the suggestions will be based on the page that the search field is opened on.

Usage

This search field is made to be used within the heading UI area of the web site, and not as an individual search field for use on a specific page or block.

Behaviour

The search field expands downwards once the “Search” button is pressed on the utility bar in the heading UI. The behaviour is largely unchanged regardless of viewport, but will be oriented in a diagonal fashion instead of a horizontal one.

Desktop

Mobile

Do's and don'ts

Do

  • Use this design field as the main site search, not as an individual search field for use on a specific page or block.