All page notices are displayed in line, fixed to the top of the primary content area of the given page.

All notices appear as soon as the page loads. They should remain dismissable either with an actual dismiss or by completing the action listed. All notices (except for critical) should permanently disappear once they’ve been dismissed.

Critical notices will disappear when dismissed, but only for that session. If the action has not been completed, the notice will reappear on the next page load.

Don'tforce notices to persist without the ability to dismiss.

Doinclude a way for users to remove the notice.

Space is at a premium when designing notices for mobile devices so be considerate of the message length within a notice.

Every notice provides a certain type of feedback, emphasized by a color and feedback icon.

Don'tinterchange feedback colors and icons.

Domatch feedback to the message type.

Every critical notice should include an action to help the user solve their issue. The action itself is optional on all other notices. Just be sure to weigh the value it may (or may not) add.

A notice is always positioned beneath the navbar within the primary content area of the given page. It should span the full width of the page until the natural max-width is achieved.

Don'tposition a page notice above a sidebar or side panel.

Dokeep a notice in line with the primary content area.

Notices follow our non-label text guidelines—use sentence case with appropriate punctuation.

Don'tuse crazy punctuation to level up the message.

Douse complete sentences followed by periods.

Make the content readable and don’t go overboard. Keep it brief with the most important info at the front, ideally less than 200 characters.

Don'toverwhelm the user with unnecessary information.

Dokeep the message short and to the point.

Titles should be concise with keywords at the front. The content should relate directly to the action they’d need to take.

Don'texplain the entire message in the title.

Dofocus on the most important info.

Try limiting actions to a single verb. If you can’t, stick to a three-word phrase.

Don'tmake button labels complete sentences.

Dokeep things simple with a single verb.

See our full accessibility audit for more information about these results.