Help With Transparency Issue

Syphon101 · Posted: Thu Feb 12, 2009 12:23 am Post subject: Help With Transparency Issue

Hello,

I've recently been trying to make a basic transparent logo for my website, yet have failed horribly.

I start off with a transparent background and such, Yet everything seems to come out just fine except the outlines.

Please take a look at my sample:

http://www.focusdrivingacademy.com/sample.htm/

I'm using CS2 sadly. If you need to know anything else, let me know.[/url]

Sublimity · Posted: Thu Feb 12, 2009 1:01 am Post subject:

Hi Syphon,

Your problem is a common problem with a controversial answer. The reason why your transparent image is jagged is because the Graphic Interchange Format (.gif) is limited to 254 levels of transparency and cannot reproduce the transparency range of your emboss effect without compromising the quality , resulting in the jagged edges compensated by white pixels where the transparency was supposed to occur. An option is to save the transparent image in the .png format which preserve smooth details with better compression. However, when streamlining for the web, you may want to consider clients with older browsers that does not support the .png format, such as Internet Explorer 7 and a few versions of Minefield. The .gif format is a good output format for images with limited amount of colors and sharp edges.

Syphon101 · Posted: Thu Feb 12, 2009 1:28 am Post subject:

Yeah, Even when converting too '.png' , gives me a similar affect.

Do you have any tips on what effects are not good to use when creating a transparent web image ? I would like to create a similar image that would be transparent.

I would really hate not being able to use this image as non-transparent.

Sublimity · Posted: Thu Feb 12, 2009 12:10 pm Post subject:

You would be out of luck converting from .GIF to .PNG. Save the transparent image from the original .PSD to .PNG and you should see results. Effects like your emboss are hard to pull off with transparency because every pixel in the transition has its own transparency depth. If you can, keep effects out of your logo, especially when they occur around the edge of the image.

Syphon101 · Posted: Thu Feb 12, 2009 3:02 pm Post subject:

Okay , I've tried converting it to PNG24 from PSD.

Now, I really want to avoid using '.png' due to the fact that earlier browser versions do not support it, from what I read.

This one logo has takin two days. an still no luck.

When I save it to '.png' and view it in the browser the background become white.

I've watched a few different video's on creating a transparent image and I continue to have this issue, Even when I took away the emboss effect, It still didn't turn out.

Do you think I missing some step to making it transparent ?

I started creation by: New -> Background content -> Transparent

Then -> Merged the layers -> Save For Web -> PNG24 ( Also tried PNG8, GIF ) .
------------------------------------------

Now I've watched others doing this by adding a layer mask, yet still seem to get failure with this, maybe I'm not doing it properly..

Is there any documentation or tutorials that would help me ?? Or some step that I'm missing, Do I have too add a layer mask ?

Copyright © 2003-2016. PhotoshopForums.com, iFroggy Network. All Rights Reserved. Powered by phpBB © phpBB Group. phpBB SEO. Privacy Policy. We are in no way affiliated with Adobe. Photoshop, Adobe and related marks are registered trademarks of Adobe.