Classification banner
Classification banner
Introduction
Protective markings indicate the level of sensitivity of classified or controlled information.
Interactive example
When to use
All apps, except public ones, require a classification banner. When multiple pieces of information require different markings, use classifications banners on each component.
Layout and placement
Place a single banner at the bottom of the viewport. The banner is always fixed and should not scroll with the page.
Content
If there is information on a single page that has multiple different classifications, display the maximum classification with the text prefix ofUP TO
.
Colour
Don’t alter or customise the
Accessibility consideration
Make sure the classification banner is the first item that is read out to people who use screen readers. Put the component at the top of the DOM/HTML.