I once read an article arguing that red and green are bad choices for diff, because
some people have red-green color blindness
red implies "bad" and green implies "good", but deleted code is often not bad and new code is also not always good.
However, I cannot remember where I found that article and which alternative colors were suggested.
What would be sensible alternative colors for red/green?
Since it's still here - I'd go with blue and red. Blue is more neutral, and red at least has a connotation of "deleted".
Related
I am new to CSS and programming in general so I am sorry if this is a beginner question but I couldn't find a proper solution myself.
If I have a certain color code (HEX), e.g. #028dca, how can I get matching colors for this ?
I found a number of tools online but I only saw solutions that give me different shades of the same color whereas I need different colors that match the above hue etc., especially red and green - and a few more colors would be nice to have.
One of several examples I tested is the following but again I couldn't find a proper red and green tone there, just different shades of blue and orange as the complementary color (and it looked similar with other tools I checked): https://color.adobe.com
Can someone help me with this ?
Many thanks in advance,
Mike
Don't know actually what you mean with "couldn't find a proper red and green tone". Given a particular color, it has complementary colors... it's math.
Here is the one that I use: http://croma.numixproject.org
Try using Coolors.co
You can fix on colors and then try different palettes.
The one with the color you posted would be like this - http://coolors.co/app/86615c-f1a699-028dca-79065a-02241a.
You can explore more by hitting the spacebar
I like the "zither strings" that Visual Studio 2013 displays, that help visually align the braces in try / using / while / etc. blocks of code. I also enjoy them aesthetically, as they appear in different visual representations of points along the electromagnetic spectrum:
But, are those colors "more than a pretty face"? In the screen shot above, I see, from left to right, gray, teal, midnight blue, grey, gray, grey, gray, purple, and grey again. Is this just to help differentiate one line from another? If so, why are several succeeding lines the same hue (as far as I can tell)?
Or, do the colors signify something, such as teal for classes, midnight blue for methods, purple for while, and gr[a,e]y for everything else?
These are part of the Productivity Power Tools for VS2013 (see here). Specifically they are part of the Structure Visualizer feature.
There does seem to be some meaning in the colours. I haven't been able to find a definitive list of colours, but I've noticed the following:
Grey for general blocks, like namespaces, try / catch blocks and using
blocks. The grey for namespaces seems to be a bit darker than other block types.
Teal for classes
Blue for methods
Green for conditional blocks (if / then, switch)
Purple for looping blocks (for, foreach)
You can turn the lines on and off in the Productivity Power Tools section of the Options dialog.
In each web app I develop, I like to add three types of messages:
Green/blue for success messages
Yellow for warnings
Red for errors
And perhaps, a neutral one for information, which is gray or blue if the success one is green.
The success one is used for when an item is created or updated, the yellow one is when there's something wrong, but not we-are-going-to-die wrong and the red one is when something is blocked or we are going to die.
However, there's one thing I can't figure out, when I delete an object, what kind of notification should I use? I think the success one is not because it is not expected, altough the deletion was successful, the user tends not to read the message, just to see the color.
The red one might be, but it can be misunderstood (I tried to delete it but there was an error), the warning and the information one might be good choices, but I'm not really sure.
Also, when you ask for confirmation about deleting something, the 'cancel' button should be green or red?
I'm just curious how you guys handle this. Thanks.
In general, I rely on the OS to provide appropriate colors.
The problem is with vision-impaired users. I can't predict whether or not they can read text set against any background I might choose. I assume that they've configured their browser and OS to display the colors that they can read the best.
Mike brings up a good point. Using colors assumes the user can see colors. Perhaps adding an icon (with contrasting foreground and background colors) to your messages may help with the ambiguousness.
For example:
Exclamation: Exclamation point in a triangle with a yellow background.
Asterisk: Lowercase letter i in a talk bubble.
Stop: White X in a circle with a red background.
Error: White X in a circle with a red background.
Warning: Exclamation point in a triangle with a yellow background.
Information: Lowercase letter i in a comic bubble.
Question: Blue question mark in a talk bubble.
I usually do it the following way:
If the user's intention was to delete something, and he did, I show it in green. If they don't read it because its green, they will assume that whatever they wanted to do has been done correctly.
At the "are you sure?" stage, the user may have gotten there by accident, so if you give a color, he may get confused or scared. I keep the "delete/cancel" buttons in a neutral color.
Just interested in knowing if there are any good (and short! :-) ) articles which talk about the color combinations that would look good on a website.
i.e For tables (odd and even row), which one will be good in all situations
For alerts? For menus? etc
Thanks!
When it comes to colors, I don't think there are any set colors like you ask. There are no articles that say "ALL MENUS MUST BE BLUE!".
For alerts, either a light or golden yellow is used (so that you don't burn your eyes out), or a dark maroon or peachy pink for more prominent alerts. Menus can be any color, but they should match your color scheme.
I think what you are implicitly asking for are color schemes. Take a look at these resources:
Prefab color pallets for inspiration
Color scheme helper chooser
Aviary (Toucan) color chooser (flash)
Visibone color lab
Related articles
How color schemes work
How to choose a color scheme
How to select color combinations
In addition, if you are serious about your website, I strongly STRONGLY suggest reading this book:
Steve Krugs Dont Make Me Think
The book is in an easy to read (and skim) format, and is about colors, interfaces, buttons, and designing the easy-to-use website with lots of pictures and examples. For me, it was a quick read ( < 1 hr), and it changed my life.
simple advise : do not use many colors. select three or max four different color. and work with their shades.
for color scheme selections nothing beats...
http://kuler.adobe.com/
I'm customizing a color picker's default showing colors which will be used as background colors. I'm wondering if there is a collection of the colors that are particularly useful in practical web design. Like nobody(hopefully) would use #f00 as a 100%-width page's background color while #fff is a universally usable one, there's DO'S and DONT's when it comes to picking background colors. So what are the candidates in your opinion?
I know this could be subjective, but generally I believe there IS a solid set of them.
[edit] : I kinda have an idea to customize the color picker in a logic way, first pick a buch of hues, them for each hue, start from the possible lightest of saturation to the possible heaviest. A bit demenstration:
gray [ #eee, #ccc, #ddd, .... ]
green [ ... .... ... .... ]
blue ....
yellow
brown [
As for a realistic answer, #fff won the race, right? Sometimes you'll see shades of gray, #eee, #eaeaea, and an occ. #000.
If you want to mix things up, I'd recommend checking out http://kuler.adobe.com/ to get an idea for what's popular, but perhaps slightly different. It's fun to experiment with the palettes up there.
I don't think there is a universal standard for picking up colors for your site. It entirely depends on the nature of the site and the kind of users that visit the site.
For eg: it would be nice to give a greenish color for a site that's theme is nature.
Here is a nice site in which you can choose color combinations and get a preview of that in a single click.
Color Scheme Designer
Never choose a color that will distract the user from seeing the actual contents of the site.
If you allow users to select the color then it would be nice to show them a preview of the site with the colors they have chosen.
Contrast is what really matters when choosing background/foreground colours, so they're likely to be very light, or very dark
so you'll need light and dark variants. i'd probably opt for:
light red, orange, yellow, green, blue, indigo, violet
and dark as above
maybe the same for some earthy type tones, browns, greys, etc.
If you like colours like I do, you might visit ColourLovers. They've got some great ways of choosing colours, and colour schemes. The website trends section might be interesting to you.
I personally like schemes where the lighter colour is not pure white. Pure white can be sometimes harsh when reading lots of text.
Creativity is BREAKING the rules.
It is possible that a seemingly bad color combination, if used in right proportions, can actually look good, so there is no such thing as a bad color combination, it also matters on the shades, difference in colors.
Believe it or not, i own a site (www.salvin.in) where user can change the background color to many different choices and it still manages to look good *ahem in most of the cases.
There are a few things that i suggest you to look into:
Color wheel
Color harmonies
Triads and Tetras
Mono chromes (with contrasting shades)
Complimentaries
I find that #000 messes up my eyes. After looking at mainly #FFF pages/applications, then switch to #000, then when I go back to anything else, it take a while for my eyes to adjust. I vote "no" to #000.