problem with transparant gif

PW
Posted By
Paul Watt
Oct 20, 2006
Views
447
Replies
10
Status
Closed
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

Master Retouching Hair

Learn how to rescue details, remove flyaways, add volume, and enhance the definition of hair in any photo. We break down every tool and technique in Photoshop to get picture-perfect hair, every time.

G
Grinder
Oct 20, 2006
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?
PW
Paul Watt
Oct 20, 2006
"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
TB
Tony Blair
Oct 20, 2006
"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
J
jaSPAMc
Oct 20, 2006
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.
G
granny
Oct 20, 2006
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
G
granny
Oct 20, 2006
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
J
jrzyguy
Oct 20, 2006
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
F
fotodewan
Oct 21, 2006
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
TB
Tony Blair
Oct 21, 2006
"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
T
Tacit
Oct 23, 2006
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

How to Master Sharpening in Photoshop

Give your photos a professional finish with sharpening in Photoshop. Learn to enhance details, create contrast, and prepare your images for print, web, and social media.

Related Discussion Topics

Nice and short text about related topics in discussion sections