Heading sizes

All HTML standard heading levels are supported by the headings component when used with in .au-body with the body component.

H1 does not use the largest font-size provided by the system xxxl as that size is intended for large promotions or splash-sections and is too large to be used in normal body copy.

Note: H1 and H6 are now supported. Previous versions of the system styled theses headings in the same way as H4, which caused confusion.

Helper classes

Classes and the SCSS fontgrid mixin are provided to help separate semantic meaning from visual appearance in order to better support WCAG2.0 Criterion 1.3.2.

1.3.2 Meaningful Sequence: When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined. (Level A)

This means developers using the design system can continue to use the correct heading level for the page structure while retaining a style that doesn't interfere with visual comprehension. For example, having a H2 in a sidebar that look as small as a H4.