Skip to main content

Results pages

A webpage that displays results is a dynamic interface designed to present users with outcomes, findings, or data in a clear and organized manner.

Typically, a webpage displaying results features a structured layout that allows users to quickly scan and comprehend the presented data.

Note: In some cases the height of the content is smaller than the height of the viewport especially in desktop screens. As a result, the footer of the page will stick to the middle of the screen which is not ideal for the user experience. To fix that, you can use the .govgr-layout--full-height CSS utility class combined with .govgr-layout.

About this pattern

This pattern presents a set of search results which may appear over multiple pages.

  • use card component in order to display each individual result
  • users can choose the page they want by picking a page number at the bottom of a search results page, starting at page 1
  • each individual page contains 10 search results
  • the page number the user is on is always highlighted
  • any links to related search terms may appear at the end

When there are no results found

If a user has searched for something and there are no results to display, display a "Results not found" message instead.

Figma Reference

Find more information regarding this Pattern in Figma Community File


We'd love your feedback
Was this helpful?