Help users to
-
Know that a page is up to date
Use review dates to let users know when a page was last checked and will be checked again.
Open this default know that a page is up to date example in a new tab
- HTML code for default know that a page is up to date
- Nunjucks code for default know that a page is up to date
Copy default know that a page is up to date code
Close default know that a page is up to date code
<p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-7 nhsuk-u-margin-bottom-0">
Page last reviewed: 15 March 2021<br>
Next review due: 15 March 2024
</p>
Copy default know that a page is up to date code
Close default know that a page is up to date code
<p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-7 nhsuk-u-margin-bottom-0">
Page last reviewed: 15 March 2021<br>
Next review due: 15 March 2024
</p>When to use this pattern
Use this pattern when your research shows users need to know when the whole page was last checked and when it will be checked again.
When not to use this pattern
Do not use this pattern in transactional services. We have not tested review dates in forms.
Do not use it when you change something on a page but have not reviewed the whole page.
How the pattern works
The pattern consists of 2 dates:
- when you last reviewed the page
- when you will review it again
Put whole page review dates at the bottom of the page. They are not a high priority for users looking for information.
Open this page know that a page is up to date example in a new tab
- HTML code for page know that a page is up to date
- Nunjucks code for page know that a page is up to date
Copy page know that a page is up to date code
Close page know that a page is up to date code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Design and build digital services for the NHS. Things you need to make consistent, usable services that put people first." />
<title>NHS digital service manual</title>
<link rel="stylesheet" href="/css/main.css">
<script src="/js/main.min.js" defer></script>
<!-- Cookie consent -->
<script src="/js/cookies.min.js" data-policy-url="/cookie-policy" defer></script>
<!-- Adobe Analytics -->
<!-- Verify domain with Google -->
<meta name="google-site-verification" content="Prj4LS7KX0amTkqVrOlnEyldVIjzJqbnXgPL1zbHocM" />
<link href="https://www.nhs.uk/" rel="preconnect">
<link href="https://assets.nhs.uk/" rel="preconnect" crossorigin>
<link rel="shortcut icon" href="/nhsuk-frontend/assets/favicons/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="/nhsuk-frontend/assets/favicons/apple-touch-icon-180x180.png">
<link rel="mask-icon" href="/nhsuk-frontend/assets/favicons/favicon.svg" color="#005eb8">
<link rel="icon" sizes="192x192" href="/nhsuk-frontend/assets/favicons/favicon-192x192.png">
<meta name="msapplication-TileImage" content="/nhsuk-frontend/assets/favicons/mediumtile-144x144.png">
<meta name="msapplication-TileColor" content="#005eb8">
<meta name="msapplication-square70x70logo" content="/nhsuk-frontend/assets/favicons/smalltile-70x70.png">
<meta name="msapplication-square150x150logo" content="/nhsuk-frontend/assets/favicons/mediumtile-150x150.png">
<meta name="msapplication-wide310x150logo" content="/nhsuk-frontend/assets/favicons/widetile-310x150.png">
<meta name="msapplication-square310x310logo" content="/nhsuk-frontend/assets/favicons/largetile-310x310.png">
<meta property="og:url" content="" />
<meta property="og:site_name" content="nhs.uk" />
<meta property="og:title" content="NHS digital service manual" />
<meta property="og:description" content="Design and build digital services for the NHS. Things you need to make consistent, usable services that put people first." />
<meta property="og:type" content="website" />
<meta property="og:locale" content="en_GB" />
<meta property="og:image" content="/assets/open-graph.png" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@nhsuk">
<meta name="twitter:creator" content="@nhsuk">
<meta name="twitter:image:alt" content="nhs.uk">
</head>
<body>
<script>
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
</script>
<a class="nhsuk-skip-link" href="#maincontent">Skip to main content</a>
<header class="nhsuk-header app-header__container" role="banner">
<div class="nhsuk-header__container">
<div class="nhsuk-header__logo"><a class="nhsuk-header__link nhsuk-header__link--service " href="/" aria-label="NHS digital service manual homepage">
<svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100">
<path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path>
<path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path>
</svg>
<span class="nhsuk-header__service-name">
Digital service manual
</span> </a> </div>
<div class="nhsuk-header__content" id="content-header">
<div class="nhsuk-header__search">
<div class="nhsuk-header__search-wrap" id="wrap-search">
<form class="nhsuk-header__search-form" id="search" action="/search/" method="get" role="search">
<label class="nhsuk-u-visually-hidden" for="search-field">Search the NHS website</label>
<input class="nhsuk-search__input" id="search-field" name="search-field" type="search" placeholder="Search" autocomplete="off">
<button class="nhsuk-search__submit" type="submit">
<svg class="nhsuk-icon nhsuk-icon__search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
<path d="M19.71 18.29l-4.11-4.1a7 7 0 1 0-1.41 1.41l4.1 4.11a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42zM5 10a5 5 0 1 1 5 5 5 5 0 0 1-5-5z"></path>
</svg>
<span class="nhsuk-u-visually-hidden">Search</span>
</button>
</form>
</div>
</div>
</div>
</div>
<div class="nhsuk-navigation-container">
<nav class="nhsuk-navigation" id="header-navigation" role="navigation" aria-label="Primary navigation">
<ul class="nhsuk-header__navigation-list">
<li class="nhsuk-header__navigation-item">
<a class="nhsuk-header__navigation-link" href="/service-standard">
NHS service standard
</a>
</li>
<li class="nhsuk-header__navigation-item">
<a class="nhsuk-header__navigation-link" href="/design-system">
Design system
</a>
</li>
<li class="nhsuk-header__navigation-item">
<a class="nhsuk-header__navigation-link" href="/content">
Content guide
</a>
</li>
<li class="nhsuk-header__navigation-item">
<a class="nhsuk-header__navigation-link" href="/accessibility">
Accessibility
</a>
</li>
<li class="nhsuk-header__navigation-item">
<a class="nhsuk-header__navigation-link" href="/community-and-contribution">
Community and contribution
</a>
</li>
<li class="nhsuk-header__navigation-item nhsuk-header__navigation-item--home">
<a class="nhsuk-header__navigation-link" href="/">
Home
</a>
</li>
<li class="nhsuk-mobile-menu-container">
<button class="nhsuk-header__menu-toggle nhsuk-header__navigation-link" id="toggle-menu" aria-expanded="false">
<span class="nhsuk-u-visually-hidden">Browse</span>
More
<svg class="nhsuk-icon nhsuk-icon__chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
<path d="M15.5 12a1 1 0 0 1-.29.71l-5 5a1 1 0 0 1-1.42-1.42l4.3-4.29-4.3-4.29a1 1 0 0 1 1.42-1.42l5 5a1 1 0 0 1 .29.71z"></path>
</svg>
</button>
</li>
</ul>
</nav>
</div>
</header>
<div class="nhsuk-width-container app-width-container">
<nav class="nhsuk-breadcrumb app-breadcrumb" aria-label="Breadcrumb">
<ol class="nhsuk-breadcrumb__list">
<li class="nhsuk-breadcrumb__item"><a class="nhsuk-breadcrumb__link" href="/">Home</a></li>
</ol>
<p class="nhsuk-breadcrumb__back">
<a class="nhsuk-breadcrumb__backlink" href="/">
<span class="nhsuk-u-visually-hidden">Back to </span>
Home
</a>
</p>
</nav>
<main class="nhsuk-main-wrapper nhsuk-main-wrapper--s app-main-wrapper" id="maincontent" role="main">
<div class="nhsuk-grid-row">
<div class="nhsuk-grid-column-full app-component-reading-width">
<div class="app-pane">
<div class="app-pane__side-bar">
<nav class="app-side-nav"></nav>
</div>
<div class="app-pane__main-content">
<h1 class="app-page-heading"> <span class="nhsuk-caption-xl">
<span class="nhsuk-u-visually-hidden"> - </span>
</span>
<div> </div>
</h1>
<p class="nhsuk-lede-text app-lede-text"></p>
</div>
</div>
</div>
</div>
</main>
</div>
<footer role="contentinfo">
<div class="app-footer__container nhsuk-footer-container">
<div class="nhsuk-width-container">
<h2 class="nhsuk-u-visually-hidden">Support links</h2>
<ul class="nhsuk-footer__list">
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/accessibility-statement">Accessibility statement</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/cookie-policy">Cookie policy</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/get-in-touch">Get in touch</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/service-manual-team">Service manual team</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/site-map">Site map</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/terms-and-conditions">Terms and conditions</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/whats-new">What's new</a></li>
<li class="nhsuk-footer__list-item nhsuk-footer-default__list-item"><a class="nhsuk-footer__list-item-link" href="/your-privacy">Your privacy</a></li>
</ul>
<div>
<p class="nhsuk-footer__copyright">© NHS England</p>
</div>
</div>
</div>
<div class="app-ogl-footer">
<div class="nhsuk-width-container app-width-container">
<p class="app-ogl-footer--text">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 483.2 195.7" height="17" width="41" focusable="false">
<path fill="currentColor" d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145"></path>
</svg>
All content is available under the <a class="nhsuk-footer__list-item-link" href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/" rel="license">Open Government Licence v3.0</a>, except where otherwise stated.
</p>
</div>
</div>
</footer>
</body>
</html>
Copy page know that a page is up to date code
Close page know that a page is up to date code
{% from 'breadcrumb/macro.njk' import breadcrumb %}
{% block pageTitle %}
Content page template
{% endblock %}
{% block beforeContent %}
{{ breadcrumb({
items: [
{
href: "#",
text: "Home"
}
],
href: "#",
text: "Health A-Z"
}) }}
{% endblock %}
{% block header %}
{{ header({
showNav: "true",
showSearch: "true",
primaryLinks: [
{
url : "#",
label : "Health A-Z"
},
{
url : '#',
label : 'Live Well'
},
{
url : '#',
label : 'Care and support'
},
{
url : '#',
label : 'Pregnancy'
},
{
url : '#',
label : 'NHS services'
}
]
})
}}
{% endblock %}
{% block content %}
<div class="nhsuk-grid-row">
<div class="nhsuk-grid-column-two-thirds">
<h1>
Page heading
</h1>
<p>Health information goes here.</p>
<p class="nhsuk-body-s nhsuk-u-secondary-text-color nhsuk-u-margin-top-7 nhsuk-u-margin-bottom-0">
Page last reviewed: 15 March 2021<br>
Next review due: 15 March 2024
</p>
</div>
</div>
{% endblock %}
{% block footer %}
{{ footer({
links: [
{
URL: "#",
label: "NHS sites"
},
{
URL: "#",
label: "About us"
},
{
URL: "#",
label: "Contact us"
},
{
URL: "#",
label: "Profile editor login"
},
{
URL: "#",
label: "Site map"
},
{
URL: "#",
label: "Accessibility statement"
},
{
URL: "#",
label: "Our policies"
},
{
URL: "#",
label: "Cookies"
}
]
})}}
{% endblock %}Embedded content, such as videos
Review dates for embedded content should sit close to the content they relate to. Include the last reviewed date (usually the production date) and next review date in the component that holds the embedded content. This is in addition to the page review date.
For example:
The review process
A page review involves reviewing the whole page to check that it is still accurate and up to date. Whole page reviews should be part of a planned content lifecycle where you create, then update or delete outdated content.
Depending on the content, this may involve checking it with a clinician or other subject matter expert. It also involves, for example, considering any user feedback and checking for broken links or accessibility issues.
For health content, it means reviewing the clinical evidence to make sure that the page is up to date. If there are changes to clinical content, a clinician must sign them off. Read more about making your service clinically safe.
The NHS website (nhs.uk) uses review dates on every page of health content as part of the work to meet the standard for creating health content, but not on campaign content.
Research
We tested review dates on a health information page in summer 2018.
At first we tested them away from the main content, closer to the footer of the page, separated by a rule, but users didn't notice them there. So we removed the rule and brought the dates closer to the content. Users then read them and said that they were helpful.
We have not tested review dates in transactional services and do not recommend using them. If you use a review date in a transactional service, please test it with users and let us know what you find.
Letting users know about content updates
Some teams find their users want to know if information has changed since the page was last reviewed or when there is an important update.
People who use the service manual and design system, for example, find it helpful to know when information on a page was last updated. We’re using an experimental "Updated" pattern on service manual pages to let users know when we’ve updated something on a page.
Please share any findings you have about telling users about content updates on GitHub. We’ll share our research findings there.
Help us improve this guidance
Share insights or feedback and take part in the discussion. We use GitHub as a collaboration space. All the information on it is open to the public.
Read more about how to feedback or share insights.
If you have any questions, get in touch with the service manual team.
Updated: July 2022