Interface More detail D · Everyday or special-use name

Alert, Banner & Notification — Learning Bundle

This learning bundle compares three kinds of feedback. An alert tells an important state. A banner stretches across an area. A notification goes into a stream people can check later. The bundle is not one standard status pattern.

Try an example
You might call it feedback-pattern learning bundlealert banner notification comparisonstatus-message lesson

Try an example

A real example

A service outage banner stays at the top of the app. A billing notification also goes to the notification center.

Main parts

  1. 01State signal
  2. 02Human-readable message
  3. 03Timing or progress
  4. 04Recovery path

Use it when

Choose a pattern that fits the message's urgency, duration, destination, and affected area.

Do not use it when

Never stack several banners that are all equally loud or use alerts for a normal success.

Name used in code

role="alert" / notification center

Before you ship

Check that every member concept has its own name and link. Show all members in the same situation. Give a visible rule for when each one applies and which groups are valid. Never present the bundle as one canonical pattern or as parts that can be swapped freely.

Request you can copy

Outcome: Use Alert, Banner & Notification — Learning Bundle to compare its member concepts. Keep their boundaries clear, then decide which members apply and which can work together. User context: A service outage banner stays at the top of the app. A billing notification also goes to the notification center. Learning bundle to unpack: Alert, Banner & Notification — Learning Bundle. Canonical members: Alert, Banner Landmark, Web Notification Why this comparison helps: Choose a pattern that fits the message's urgency, duration, destination, and affected area. Do not treat the bundle as one pattern when: Never stack several banners that are all equally loud or use alerts for a normal success. Comparison requirements: Name every member concept on its own. Explain its job and limits. Show every member in the same real situation. Give a visible sign for when to use, combine, or leave out each member. Decision quality: Keep platform and evidence limits clear. Show which members can work together. Point out false matches, unsafe swaps, and cases that need another concept. Acceptance criteria: A reader can explain each member in one sentence and tell them apart in the example. They can defend the chosen member or valid group and open every canonical guide. Evidence and limits (evidence boundary): This is not a normative standard. Its name, limits, and expected behavior can change from one source to another. Unknowns to confirm: Target platform, decision setting, limits, and evidence needed to use, combine, or leave out members.

Check this request

Review the current use of Alert, Banner & Notification — Learning Bundle. Definition: This learning bundle compares three kinds of feedback. An alert tells an important state. A banner stretches across an area. A notification goes into a stream people can check later. The bundle is not one standard status pattern. Release checks: Check that every member concept has its own name and link. Show all members in the same situation. Give a visible rule for when each one applies and which groups are valid. Never present the bundle as one canonical pattern or as parts that can be swapped freely. Before changing code, report the evidence you found, gaps, severity, and the smallest safe fix.

D
How official is this term?

Everyday or special-use name

This may be an everyday or old name, a name used by one company, or a Vibulary category. Sources may support practice or limitations, but they may not define the name.

This is not a normative standard. Its name, limits, and expected behavior can change from one source to another.

Scope
Editorial bundle of distinct alert, banner, and notification terms
Document status
stable
Checked on
2026-07-30

Evidence sources & scope

Authority source · W3C WAI · stable Alert Pattern Scope: Non-normative accessible alert guidance Role here: Helpful background, not a definition Source covers: canonical name, definition, interaction, keyboard behavior, accessibility Authority source · W3C WAI · stable Understanding Success Criterion 4.1.3: Status Messages Scope: Explanation and techniques for programmatic status messages Role here: Helpful background, not a definition Source covers: accessibility, usage guidance, avoidance guidance Authority source · GOV.UK Design System · stable Notification banner Scope: GOV.UK success notification pattern Role here: Helpful background, not a definition Source covers: canonical name, definition, interaction, keyboard behavior, accessibility

Copy it yourself

The browser could not copy this. Select the request below and copy it yourself.