problem with transparant gif

447 views10 repliesLast post: 10/23/2006
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is http://www.paulwatt.info/test/ I'm using CS2 BTW.

Many thanks in advance.

--
Cheers

Paul
le singe est dans l'arbre
http://www.paulwatt.info
#1
Paul Watt wrote:
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is http://www.paulwatt.info/test/ I'm using CS2 BTW.

It's displaying as a transparent GIF in my browser--I can see the gradient behind it well enough. Is it the light colored "crust" around "Paul Watt" that is the problem?
#2
"Grinder" wrote in message
Paul Watt wrote:
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is
http://www.paulwatt.info/test/
I'm using CS2 BTW.

It's displaying as a transparent GIF in my browser--I can see the gradient behind it well enough. Is it the light colored "crust" around "Paul Watt" that is the problem?

yep thats the problem, i need the edges clean. Any ideas?

--
Cheers

Paul
le singe est dans l'arbre
http://www.paulwatt.info
#3
"Paul Watt" wrote in message
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is http://www.paulwatt.info/test/ I'm using CS2 BTW.

Many thanks in advance.

--
Cheers

Paul
le singe est dans l'arbre
http://www.paulwatt.info

I think this has been a common occurrence and I do not remember the answer, however I notice that the text displayed has been rasterised!! Could you not leave it as an editable font set on top of your coloured background!! and then save as a jpeg which would seem to be a smaller file for the same quality??

http://static.flickr.com/50/274806996_49b3f3497c_o.jpg
#4
On Fri, 20 Oct 2006 21:07:41 +0100, "Harry Limey" found these unused words floating about:

"Paul Watt" wrote in message
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is http://www.paulwatt.info/test/ I'm using CS2 BTW.

Many thanks in advance.

--
Cheers

Paul
le singe est dans l'arbre
http://www.paulwatt.info

I think this has been a common occurrence and I do not remember the answer, however I notice that the text displayed has been rasterised!! Could you not leave it as an editable font set on top of your coloured background!! and then save as a jpeg which would seem to be a smaller file for the same quality??

http://static.flickr.com/50/274806996_49b3f3497c_o.jpg
Saving as <anything> other than PSd will rasterise and (usually) flatten the image.

Only solution to 'transparent' gifs is to have a hard edge -=or=- to have the background clipped from the page's background.
#5
Granny typed:
[snip]
Is it the light colored "crust"
around "Paul Watt" that is the problem?

yep thats the problem, i need the edges clean. Any ideas?

I hit it the empty space with the magic wand at about 5 tolerance added the insides of the P and a's and the left side of the P then added to the selection the letters design and the empty spaces then selected inverse.. leaving only Paul Watt selected then simply stroked 1 pixel wide, centered, with the color that is just a little lighter than the main blue..

--
"Granny"
Old N Slow N Prefer Quick N Easy
#6
Granny typed:
[snip]

Granny typed:
[snip]
Is it the light colored "crust"
around "Paul Watt" that is the problem?

yep thats the problem, i need the edges clean. Any ideas?

I hit it the empty space with the magic wand at about 5 tolerance added the insides of the P and a's and the left side of the P then added to the selection the letters design and the empty spaces then selected inverse.. leaving only Paul Watt selected then simply stroked 1 pixel wide, centered, with the color that is just a little lighter than the main blue..

OOPS! just remembered 'bout them jaggies.. check out.. Understanding Antialiasing and Transparency at
http://www.lunaloca.com/tutorials/antialiasing/

SBT
--
"Granny"
Old N Slow N Prefer Quick N Easy
#7
are you placing the giff on a that gradient background?

a work around would be to have that same gradient behind your text in the giff...so that it matches when you place it over the gradient banner.

Can you use a PNG rather than Gif?

good luck!

"Paul Watt" wrote in message
Hi,
I've made a gif with some text on a transparant background. The problem is that it doesnt render properly. I've set loss to 0, interlaced ticked and transparancy ticked. The url to see it is http://www.paulwatt.info/test/ I'm using CS2 BTW.

Many thanks in advance.

--
Cheers

Paul
le singe est dans l'arbre
http://www.paulwatt.info
#8
Hi Paul,

When you save GIFs, there is an option called 'matte'. This is what gives a fringe around transparent GIFs. Click the arrow in front of matte, it will give options like: white, black, 50% grey, background colour, foreground colour or custom. Whatever colour is chosen as matte, that is the colour which comes as a fringe around transparent GIFs. When you saved your GIF, the matte must have been set to white. One thing to do is to type your logo again, and while saving choose the matte colour closest to your gradient backgound.

Fotodewan

http://photos.raniasplace.com
#9
"Harry Limey" wrote in message news:45392c8f$0$8720

I notice that the text displayed has been rasterised!! Could you not leave it as an editable font set on top of your coloured background!! and then save as a jpeg which would seem to be a smaller file for the same quality??
http://static.flickr.com/50/274806996_49b3f3497c_o.jpg

Paul

I wonder if you noticed the link I attached which was for an example of the method mentioned above and which is a distinct improvement on your own motif, and it took no more than two minutes to create,
here is the link again!!

http://static.flickr.com/50/274806996_49b3f3497c_o.jpg
#10
In article ,
"Paul Watt" wrote:

yep thats the problem, i need the edges clean. Any ideas?

Yes.

Use the Save for Web command. Look carefully at the Save for Web dialog. You will see a control that is called "matte."

You must choose a matte color that is the same color as the background on your Web page.

GIF does ot support translucency. A pixel is 100% transparent or 100% opaque, no in-between allowed. But when you set text, Photoshop will "anti-alias" your text. Anti-aliasing is a way of making text and curves look smoother by putting translucent pixels on the edge.

GIF does not allow translucent pixels. When you save as GIF, you get an undesirable fringe because of this. By setting a matte color, you tell Photoshop to fill this fringe with the same color as your Web page background.

If you need a GIF to print smoothly with no fringe over a multicolored background, it is time to go back to the drawing board and re-think your Web page design, or re-think how you are doing it.

--
Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
Nanohazard, Geek shirts, and more: http://www.villaintees.com
#11