Misleading Icon used on form validation errors

We already use an exclamation mark for another message level.

• Cross in circle (red): Error.
• Exclamation mark in triangle (yellow): Warning.
• Tick (green): Status OK.

These icons are not limited to form validation, or even to message boxes. They are also used by the Status Report, Available Updates, and Recent Log Messages pages.

If we make any changes, we should consider the entire set. For accessibility, they must all have distinct shapes.

Thank you for sharing your idea for improving Drupal.

We are working to decide if this proposal meets the Criteria for evaluating proposed changes. There hasn't been any discussion here for over 8 years which suggests that this has either been implemented or there is no community support. Your thoughts on this will allow a decision to be made.

Since we need more information to move forward with this issue, the status is now Postponed (maintainer needs more info). If we don't receive additional information to help with the issue, it may be closed after three months.

Thanks!

This issue came up in the UX meeting in the discussion of #2848507: Indicate that grouping elements have child element errors for ux and a11y, and they underscored the need for consistency as well as a better "error" icon for that issue.

If I understand correctly the general concept is still relevant, but the details have changed.

Invalid form fields don't have any icon next to them.

In Default Admin, Claro and Olivero, the error blocks at the top of the page use a cross out icon.

The status page still uses a red circle with a white "X" in Claro. In Default Admin, it uses the cross out icon.

Suggestion for a new error icon

Red circle containing an exclamation mark. It's distinguished from a warning icon by the shape and color.

Here's a very rough example modified from an existing icon in core. IMO outline icons would be better for some uses.

Going out on a limb and reopening. The UX team commented in #2848507-212: Indicate that grouping elements have child element errors for ux and a11y (emphasis mine):

The group was in line with the comment in#189. The association one has looking at a prohibition sign is not necessarily that of an error. Aside that, it also has to be noted that /admin/reports/status is using a different kind of icon for the error state - the iconography should be consistent across the entire admin UI, otherwise it creates ambiguity and increases the cognitive load.

The iconography used across the Drupal admin interface for errors, warnings and informational states on /admin/reports/status, admin messages, and on for example errors on this issue should be consistent. The easiest fix for the error state, instead of using the prohibition sign is to simply use the "x" icon used on the status reports page for error admin messages and errors on parent elements as well.

But, the problem is that the prohibition sign in the error summary block at the top of the page is preexisting. I'm not sure that we can decide to change it in #2848507: Indicate that grouping elements have child element errors for ux and a11y.

Also, for Default Admin, we can't just switch to the icon used on the status report page. As noted in #20 Default Admin uses the prohibition / cross out icon on that page.

Screenshot:

This looks like the proper issue for sorting all of that out.

Suggested exclamation point inside a circle again, solid and outline versions, in Claro's input error red color (hex color #dc2323):

SVG code for the outline version:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="20" height="20">
  <circle cx="8" cy="8" r="7" fill="none" stroke="#dc2323" stroke-width="2" />
  <path fill="none" stroke="#dc2323" stroke-width="2" d="M8 4v6m0 1v2" />
</svg>

I think that SVG code is public domain. It's a modified version of https://publicdomainvectors.org/en/free-clipart/Small-warning-icon/59595..., and the site says:

Public domain
Vector images provided via download on publicdomainvectors.org are bound to Creative Commons Deed CC0.

You can copy, modify, distribute and perform the work, even for commercial purposes, all without asking permission.

Although absolutely not required, a link back to Public domain vectors is always welcome.