Error pages - smbc-digital/patterns GitHub Wiki
Contents
– User needs – How it works – Status – Accessibility statement – Examples – Research into this pattern – Date added to the library – Discuss this pattern
User needs
Use this page when there is an unexpected problem with the service or a technical problem. For example:
- there is something wrong with the service
- there are internal errors
- there is an unexpected problem
- a page doesn't exist (known as a 404 error)
How it works
Error pages must have:
- a meaningful H1 explaining the error, such as: ‘Sorry, there is a problem with the service’ or ‘Something went wrong’
Error pages could:
- tell the user to ‘Try again later’ if required based on the error
- provide contact information, if it exists and helps meet a user need
- provide a 'back to homepage' option – this could be presented as a link or a button depending on the error.
Contact information should either:
- provide a link to specific pages of the service if there’s a problem with the service, such as the service has gone down
- include all numbers and opening times for the service if required
- if it’s a 404 error then the information on the page would be a link to go back the homepage
Do not use:
- jargon like ‘404’
- ‘We are experiencing technical difficulties’
- red text to warn people
- breadcrumbs
- A – Z
Out of form error page (document upload)
You can use this type of error page when you email a link to another form or document upload for example Stage 2 Stockport Local Fund application. This page would be shown to the user when the PIN is not recognised. The user will need to be directed to contact the service using another method such as a phone number. You need a H1 and body text as below:
H1: We're sorry, but you cannot use this form/upload your files (choose appropriate wording)
Body text: Please email/phone.... (choose appropriate wording to describe the process the user must now take as agreed with the service).
Status
Working progress
Accessibility statement
This pattern has a rating of AA.
Please see our accessibility statement.
Improvements
To make it AAA, we need to:
- Add...
Examples
Research into this pattern
For the development of this pattern, we looked closely at: GOV.UK Design System patterns - There is a problem with the service pages GOV.UK Design System patterns - Service unavailable pages GOV.UK Design System patterns - Page not found pages
Date added to the library
This pattern was added month + year