A Little Eye Candy Never Hurt Anyone

A week or so ago, I came across an interesting JavaScript technique for dynamically adding the reflection effect that’s all the rage these days to any random image by simply giving it a certain CSS class. True, it’s pure eye candy, but it’s really cool eye candy. Obviously there was no way I could pass up a chance to tinker with it here on Opus, and that’s just what I did. So if you’re using Safari, Firefox 1.5, or Opera 9, you’ll see a little something extra. If you’re not, things should look essentially like they always have.

There are some downsides to this technique. Since it renders the image reflections on the fly, slower machines might take a performance hit on pages with lots of reflected images. That might be a problem on Opus’ homepage if I’ve got lots of images on there. But given the usual amount of content on the homepage, it shouldn’t be. Also, it’s a whole lot easier than taking these images into Photoshop and adding the effect manually. Plus, what happens if/when I redesign Opus and the reflected images just don’t work (perhaps I’m using a different background color than white)?

A more pertinent downside, however, was raised on the Digg thread that brought this technique to my attention. Someone asked where it’s a good idea to create an admittedly cheesy effect that most folks can’t even see (since the effect doesn’t work in Internet Explorer). It’s a good point. It does seem somewhat backwards, what with all of the recent momentum towards standardized web standards that work regardless of browser.

If the effect’s visibility had a real impact on Opus’ basic functionality, than I would definitely hesitate to use it. But this a purely visual effect. Not seeing it doesn’t impact Opus’ usability in the slightest. People can still use the site just fine, it just won’t look as cool as it might otherwise.

If nothing else, it’s a fascinating proof of concept, an example that shows you don’t need Photoshop or Flash to accomplish snazzy web design effects — you can use default browser functionality. It’s a a more extreme example of what I see happening with CSS. It’s gotten to the point where I do the bulk of my layout these days with BBEdit and a browser. Rather than position and layout elements in Photoshop, export the graphics, stitch them back together, make more changes in Photoshop, re-export the graphics, and so on, I can position and tweak my elements with just a few keystrokes and a browser reload. It’s a much more efficient way of doing things, and an exciting way as well.

This reflection technique is just further indication that Web design is coming more into its own, at least to me. And as browsers continue to develop and gain new functionality, it’s only going to get better and more exciting.

Enjoy reading Opus? Want to support my writing? Become a subscriber for just $5/month or $50/year.
Subscribe Today
Return to the Opus homepage