http://kb.perpendicularangel.com/index.php?title=Error_Messages&feed=atom&action=historyError Messages - Revision history2024-03-29T14:45:46ZRevision history for this page on the wikiMediaWiki 1.37.1http://kb.perpendicularangel.com/index.php?title=Error_Messages&diff=3254&oldid=prevKirabug at 00:12, 10 June 20212021-06-10T00:12:11Z<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 17:12, 9 June 2021</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l4">Line 4:</td>
<td colspan="2" class="diff-lineno">Line 4:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>==TL;DR==</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>==TL;DR==</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Error messages can occur at four levels of the application:</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>Error messages can occur at four levels of the application:</div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>* Field-level<del style="font-weight: bold; text-decoration: none;">, in a form</del></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>* <ins style="font-weight: bold; text-decoration: none;">[[</ins>Field-level <ins style="font-weight: bold; text-decoration: none;">validation and error messaging]]</ins></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Page level, when validating a form</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Page level, when validating a form</div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Submit / system processing level, when validating a form</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* Submit / system processing level, when validating a form</div></td></tr>
</table>Kirabughttp://kb.perpendicularangel.com/index.php?title=Error_Messages&diff=3253&oldid=prevKirabug: Created page with "Error messaging patterns are the patterns we use to tell a user that they can’t move forward in their current task because of the state of the system. The goal of error me..."2021-06-09T22:35:07Z<p>Created page with "Error messaging patterns are the patterns we use to tell a user that they can’t move forward in their current task because of the state of the system. The goal of error me..."</p>
<p><b>New page</b></p><div>Error messaging patterns are the patterns we use to tell a user that they can’t move forward in their current task because of the state of the system. <br />
<br />
The goal of error messaging patterns is not to ensure that we prevent errors, (that’s a different set of patterns) but that when errors occur, the user can recover as quickly as possible to move forward. <br />
==TL;DR==<br />
Error messages can occur at four levels of the application:<br />
* Field-level, in a form<br />
* Page level, when validating a form<br />
* Submit / system processing level, when validating a form<br />
* System flat out quit, no user action caused the problem<br />
Each of these scenarios requires a different form of treatment due to the causes and contexts of the errors. <br />
==Pattern description==<br />
This is a parent page for multiple error messaging patterns. <br />
===Why this is important===<br />
By providing consistent error messaging we:<br />
* Increase the user’s confidence in our applications<br />
* Increase the user’s confidence in their ability to use our applications<br />
* Ensure higher efficiency of using the system (because the user isn’t slowed down by poor messaging or confusion)<br />
* Build trust in users that we know what we’re doing and are transparent about it<br />
===Use when…===<br />
* Error messages are only used for “hard stop” scenarios. <br />
===Do not use when…===<br />
* If the user can proceed but possibly shouldn’t, use a warning. <br />
* If the user can proceed and you have additional information for them, use an info message.<br />
==Additional Resources==<br />
[[Accessible Error Handling]]<br />
<br />
[[Category:Design]]</div>Kirabug