15 ms·
Contrast Rebellion
- teh_klev 11y agoDiscussion from last time around: https://news.ycombinator.com/item?id=2807047 https://news.ycombinator.com/item?id=2807047
- sukilot 11y agoIt has been 4 years. Has the rebellion made gains?
- kristopolous 11y agoI think not. I go into details here: http://unreadable.website/guide.html http://unreadable.website/guide.html ... The biggest problem is the screen on say a MBP is different than an X240 or an XPS13. Next time you are in a big box retailer look at them side-by-side - each screen can access a quite dramatically different contrast and color space. So the low-contrast issue is a manifestation of the classic "works for me" bug. A "cozy" distance on one display become irritatingly illegible on another. The WCAG2 (http://www.w3.org/TR/WCAG20/ http://www.w3.org/TR/WCAG20/) calls for a 4.5:1 ratio ... make this 7:1 or so and you are good.
- carsongross 11y agoAuxiliary support provided by The Horde of Users Who Want Drop Shadow & Gradient Easements In Their UI So They Can Tell What They Can Click On, or THUWWDSGEITUISTCTWTCC, pronounced Thuh-Woods-Gheit-Eww-Tict-Wit-See.
- andybak 11y agoMany of the examples looked borderline to me. How much contrast is 'enough'? Also - surely this is something that should be fixable in the OS or browser? OSX has an high-contrast accessibility mode. Do we really need to fix this at source?
- hawkice 11y agoGood rule for contrast: If you would refer to the text color and background color by the same word, that's not enough contrast. Compare the good contrast examples, largely black on white or white on black, with the bad examples, universally gray on gray (or off-white on off-white).
- randallsquared 11y agoSo, the fewer words you know to refer to colors, the more contrast matters to you? :)
- kristopolous 11y agoAbsolutely correct. It's called the Sapir-Whorf hypothesis. You can refer to the Himba color experiment for more information : http://www.vidipedia.org/vidipedia-the-video-encyclopedia/viewvideo/166413/science/himba-colour-experiment.html http://www.vidipedia.org/vidipedia-the-video-encyclopedia/vi...
- mikeash 11y agoYou joke, but I bet it correlates pretty well.
- EliRivers 11y agoThis rings a bell inside my head; given people from a language/culture with two different words for what English speakers would identify as barely different shades of the same colour, they are objectively better at identifying those two shades than the native English speaker. Which essentially gives the answer "yes" to your question. Here's a reference that might be what's ringing inside my head: http://www.newscientist.com/article/dn11759-russian-speakers-get-the-blues.html http://www.newscientist.com/article/dn11759-russian-speakers... Particularly relevant quote: "This is the first time that evidence has been offered to show cross-linguistic differences in colour perception in an objective task" Here's more: https://eagereyes.org/blog/2011/you-only-see-colors-you-can-name https://eagereyes.org/blog/2011/you-only-see-colors-you-can-...
- eleumik 11y agoI am confident this rebellion will be one of the few that will succeed in these days. Why ? Because rebellions like revolutions need a critic mass of people and well, we are getting very old here ;-)
- dasil003 11y agoThe critique of HN seems off-base. The low-contrast comments are the ones that are downvoted and therefore the low-contrast is there specifically to make them less readable because they ostensibly deserve less attention.
- pygy_ 11y agoIt also applies to the text of self-posts (tell/ask HN), which is what Contrast Rebellion points out.
- sukilot 11y agoI think that is also intentional, to discourage self posts.
- deleted 11y ago[deleted]
- Avshalom 11y agoThat isn't a downvoted comment in the screen shot, that's the topic text as in https://news.ycombinator.com/item?id=9441500 https://news.ycombinator.com/item?id=9441500
- Hobotron1 11y ago> because they ostensibly deserve less attention. They end up standing out to me, and I always end up reading them.
- dredmorbius 11y agoI swap the margin and main-body colors of HN: http://stylebot.me/styles/2945 http://stylebot.me/styles/2945
- mikeash 11y agoIt's ironic that this site is kind of hard to read in Mobile Safari.
- dreamfactory2 11y agoNot sure about the aesthetics argument. Form follows function - if it functions well it looks good, and vice versa. (What people sometimes miss is that you aren't born with a sense of aesthetics/taste but it needs to be learned and the above rule is a good way of improving your understanding of what looks good.)
- rayiner 11y agoWeb design was perfected in 1454 when Gutenberg typeset his Bibles with dark black text on light colored paper (also: with narrow, full-justified columns). Deviation from that is abusive to your readers and an affront to common decency.
- Turing_Machine 11y agoCertainly publishers could have adopted the "gray on gray" fad at any intervening time, and saved money doing so (diluting the ink, no optical brighteners or bleaching on the paper), but they didn't. Only in the era of the web has deliberate illegibility somehow become trendy.
- zokier 11y agoI got a radical idea: do not touch the body text/background colors and let user agent/browser pick the colors according to users preferences.
- vinceguidry 11y agoHah, good one. This is the Internet we deserve, not the one we need.
- spain 11y agoThe new reader modes that browsers are adding let you kinda do this.
- sneak 11y agoThis is the case now: browsers are scriptable and every major browser has the ability to install extensions to adjust nearly every single feature of a page's text rendering with just a few clicks. Turns out most people just don't care about typography.
- mike_ivanov 11y ago"to install extensions". This is satire, right?
- nieve 11y agoThere are just two little config changes that obviously no-one would ever care about that make a lot of newer websites unusable: Setting a minimum font size and/or forcing your own default can cause text to pile up, grow to insane sizes, screw up column width that content becomes a tiny ribbon, or cause text to render entirely offscreen. One of the main causes is the same kind of control freak design that insists on low-contrast text - designers who want some kind of pixel-perfect "responsive Photoshop" that ensures no user anywhere can deviate from their choses appearance. The other is forced fonts including icon fonts - designers are not better at figuring out what fonts a user finds most readable (especially those with poor vision) and icon fonts require turning off the users fonts and often enabling javascript.
- jkot 11y agoPeople should filter colors and fonts the same way they filter ads. Its easy.
- DanBC 11y agoA tiny number of people filter ads. Why should bad designers get to force a bunch of people to fix mistaken web design choices?
- jkot 11y agoWhy should people suffer because of bad designers?
- DanBC 11y agoYes. That's what I said.
- mappu 11y ago>A tiny number of people filter ads. "41% of 18-29 year olds polled said they use adblock ... In some countries nearly one quarter of the online population has it installed" -- http://blog.pagefair.com/2014/adblocking-report/ http://blog.pagefair.com/2014/adblocking-report/
- DanBC 11y ago> There are about 144 million active adblock users around the world. That is a small number of people of the total Internet population. It's a bit surprising that you think an advertiser pushing ads is a suitable source for information about ad-blocking. Obviously they're going to say that ad-blocking is prevalant and that you need to run better ads to stop people running ad-blockers and oh, we just happen to be an ad company that runs that particular type of ad.
- mappu 11y agoIt was the best source at hand, if you have another study i'd be interested to hear it. There's apparently 2.9bn internet users, so you're right that ~5% isn't a very big number in context.
- jacquesm 11y agoThey may have gotten the contrast thing right but they totally messed up on the fonts. I rarely comment on style because I think the substance is what we should focus on but for a site that goes out of its way to criticize one particular design parameter I don't get how they could mess up so badly on another. That's just ugly.
- Turing_Machine 11y agoAesthetics and legibility are two different things. Lumping them both together under "design parameters" misses the point.
- kristopolous 11y agoI have something in the same spirit: http://unreadable.website http://unreadable.website
- krick 11y agoWell, what I'm to say here… If you are site owner and you feel that colors hurt conversion/number of visitors/time spent on page/whatever else you care about — you probably should change the colors. If you are a visitor and you feel that colors of the site you'd like to use discourage you to do so — you probably need to help yourself and make a custom CSS of your own (using Stylish or something) to satisfy your very unique needs or just use one of many services like http://readable.tastefulwords.com/ http://readable.tastefulwords.com/ . Anything else: rebel all you want, nobody fucking cares. My personal humble opinion, btw: the "unreadable" examples are much more readable and easier on the eyes, than eye-burning "readable" ones. So I could as well go around rebelling about white on black or black on white, but I won't, because it's stupid, I follow my own advices and use Pocketbook for long reads anyway.
- DanBC 11y ago> If you are a visitor and you feel that colors of the site you'd like to use discourage you to do so — you probably need to help yourself and make a custom CSS of your own This attitude is hostile to a wide range of people who already have to fight the computer to get things done and shouldn't have to fight the stupid decisions made by bad designers. > nobody fucking cares. For various values of "nobody" including "some people", where some people means any group subject to various disability discrimination laws in whatever countries they operate in.
- krick 11y agoHostile? I would call it "fair". Because, ok, let's assume you win. I'm wrong, you're right, and some ultimate dictator decides that all websites now are coming in black-on-white only. What should I do, as a person that feels low-contrast is much nicer than eye-burning one? Exactly, I'm about to make my own customizations or suffer. And then you should be saying, that black-on-white is hostile to me, which wouldn't make much sense, as you (or somebody else for that matter) would have something to complain on either way. Hence my first point about "if it hurts conversion/…". In other words, if it's your business — it's your business. If it's not — well, you are free to complain about other people coloring their stuff as they like all you want, but I hope they won't be upset about that, because they really shouldn't be, and believing that your point of view is the only right one (even if it's supported by some Nielsen or whatever) is simply ignorance.
- mrob 11y agoDespite praising high contrast, this site hypocritically throws away contrast for no good reason. I can understand using non-white backgrounds, because it can reduce glare, but using grey text is pure fashion. This site uses color:#191919 text. As always, the only good solution is user CSS to set it to #000000. I use the Stylish addon for Firefox to let me toggle this quickly for sites with light or dark color schemes.
- ricardobeat 11y agoToo much contrast is also bad, reducing blacks just a tiny bit reduces eye strain in the average screen.
- mrob 11y agoThere's no chance of too much contrast on an LCD displaying dark text on a light background. People have no trouble reading high quality print in sunlight, and that has much higher contrast. Grey text is harder to read, as demonstrated by the studies cited. Eg. this one finds pure 100% black on 100% white is most legible: http://www.laurenscharff.com/research/agecontrast.html http://www.laurenscharff.com/research/agecontrast.html Black text is the default, and changing it to grey only makes things worse. This is superior web design to the vast majority of sites out there: http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/ But note that excessive contrast can harm legibility of light text on dark background (although that color scheme is less legible, so it should be reserved for cases where it has real benefits, eg. photo editing software, where it makes it easier to see shadow detail).
- ricardobeat 11y agoThe medium-high contrast setting they compared with would be equivalent of #444444, much brighter than the #191919 used by the website. I find it impossible to read a book in direct sunlight, and am pretty sure it's not just me.
- dredmorbius 11y ago
- Trombone12 11y agodark background, Light Background!, dark background, Light Background! Scrolling trough this page made my eyes hurt, did nobody test the transitions when they set really dark and light backgrounds right after each other?
- serve_yay 11y agoA rebellion. Yeah, it's a regular bunch of Pancho Villas over there. Boy oh boy.
- bsder 11y agoYeah, and this website does grotty hacks to figure out my browser tab size and scale--which makes me scroll and scroll and scroll and scroll on a 4K monitor. He's an brilliant idea: quit trying to turn the web from scrolling text into a damn slideshow. Thanks.
- tsomctl 11y agoThe following is a brain dump of an idea I have: I've thought of writing a proxy server that parses pages before serving them to you. It's goal would be to make webpages more readable, with sane font sizes and colors. I'm tired of reading webpages on my iPhone that are "optimized" for mobile where each line is 5 words. I could fit more text on the screen of my first laptop, which had half the resolution. Also, blog posts from medium.com currently crash mobile Safari. Every website would require custom code. It's default failure mode would be to just show the original web page. I don't want to have to fuck with it when some page gets mangled and is completely unreadable.
- coldtea 11y agoHow is that different from the already existing "Reader" mode in mobile Safari? Or Instapaper et al.
- prezjordan 11y agoNot a bad idea - but not there are services that do this by scraping the web page (Instapaper, Readability, etc), rather than requiring a proxy. I encourage you to check them out - maybe you can do even better.
- huac 11y agoServices like https://readability.com/ https://readability.com/ certainly help. To the extreme, let's have the equivalent of Photoshop's 'curves' filter - map everything to either absolute black or absolute white.