Back link

[bencullimore]

Use this issue to discuss back links in the NHS digital service manual

[devansXD]

An example from eRS

[chrisadesign]

because screen reader users were confused when they landed on a page and were immediately told to go back.

Could this be becuase the back link is being added to the top of the main tag? Unlike the GOV.UK question pages that put it above in the beforeContent area?

[samanthasaw]

In the NHS App we use back links to help users go back links to help users go back to the previous page in a transactional journey so that the user can:

• select a different option to one they previously chose

• change their response to a question

• return to the journey after seeing a temporary error message

NHS App back link rules

On native, display a "< Back" link below the blue bar:

On the browser version, display a "Back" link at the bottom of the body content:

On the browser version, for screen widths less than 640px, the "Back" link in the body content persists while the breadcrumb changes to "Back to ":

Do not use a back link:

• on the first page of a transactional journey

• on a hub page when the parent page is the home page

• for an error message that effectively ends the user journey

For confirmation pages:

• on native, don't display "< Back"

• use "Back to " at the bottom of the body content on both native and the browser version

Research findings: We have observed users successfully using back links.

3 July 2019: Users had no issues with the back links within the NHS App.

However, users got lost when they went to NHS.UK content pages via the app, such as the NHS Symptom Checker, FAQs and Login (Account). Users did not understand where they were or how to get back to the NHS App.

Some users found the ‘Done’ or ‘X’ CTA but most were stuck and unable to return to the App.

“I don’t know why I left the App to change my account settings, and I can’t get back.”

“How do you go back on this?”

24 July 2019: Users who reached the prescriptions order confirmation page could navigate back through their actions and this caused further confusion. It wasn’t clear if the [prescription] order had been placed or if they could change it and order it again.

[davidhunter08]

Reported issue in the frontend for the SVG icon not scaling when you increase the font size

[sarawilcox]

Hi, we’re prepping an update to the nhsuk-frontend which will include an addition to the back link component to allow it to function as a button (for example, in transactional services) as well as a link. It’ll look the same but the nunjucks macros in the frontend will generate a button when instructed.

We’ll include a coded example in the design system page about the back link component.

If you have any comments ahead of release, please let us know.

It'll look like this.

[sarawilcox]

Do we want to add to our guidance this bit of info from the GOV.UK page?

"Using the default link text (‘Back’) is ideal for services with a simple journey.. [where users only] ever go back to the previous page in the service."

"For more complex user journeys, consider using different link text, like ‘Go back to [page]’. For example, [go back to results page].... In this case, if you used ‘Back’, it might not be clear to users what they are going back to."

Example from NHS.UK blood pressure tool - not yet released.

[frankieroberto]

@sarawilcox is the "Go" in the suggested "Go back" text significant? I think in the GOV.UK Design System it’s always been just "Back". Did NHS add the "Go" for any reason?

Whilst the GOVUK Design System does say "For more complex user journeys, consider using different link text, like ‘Go back to [page]’", when I’ve followed that pattern I’ve not had "Go" there either (so just "Back to [page]").

Suspect the presence or absence of "Go" doesn't make a difference either way, but I’m happy to be wrong if there’s any research on this!

[sarawilcox]

I'm afraid I don't know. I don't know whether @davidhunter08 remembers?

[adelineleonPD]

The styling for breadcrumbs and back links differ. Breadcrumbs are underlined, whilst Back links are not. What is the reason for this?

In the GOV service manual, both the breadcrumb and back link components are underlined as default. https://design-system.service.gov.uk/components/back-link/

[vickytnz]

I'm afraid I don't know. I don't know whether @davidhunter08 remembers?

I've also been equally confused in that there is inconsistency across the prototype kit examples and design system or systems, is it 'Go back' or 'Back'? It is is 'Go back' on the web and 'Back' on the app it would be helpful that this is explicitly said somewhere since without it I can't tell what to baseline against.