red checkmark vs. a red "X"

Question

I am currently designing a panel in my business application that shows a table of data to a user. The data in the table is the company's percentage (this is equated by many different values), whether or not the company has a serious violation, and whether or not the company has an overall alert related to this data.

I have currently designed the panel with a red checkmark showing that the company has a serious violation. However, recently one of my coworkers brought up that this does not make much sense since it is a checkmark and suggested to make it an "X". I am torn between the two and was wondering what people thought from a usability perspective.

Answer 1

A checkmark represents something positive - usually 'good' or 'correct', so you shouldn't use it to represent something negative like 'serious violation'. I would focus on using either a X or a warning sign, with a preference for the warning sign.

Icon aside, I don't see any good reason to have columns for both 'serious violation' and 'Overall alert'. The 'Overall alert' is redundant and the table will become more usable without it.

In fact you probably don't even need to have a column for a warning, and can show a warning with just colour and a warning (or X icon).

Here are two rough examples. My preference is for the first one (but with better design):

Answer 2

On closer inspection of your question, I am revising my answer. What you're trying to convey is "Does this company have a failure (i.e. non-compliance to some standard)? Yes or No". In which case, color is irrelevant, it's not a failure, and a check mark is somewhat standard.

Consider a table where multiple types of the same thing, like a tablet computer, are being compared. The tablets are listed on the left side with the features they do or don't have listed along the top.

^{download bmml source – Wireframes created with Balsamiq Mockups}

Checks are used to indicate the presence of the feature. In your case, the checks indicate whether the company is in violation of something or has an alert. Now, I think the confusion comes in because you have an alert icon for the "Overall Alert" column. If you had check marks for both columns, it would be more clear that you're conveying a "has this, doesn't have this" relationship instead of "alert! pay attention! failure! do some action!". If, however, you do want to encourage the user to act based on the data, then my original answer holds:

Using a red checkmark would not translate for users with red-green colorblindness, as well as some other types of colorblindness. Checkmarks generally represent success and shouldn't be used when you're trying to convey a failure situation. The "X" is generally understood to mean failure (see form validation and other errors all over the web).

However, made clear by our answers and @Marjan Venema's comments, the column title is misleading in conjunction with either a check or X. An alert icon, or better yet, an icon plus text saying something like "X has failed" would be more correct.

Answer 3

I would use a red exclamation point as the Icon in the column (similar to the Icon JohnGB used. My first thought was to rename the column so you could use a red X. For example if you renamed it to 'Conforming', 'In Good Standing', 'No Violations', or 'Playing By the Rules', then you could use a red X to indicate that the company is NOT conforming, or has a violation. A red X usually means that something is not in what ever state the column indicates, so a strict logician could argue that companies with a red X were not in violation.

Definitely stay away from the red check-mark, as that really sends a conflicting message.

A red or orange exclamation point would really be most clear, and easiest to understand.

I also like the Idea of combining the 'Serious Violation' and 'Overall Alert' Columns. Call it something like 'Health' or 'Standing'. Use Red Xs for serious Violations and orange exclamation points for alerts.

Answer 4

This is actually cultural thing. In US and Germany, X is commonly used as check mark. In most of the countries it is ✓. In Japan its O mark is used.

Answer 5

A red tick mark seems ambiguous, "Is it acceptable but not good?", "It is completed but has some problems?" or something else? Since, check mark is something which represents completion or acceptance/approval.

For violation, you might use a X like John suggested or you can go for a circle with a backward slash (the symbol for prohibition).

Answer 6

I had to make a similar choice today and this is what we decided:

• Green check mark for correct
  Green generally describes a good thing and the check mark translates for Daltonian users (people with red-green colorblindness) too
• Yellow triangle for warning
  Yellow is generally the color for warning signs (ex: road signs) and a triangular form for Daltonian users
• Red, filled circle for alert
  Red is generally used for alert systems in real life (ex: red lamp for safety issue) and circle is generally used in road signs to specify an interdiction.

We wanted to use a red circle with backslash, but in order to see that well, it would need to be more than 32 x 32 px and we are limited to 16 by 16 px.

We aren't able to use a red check mark because there is a conflict between semantic color and semantic form.

Finally, we aren't able to use a red X because X's semantic use is for deletion, close in windows or close pop up button.

Answer 7

I'd advise caution; a red X can be ambiguous. In a lot of systems, this symbol is associated with a deletion behaviour.

I work on a system with this symbolic meaning. In situations as you describe, we've used a white X in a red circle to indicate error/violation behaviour (like Visual Studio's Error symbol), and a sufficiently different white X in a red square to indicate a soft/slight error.

To fit in with your warning style, perhaps you could use a red X in a red circle. I feel the circle will sufficiently differentiate the symbol from being a deletion behaviour and help extend your visual design language.