5 ms·
Does text shadow increase text legibility
- corin_ 16y ago"Does white text on white background become more readable if you add some black to the outside of the text?" Shocking results!
- mrkurt 16y agoThat post was way more interesting than you gave it credit for.
- Dramatize 16y agoNot really. Real world examples would have been more useful. I don't see anyone arguing that white on white text is hard/easy to read.
- corin_ 16y agoAfraid I disagree
- haribilalic 16y agoIn addition to light text on a light background with a dark shadow, they also tested light text on a dark background with a dark shadow. It was just as useless. Why wouldn't they test dark text on a light background with a medium shadow or any other real-world combination?
- huhtenberg 16y agoHere's a more sensible test - http://oi56.tinypic.com/14yc0u1.jpg http://oi56.tinypic.com/14yc0u1.jpg - a lighter text-shadow with zero offset and 5px blur is used to increase the contrast around the text. Top is #fff, center is #eee, bottom - no shadow. IMO it's a close between the center and bottom options, but bottom still looks better and more uniform across different monitors.
- Dramatize 16y agohttp://socket.io/ http://socket.io/ is a good example of it making it harder to read.
- codefisher 16y agoI don't know, the contract between the background and the text is low already, so making it worse would be kind of hard. I like using a drop shadow on headings or other important bits of text that have been placed on something that causes the contrast to be low. But I try to make it so it is not obvious it is there, just subtle.
- stevenwei 16y agoI just tried turning off the shadow there and the text is much more readable. It's actually plain white text but the 1px black drop shadow makes it more difficult to read against the blue background.
- sahillavingia 16y agoThe utility of text shadow really lies in the 3D aspect of it. If you have white text, adding a black text-shadow at -1px distance makes the text look inset. With black text, a white text-shadow at 1px distance works too. It enhances contrast... and looks sexy. Win-win.
- jerf 16y agoEverybody's right. Science wasn't necessary, it's obviously useful in a limited set of circumstances. (One could argue that such text without contrast shouldn't exist, but that's easier said than done in a dynamic environment such as a game.) Zed's still right in the way he meant it, which was not about those limited sets of circumstances. In other news, the well-known true statement "the sky is blue" isn't actually true. Right now it's black, studded with these little white spots. But we still know what that means. Context.
- jws 16y agoThose are sort of outrageous examples. I find text shadow helps when I've got the contrast between the type and the background a little close. Text shadow can be used to subtly improve the contrast just around the letters. Done right users don't consciously know there is a text shadow but legibility is improved while maintaining a mellow set of colors. To be explicit, in HTML-5 land I would be talking about something like a 1 to 4 pixel wide shadow with say an hsla(0,0%,0%,0.25) color to darken a background around some lighter text.
- mcantor 16y ago"I think there’s quite a bit of promise in the technique of using “real” statistical evidence to back up claims." That, or, you got punked into blasting a hundred bucks by Zed Shaw via Twitter...
- Yahivin 16y ago$10.50 But practicing science with simple, practically trivial, experiments can make it easier to do real science on more difficult examples in the future.