Page templates

Complete pages, not pieces. Copy one, replace the words, keep the structure. Each is a single HTML file with the stylesheets from the CDN and nothing else to install.

Every template is tested with axe and the touch-target check as a whole page, in every country pack. Preview a country at the top of this site and the templates follow it.

• Service home: the department front page. A hero with one action, one alert, popular services as cards, news, contact.
• Start page: what the service is, what you need, the start button. The page search engines land on.
• Question page: one question per page, the question as the heading, a back link, Continue.
• Check your answers: a summary list with change links, a declaration, Accept and send.
• Confirmation: the reference number in a panel, what happens next, how to get help.
• Service problem: the page to show when the service is down. Says what to do instead.
• Event: one event's page. The date block, when and where as a summary list beside the flyer, what it is, how to take part, a calendar file, and who to ask.
• Video: one video's page. The player that loads when pressed, the transcript, what it covers, and more videos as cards.

How to use one

1. Open the template and view its source, or take the file from site/templates in the repository.
2. Change the pack link from ng.min.css to your country.
3. Replace the organisation name, the navigation and the footer links once; they are the same on every page.
4. Replace the content. Keep the headings in order and the main landmark where it is.

The journey

The templates link to each other in the order a person meets them: home, start, question, check your answers, confirmation. The service problem page can replace any step. A real service repeats the question page once per question, and the errors pattern covers what happens when an answer is missing.