This is cool, but I'm not a big fan of "fogging" as a UI tool. I noticed Vista/Aero did this quite a bit.
The fogging just obscures information, but replaces it with something that is distracting. You might get an impression of what's there, but it's a tax to comprehend it. OS X (tend to) do this a lot better - if it's not useful, don't make the user squint at it.
Feels like a pure eye-candy effect with no benefit to the user, but I'd be interested in counter arguments/examples.
Just tried this out; on Firefox at least you have to specify the shadow color, otherwise it inherits from the text color and becomes transparent. So, text-shadow: 0 0 5px #000
Why only include support for webkit browsers? When Mozilla and Microsoft implement the other parts of filter into their browsers, wouldn't you want native support there as well?
This might improve the user experience by visually signaling to the user that their mouse click to submit a form has been registered by the browser, and please do not click again while the server is processing your input.
12 comments
[ 2.9 ms ] story [ 56.7 ms ] threadThe fogging just obscures information, but replaces it with something that is distracting. You might get an impression of what's there, but it's a tax to comprehend it. OS X (tend to) do this a lot better - if it's not useful, don't make the user squint at it.
Feels like a pure eye-candy effect with no benefit to the user, but I'd be interested in counter arguments/examples.
However, in proper places blur feels very natural; after all, human eye works this way.
I think blur has lots of potential. I especially like these use cases:
- triggering blur effect after a dialog pops-up
- leading the user through a series of mundane forms, displaying the goal in the blurred background
I'd be interested to hear other ideas too.
color: transparent; text-shadow: 0 0 5px;
Works way better for text on non-webkit browsers and is supported by everything but IE (and even that supports it in 10)
The current form of the blur on firefox is just plain ugly, and seems to be an overly complicated way of achieving the effect.
Good thing: Instant bypass using 'developer tools' or firebug...