New This website is new, your feedback will help us to improve it.

Page not found page

Overview

Use this page pattern where a page can't be found. This pattern should be shown for 404 Not Found errors.

Page patterns represent complete pages that should be used with few changes to promote consistency.

This pattern is based on the page not found pattern from the Government Digital Service (GDS) Design System.

Uses

Use this pattern when the user:

  • selects a link or button that takes them to a page that does not exist
  • types or copies a web address for a page that does not exist
  • types or copies a web address incorrectly

When using this pattern, do not:

  • blame the user or use red (danger) text
  • use technical jargon like '404' or 'resource not found', use 'page'
  • use informal or humourous words like 'oops'

Where known, include an email address for, or link to information on, a team that can provide information on the service. If there isn't a contact for a service, use the BAS IT Service Desk.

Variants

Basic

Create a page element containing:

  • a page title of 'Page not found - [website or application]'
  • a 'Page not found' as a h1 header
  • contact information

The <head> information in this example is greatly simplified and only shows the title directive. Extra lines are used to show where missing tags etc should go.


Page not found

Page not found

If you typed the web address, check it is correct.

If you pasted the web address, check you copied the entire address.

If the web address is correct or you selected a link or button, contact us to let us know.

Contact the BAS IT Service Desk for more information.

<head>
  
  <title>Page not found</title>
  
<head>
<body>

<main>
  <h1>Page not found</h1>
  <hr>
  <p>If you typed the web address, check it is correct.</p>
  <p>If you pasted the web address, check you copied the entire address.</p>
  <p>If the web address is correct or you selected a link or button, <a href="mailto:servicedesk.bas.ac.uk">contact us</a> to let us know.</p>
  <p>Contact the <a href="mailto:servicedesk.bas.ac.uk">BAS IT Service Desk</a> for more information.</p>
</main>

</body>