Components

Alert banners are large coloured boxes that are displayed at the top of a page, or group of pages.  They are used to draw users' attention to something and should be used with caution, for a limited time only, and not too much text. (This is because they might not be noticed if used for too long, and could be distracting for the user).

There are 4 types of alert banners:

• Announcement - green
• Minor alert - yellow
• Emergency - red
• Death of a notable person - black

When you should use an alert banner

Consider whether you need to use an alert banner for the task.  One small notice might be better suited within the body text, using inset text, rather than a banner at the top.  Banners should only be used for very temporary notices and should be scheduled to expire in a few days, or manually removed.

Rules for banners

Avoid placing more than one banner on a page. Try to keep banner text to around 240 characters or less.

Announcement

- used for general information announcements 

Minor alert

- used when you need to alert user's attention to some sort of disruption

Emergency

- used when there is serious disruption to a service (ie. phone lines are down)

Death of a notable person

- self-explanatory and only used in rare occasions