First thing to check is if there is any white in the picture it self. If the answer is no then you can use save for web and select the gif option and specify white to be transperent.
If the answer is yes, then you have two options. One is to change the white to another color preferably the same color as your website background. Now you can either just save as a jpeg or make that color transparent in a gif.
The other option is to remove the white background and use save for web but this time use the png format.
The catches – With gif you can only specify a single color that can be transparent and if that color is different than your webpage background you will more than likely see some fringing.
Using jpeg will only work if the background color matches exactly with the wbpage background, because jpeg does not support transparency.
The png format supports transparency and multiple colors as it uses the alpha channel. However Internet Explorer 6 and earlier do not support transparency when they render a png file.
The choice is your on where to go, hopefully other will give more advice on this issue.
"However Internet Explorer 6 and earlier do not support transparency when they render a png file."
There’s a simple javascript fix that will enable PNGs to display transparency properly in IE 6 and earlier. Have a careful read at the following link:
<
http://homepage.ntlworld.com/bobosola/>
However Internet Explorer 6 and earlier
time to stop living in the past. 🙂
seriously though, IE 8 is due out soon. I hear ya, we’re still using IE 6 at work as the default browser, but we’re nearly done eval’ing IE7. sometimes it takes something drastic for people to move, sometimes it’s a whole lot of little things piling up.
Thank you for your responses. Would your recommendations change if I wanted to past the picture to marketing materials such as a brochure? Thanks!
Would your recommendations change if I wanted to past the picture to marketing materials such as a brochure?
Oh yes. You wouldn’t want to use GIF or JPG for that purpose. You would need a TIFF or PSD file with a resolution of at least 200 dpi, 300 for top quality work. In this case you would use an alpha channel for masking the image to a circle. (And make sure that the DTP application used can accept such a file.)
Could you please offer a workflow of processing this project? Thanks!
First thing you need to reveal is what application you’ll be using to put together the brochure.
I found I wasn’t sure how to complete this when I was building a brochure in the vistaprint.com template builder. I hadn’t really considered further what application. Any suggestions on which would be best?
You need to read the instructions in Vistaprint.
I had some calendars made by them (they were excellent) and they were quite specific about file formats, sizes and resolution.
The point that has been made is that the web does only support transparency in certain file formats and a printed brochure is a totally different animal.
Allan: Which DTP are you using for the brochure? I can give a quick workflow for print & web.
I apologize, I currently have the Adobe Master Collection CS3. Right now, I have the file I’m trying to manipulate in PS but can use illustrator or any of the other products you might suggest.
I have read the instructions in Vista Print, they don’t offer advice on how to add a picture that will white corners of a round picture to be transparent so that it blends with the colors already present in there templates. Thanks!
InDesign is the way to go if you have the Master Collection.
What you should do is create the image file in PS on a layer so you can get transparency and you can place the PS file directly into InDesign with full transparency available. Then, if you have a solid background on the web site, get the background color number and place a solid fill on a separate layer beneath the image, then use SFW as .jpg, and place into the website. You can toggle the solid background layer view off and on, so that you can turn it off so the transparency will show in InDesign and turn it back on for export for the web.
I do this on a regular basis, right now for a site & print material I am creating for a client.