Why would someone use pure CSS styled buttons over a bitmap/SpriteSheet technique?

css, css-sprites

Solution

Well, for one, pure CSS buttons will certainly load faster, as they are only some very few lines of code. Many things can't be done in CSS/JS, those will have to be images, and will consume much bandwidth. But where you can save bandwidth, you should. This alone is a killer argument if speed is a priority for your project.

.

About effects looking better out of Photoshop... I wouldn't neccessarily agree here. I really don't think the browser implementations look bad in any way, so you would have to beat those, first.

.

Also, drawing a button image will likely cost more time than writing some lines of code. Same applies for changing the button. Maintainability is on CSS side ;)

.

I don't think the translation argument applies. If a "localization engine" can handle different CSS style/style classes/texts for different languages, it should be able to handle different images/sprites for different languages just as well.

.

About SEO: If you have a fallback text for a button or image (in case it cannot be loaded, IMO standard behaviour), that should apply to search engines as well as any string does. Though I'm not 100% sure here.

Problem

We have an ongoing discussion at my job about the best way to deploy buttons over our websites. Some art directors ask for the buttons in pure CSS, I prefer to make Spritesheets in Photoshop. My argument- the kerning, text-effects like drop-shadow and aliasing all look better coming out of Photoshop. Their argument- you lose SEO points, translation engines can't change the buttons. I'm sure there are arguments for both sides- am I missing something obvious for either of these arguments?

Original source