Standalone (previous font sizes)

Heading X

Heading X

With content the same size between each heading (previous font sizes)

Providing context

• Back to top
• Link to this section

Conveying context without colours or icons

• Back to top
• Link to this section

Relying on colour or icons alone to indicate the meaning or context of an action or notice is bad practice. This information cannot is inaccessible to colour-blind users for example, or those using assistive technologies – such as screen readers.

Instead, efforts should be made to ensure that the context is either obvious from the content itself, or is included in an alternative form, such as with the .bsk-visually-hidden class.

Ideally contextual colours and icons should only be needed for reinforcing meaning that is already present in text or other markup.

Standalone (GDS font sizes)

Heading X

Heading X

With content the same size between each heading (GDS font sizes)

Providing context

• Back to top
• Link to this section

Conveying context without colours or icons

• Back to top
• Link to this section

Relying on colour or icons alone to indicate the meaning or context of an action or notice is bad practice. This information cannot is inaccessible to colour-blind users for example, or those using assistive technologies – such as screen readers.

Instead, efforts should be made to ensure that the context is either obvious from the content itself, or is included in an alternative form, such as with the .bsk-visually-hidden class.

Ideally contextual colours and icons should only be needed for reinforcing meaning that is already present in text or other markup.

Standalone (New font sizes)

Heading X

Heading X

With content the same size between each heading (New font sizes)

Providing context

• Back to top
• Link to this section

Conveying context without colours or icons

• Back to top
• Link to this section

Relying on colour or icons alone to indicate the meaning or context of an action or notice is bad practice. This information cannot is inaccessible to colour-blind users for example, or those using assistive technologies – such as screen readers.

Instead, efforts should be made to ensure that the context is either obvious from the content itself, or is included in an alternative form, such as with the .bsk-visually-hidden class.

Ideally contextual colours and icons should only be needed for reinforcing meaning that is already present in text or other markup.

Notes

• This experiment was used to how the size of heading 2 and 3 elements appeared to be sutble, and if there's a way to address this
• The previous font sizes were those used in BSK version 0.3.0-alpha
• The GDS font sizes are included as a comparison
• The new/proposed font sizes were created using a 1.333 scale (perfect fourth) from a 16px pixel base