Alerts
Objectives
The objective of an alert is to inform our customers about critical matters that may impact their access to care or their health. Alerts should provide clear, accurate, actionable information in a timely manner for the duration of relevancy.
Applications
Alerts should be used to:
- Communicate to visitors on matters that may impact their health (e.g., pandemic, extreme weather, disasters)
- Communicate delays/limits to access or any critical operational announcements (e.g., a facility closure or delay in opening)
- Announce a clinic closure or relocation
Alerts should not be used to:
- Announce the arrival or departure of providers from a clinic
- Share health-related information (e.g., promote news stories)
Note: Overuse or misuse of alerts may dilute their effectiveness and cause alert fatigue.
Type and Requirements
There are two levels of alert on the UW Medicine website:
- Sitewide – Requires approval of Senior Director of Digital Strategy. Alert content must affect most of our site’s visitors (e.g., pandemic, weather alert).
- Specific pages (e.g., locations, specialties) – Requires approval of designated content owner. May impact most of the visitors on these pages (e.g., changes to a clinic’s hours of operation).
Planning
- Alerts should be sent as a web request at a minimum of one week before the go-live date.
- For an emergency alert, please contact Kory Kuriel at koryku@uw.edu (text 206.930.2901) and Bruce Wheaton at bwheaton@uw.edu and uwmweb@uw.edu (call 206.221.1968).
- For alerts that have an impact on locations, please contact Kory Kuriel at koryku@uw.edu and Alisa Modylevsky at amodyle@uw.edu to evaluate adding the alert to Google My Business (GMB) listings.
- Requests should include clear justification, instructions, go-live date, duration of the alert (if known), and approval from the appropriate owner.
- If an alert already exists on the page, justification for the new alert and preferred order of prioritization is required.
- The Digital Experience team will provide guidelines on color, icon choice, etc.
Specifications
Two colors are available for alerts:
- Blue
- White
Blue is the recommended color for global alerts, alerts that appear on 20+ pages or alerts with high prominence/urgency. A sitewide alert can have only one subject per alert (e.g., blue alert for COVID-19)
Main: Blue alert
- 160 characters max (including spaces)
- 2 lines on web; 5 lines on mobile
Extreme: White alert (can show below the blue alert in cases of multiple crises (e.g., weather concerns during a pandemic)
- 160 characters max (including spaces)
- 2 lines on web; 5 lines on mobile.
- To be used during extreme weather conditions (snow, ice, heat, air pollution)
On-page: On-page alert will only show on a page or set of pages
- 160 characters max (including spaces)
- 2 lines on web; 5 lines on mobile.
Do’s
One global alert (blue) and one contextual alert (white) are allowed per page.
Don’ts
- Place two blue alerts on the same page
- Place two white alerts on the same page
Ability to close
Alerts may appear with or without an X to close them.
As a general rule, users should be given the option to ‘close’ alerts that are “universal” in nature, i.e. appear on 20+ pages on the site.
Users should not be given the option to close alerts that are informative and relate to a specific page.
Links
Links are allowed in the alert. The entire text string may be a link, or select words/phrases may be a link.
If there is a list of links, separate each linked phrase with the | symbol.
Linked full text string
Select phrases linked
List of links
Icons
A decorative icon is recommended to create a focal starting point for the user.
In alerts, we leverage SVG icons from the Font Awesome library for ease of implementation.
Usage guidelines
Do’s
- Alerts may appear with or without an icon.
- Decorative icons should always be placed on the left.
- Top align the icon and the close icon.
Design
Link to latest Figma design files (update in progress)
Main alert – sitewide (Web)
Main + Extreme alerts – sitewide (web)
Main + Extreme alerts – sitewide (mobile)
Main + on-page alerts (Web)
Main + on-page alerts (Mobile)
