[gunnar]

I've been trying to figure out a workaround for this problem for a long time. Internet Explorer seems to dither graphics so that if you have a graphic with a solid color background which overlays a solid color background on the web page, you get a square where the graphic resides of slightly different color. An example is here:
http://www.myhomereno.com

Netscape does not do this. IE on Windows does. Naturally, it doesn't look very professional. How can one fix this?

[seanrg_2000]

Originally posted by gunnar:
<STRONG>I've been trying to figure out a workaround for this problem for a long time. Internet Explorer seems to dither graphics so that if you have a graphic with a solid color background which overlays a solid color background on the web page, you get a square where the graphic resides of slightly different color. An example is here:
http://www.myhomereno.com

Netscape does not do this. IE on Windows does. Naturally, it doesn't look very professional. How can one fix this?</STRONG>

I believe your problem (at least in respect to the images on your splash page), is that the background of the image is not matching the color that you've selected for the page background.

To get around this type of problem, I'd suggest converting the background of that image to a web-safe color. Currently, off of the jpg image that I copied from your site, the background color is #669AFF. The closest web-safe color is #6699FF. Also, saving as a jpg file can introduce some unwanted color shifts from time to time. If you really want to ensure that the background matches, I'd suggest saving as a gif file, and double checking the resulting file after saving it with the new settings.

Hope this helps
Sean

[Mac Guru]

Just a rule of thumb...

on the web.. Photo's = JPG / Line Art = GIF

If you encode an Illustration as a JPG you get major artifacts... and if you encode a photo as a GIF you usally get dithering due to it's limited pallete.

Like stated above your Illustration should be saved as a GIF to reduce artifacts and color shifts on the web.

Mac Guru

[gunnar]

Well, naturally the background color is #6699FF in Photoshop but it saves the JPEG with #669AFF. I can't use GIFs for everything. Has no one figured this out yet to stop the color from shifting?

[seanrg_2000]

Another option you can try is to create a "color swatch image" that is the same color as the jpg background in the image, and use that for the page background. This should get the colors to match up with minimal effort.

Just another thought.

Sean

[gunnar]

Or I could just change the background color to #669AFF I suppose. It just seems like those wizards at Adobe could have figured out how to give the option to lock a colour in a JPEG as is possible in a GIF.

[seanrg_2000]

Originally posted by gunnar:
<STRONG>Or I could just change the background color to #669AFF I suppose. It just seems like those wizards at Adobe could have figured out how to give the option to lock a colour in a JPEG as is possible in a GIF.</STRONG>

You could try that, but in my experience, you'll probably end up with the same result. Why? Well different browser/os/hardware combinations will "snap" the bgcolor right back to the closest websafe color.

As fare as Adobe and their jpg export goes, I don't think it's their problem. They are after all following standards themselves on that one. You should simply be aware that jpg can be a highly compressed format, and may shift your colors.

In this instanance, I don't believe saving the file as a gif, and getting the background color of the image to "snap" to a traditional web pallete is really going to hurt you. Just fiddle with the settings until you get an acceptable result as far as reproduction goes.

As a side note, having come from a long traditional print background, I find the lack of "absolutes" such as color, placement, and "web-centric" standards such as css and the like across platforms and browsers to be anoying sometimes. But it is the price of being on the web, and at some point you need to accept those limitations. (Heck, I even know some folks who ensure proper html compatibility back to lynx, or some other cli based browser. Not the norm, but there's really a huge array of issues you could be looking for if you wanted to.

Just *yet more thoughts*,
Sean

[gunnar]

Sean, you're correct about not being able to tweak the background color in the HTML. The browser just defaults to the closest web safe color. The off-colour JPG background does work. There is a little banding but it will have to do as a GIF of the off colour shows the border once again.

[gunnar]

A related question - why do PC browsers make graphics look visibly worse than on Mac? It appears that they use less colours and manage to show all the compression artifacts. On my Mac browsers, the images are nicely gradated and rendered smoothly as if they were not compressed.

[Mac Guru]

I can't use GIFs for everything.

May I ask why? That image would function the same as it does now in GIF format.

Mac Guru

[gunnar]

Well, even that image has more than 256 colors and I'm working on one now that has significantly more:
http://www.december3.com/r2000/indexe.html

I want the most photographic representation and there will be times when this is absolutely critical.

[Millennium]

Originally posted by gunnar:
<STRONG>Well, even that image has more than 256 colors and I'm working on one now that has significantly more:
http://www.december3.com/r2000/indexe.html

I want the most photographic representation and there will be times when this is absolutely critical.</STRONG>

In that case, use PNG instead. The colors don't get messed up in compression (as they do with JPEG), you can use more colors than almost any computer monitor out there can even display, and since your images aren't using any transparency you won't have to worry about the support issues in IE (PNG's that don't use transparency display fine, even in all of the 4.0 browsers).

[gunnar]

I guess it's all a tradeoff. I think the solution with JPGs is the best for me for this project. In the future with simpler images GIFs would be better and PNG I don't see working because the file sizes are about four times that of either GIF or JPG in PNG-24. PNG-8 seems useless as it has the same color capability of GIF. Perhaps when the browsers have accomodated its transparency it will be more useful.

[Mac Guru]

use PNG instead

Oh yeah there ya go... use an even less standard image format... here's a tip, don't use PNG for web YET unless you are doing so for an internal veiwing where you KNOW everyone will be able to view it.

Believe it or not, people don't ALWAYS have THE latest in software so by using PNG files you are REQUIREING your veiwing audience to upgrade which, if they're using outdated stuff anyway, usually means they don't WANT to.

Stick with JPG and GIF

Mac Guru

[jaisun]

If you have access to it, use Macromedia's FireWorks for compression. It allows for a great deal of control over what the image will look like when it's compressed. In fact you're able to compare up to four different compression schemes/settings in one window, giving you the option of exporting the one you find the best compromise between file size and aesthetic appeal. It also has decent batch processing capabilities...

FireWorks also does away with the custom icon for extra space savings where PS does not (if I remember correctly).

If you would like any additional information about it or how to weild it, just drop me a line: gripley@thecreek.com

Best of luck!

[funkboy]

Originally posted by Mac Guru:
<STRONG>don't use PNG for web YET
...
Stick with JPG and GIF
</STRONG>

Good call. I sure do wish PNG starts being supported, though. It's alpha transparency is something no other file format can appropriately do.

One bug I've found in IE5 (I should mention it to the Microsoft MacBU probably) is that when you set a table or cell background as a png graphic, it loses its alpha transparency.

If you have the privelige of designing in png, you're lucky... but alas, don't use png yet. JPEG and GIF... and maybe Flash... good lord I hope MM gets Flash for OS X, I'm painfully, PAINfully waiting for it since I can't afford to buy Flash 5 for OS 9 (which I still use regularly) now AND pay in just a month or two for an OS X version.