Why Does This Happen??

[XX7509]

Can someone explaine to me why this happens, and how I can fix it. Actually I think I know why it happens.

I am making images for the web, my goal is to make the images transparent so they will work on any type of web background.

I draw the image with a white background, and the paint software generates a match to blend the ranges of colors on the background the to vectors. It looks fine on a white background, but as soon as I place the image on a different color background I get a distorted effect always around the vector portions.

I am saving the images in 89a format with white filtered out. To make is clearer I included a sample, compiled down into a bmp format.

The second image looks fine, but when placed on a different color background I get a distorted effect, which is by no mean acceptiable for a web graphic. I see a lot of very complex images on the web that work fine in any background type, what is the trick, that I am missing?

I know that the 89a format will filter out the color I select, but the blended shades of that color around the vectors, don't get blended, I don't think the format knows quite where the vectors start and stop.

[redux]

gif transparency has only a single bit, meaning that a pixel is either fully transparent or fully opaque. any antialiased edges will remain fully opaque, and thus the background you originally designed your graphic on will shine through. the only solutions available to solve this problem are:

- design your image on a background colour which is similar enough to the background(s) you want ot place the image over
- don't use antialiasing. this may work for certain shapes. but will make others look quite fuzzy
- use a different format - PNG particularly - which has better support for transparency. unfortunately PNGs are not supported by older browsers, and even new versions of IE have some issues with PNG, as far as i know

[XX7509]

When trying to save to the PNG format I receive the following options:

Use Single Color Transparency
Use Alpha Channel Transparency
Use Existing Image/Layer Transparency
- Trans Inside Current Selection
- Trans Outside Current Selection

I don't know what these mean, but when I select Alpha Channel the entire backgroun, no matter what color it was when I saved it, display's in solid black, or I believe #000000

I'm not sure about the limitations of the format, I have heard a few stories about it, but I do know that Microsoft completely intergrated the PNG format into FP02, no matter what format the image is when you import it, FP converts it into a PNG format, and then saves the original format. When FPSE incounteres a browser that does not support PNG in replaces the PNG format with the backed up *.original format. I'm not sure but Microsoft may have resolved the issue for the most part, otherwise I don't know what they would have developer FP02 in this manner. ARGH. I'll have to do some research on it.

Any info on what those options mean?

[fdeaton]

I'm also looking forward to better png support. Search around zeldman.com or alistapart.com for png. I read an interesting article about pngs there a while back, but right now I don't remember just which one of the 2 sites it was on.

[inter4design]

also if you know what color background you are placing your image on, in photoshop you can do the save for web feature and choose the matte color that matches your background color...that should help

[XX7509]

also if you know what color background you are placing your image on, in photoshop you can do the save for web feature and choose the matte color that matches your background color...that should help

Yeah. I think my problem is that I'm not much of an artist, so I use mostly prebuilt shapes, and picture tubes to draw most images. The problem is then blend into the background. At the edge of the image there are different shades of the same color, when using gif only the main color becomes transparent all the shades stay the same. I beileve thats why I get the choppy borders.

Does anyone know of a way to turn this blend feature off? So the shapes are not blended into the background when I generate them?

[Karloff]

Unfortunately PNGs are not supported by older browsers, and even new versions of IE have some issues with PNG, as far as i know

Unfortunately true :P

Microsoft proposes this fix:

<html>
<head></head>
<body bgColor="blue">
<!-- This DIV is the target container for the image. -->
<DIV ID="oDiv" STYLE="position:absolute; left:140px; height:400; width:400;
	 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
	 src="image.png", sizingMethod='scale');" >
</DIV>
</body>
</html>

More information can be found here.