vanilla-framework
vanilla-framework copied to clipboard
canonical
Purpose of notification’s “p-notification__status” isn’t obvious
Pattern to amend
Visual
TBD
Context
[Expanded from #2664]
Twice this week I’ve seen the boilerplate p-notification__status text from Vanilla’s examples copied into production code where it isn’t appropriate:
- “Information: MicroStack requires at least 8 GB of RAM and a multi-core processor.”
- “Success: Thank you”
All else being equal, if it’s possible to convey something effectively with visual design, that’s better than doing it with text, because it’s quicker to comprehend.
That’s why in most component libraries — including Vanilla — an alert’s visual design conveys what kind of notification it is. That makes vague text like “Information” or “Success” an anti-pattern. Many libraries allow alerts to have headings, but they do not use headings for that purpose.
What should happen:
- In Vanilla’s code examples,
<span class="p-notification__status">should not contain “Warning:”, “Error:”, “Success:”, or “Information:” that could be mistaken for a real suggestion. - The reference should describe when to use
p-notification__status, and what kind of text it should contain.
@bartaz @lyubomir-popov is this still relevant or can it be closed (also considering the new notification pattern coming)?
@clagom @wgx's spec contains the solution I think - but our current examples still contain the problem described in this issue. Once we update the examples to match Will's spec, this will be resolved.
In other words this is ready for development I think - the task being to update the examples to match the copy here:
Notifications pattern was updated and the "status" element was renamed to "title" which should make it purpose clear.
The renaming may help, and one of the two errant examples has been fixed. Unfortunately, one remains, and another has appeared:
(You could say this is fine, but if so, why don’t the Information and Caution variants do the same?)
It may also help for the reference to call the variants something other than “severity levels” since they aren’t really.
@matthewpaulthomas thanks for pointing this out. @bartaz can we just use what @wgx's has used in his wireframes?