nhsuk / nhsuk-service-manual-community-backlog

This is a place for digital teams in the NHS to work together and develop the NHS digital service manual.
https://service-manual.nhs.uk/community-and-contribution
62 stars 5 forks source link

Typography #1

Open davidhunter08 opened 5 years ago

davidhunter08 commented 5 years ago

Use this issue to discuss typography in the NHS digital service manual.

devansXD commented 5 years ago

In information dense interfaces there is a need to display smaller text so users can scan efficiently, and more information can be displayed on screen. This is particularly relevant within case working and admin facing systems.

We are now in the later phase of user testing, and based on user feedback, we would like to be able to modify the text, to create a baseline of 15px;

davidhunter08 commented 5 years ago

Heading captions need to get documented in the service manual..

See original issue: https://github.com/nhsuk/nhsuk-service-manual-backlog/issues/90

davidhunter08 commented 4 years ago

https://github.com/nhsuk/nhsuk-service-manual-backlog/issues/252

davidhunter08 commented 3 years ago

Do we need guidance on using smaller headings (nhsuk-heading-l) on questions pages?

See the GOV.UK Design System heading guidance

sarawilcox commented 3 years ago

Is this on our radar? GDS visual improvements to links: https://twitter.com/GDSTeam/status/1412780948450652163?s=20?

sarawilcox commented 3 years ago

Some recent comments on the GOV.UK typography issue: https://github.com/alphagov/govuk-design-system-backlog/issues/64#issuecomment-933672304.

This is also relevant to our conversations about external links and punctuation in hint text.

sarawilcox commented 1 year ago

The NHS.UK team has done some initial reworking of the H4 heading which is very similar to H3.

sarawilcox commented 12 months ago

GOV say “In 2023 we will be reviewing and improving our typography standards to make sure they’re up-to-date and as accessible as possible for users and service teams.” (https://designnotes.blog.gov.uk/2022/12/12/making-the-gov-uk-frontend-typography-scale-more-accessible/)

In the meantime, they say: “Avoid using font sizes below 16px in your designs”.

anandamaryon1 commented 7 months ago

Comment copied from (https://github.com/nhsuk/nhsuk-frontend/issues/926#issue-2159816544).

Bug Report

What is the issue?

An accessibility audit of our site has flagged the following non-compliance with WCAG Level A: 1.4.1 Use of Colour. The contrast ratio of Links ($nhsuk-link-color) to Body Text (#212b32) is 2.26:1

WCAG Success Criterion Success Criterion 1.4.1 Use of Colour (Level A): Colour is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.

WCAG Sufficient technique G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on hover for links or controls where color alone is used to identify them

What steps are required to reproduce the issue?

Go to any site that uses links, e.g.: https://www.nhs.uk/

What was the environment where this issue occurred?

Can be observed on all desktop devices including macOS Sonoma and Windows 11.

Is there anything else you think would be useful in recreating the issue?

This is a core NHS style component; flagging this issue for your consideration

Reply from service manual team:

Hi @hiten-livi thank you for sharing your findings.

The link text is distinguished by an underline and therefore doesn't rely solely on colour to communicate that it's a link. Our link stying has been through a number of accessibility audits before and passed.

I've copied your comment over to our issue on typography styling (https://github.com/nhsuk/nhsuk-service-manual-community-backlog/issues/1) to make sure we're monitoring this.