Header

v5.0.0

Headers help users understand what the content of the page is about. They appear at the top of a page, above the main body text. They are usually styled as level (H1) headings.

Released

History
View changes
Install
npm i @gold.au/header
Tags
Requires
Contributors
  • Alex Page avatar picture
  • Petra Gulicher avatar picture
  • Julian Fleetwood avatar picture
  • Dominik Wilkowski avatar picture
  • Patrick De Young avatar picture
  • Trevor Brennan avatar picture
  • Gary Broadbent avatar picture
  • Simon Pascal Klein avatar picture
  • Hannah J. Nicdao avatar picture

Colour impairment

How the headers are viewed with various colour blindnesses

Example

Grayscale

How the headers are viewed with total colour blindness.

Example

Keyboard accessibility

How keyboard navigation works with headers.

Example

Screen readers

[link]

Australian Government Crest

Site title, Service description that could be longer

[banner]

How the header demo is described by assistive technology.

As read with macOS High Sierra VoiceOver.

Related components

Feedback