GIF Banner on a Web Site

"Dennis Hughes" wrote

Viewed on my monitor, the text looks ragged,
Dennis

It does indeed look ragged!! but before going down the road of how to improve the sharpness!! I notice that the words in question are not bevelled or enhanced in any way, so why not just leave them as text as you have done further down with the words "Arches Decorated for Your Celebration" That way they will be as crisp as they can be!

Harry

"Dennis Hughes" wrote in message

I’m working on a new web site and made up a top and lower banner with a speficic font.

I saved the psd file and then trimmed the transparent background, then saved as a gif.

Viewed on my monitor, the text looks ragged, particularly the lower banner.

Do I need to sharpen or what can I do to sharpen up the text?
http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis
CS2/XP

When you save the gif, there’s an option to define the matting – choose the background color of your page as the matte color. That will keep the text transparent but will antialias it with a gradual blend to the background color.

Flo

"Flo Nelson" wrote in message

"Dennis Hughes" wrote in message

I’m working on a new web site and made up a top and lower banner with a speficic font.

I saved the psd file and then trimmed the transparent background, then saved as a gif.

Viewed on my monitor, the text looks ragged, particularly the lower banner.

Do I need to sharpen or what can I do to sharpen up the text?
http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis
CS2/XP

When you save the gif, there’s an option to define the matting – choose the background color of your page as the matte color. That will keep the text transparent but will antialias it with a gradual blend to the background color.

Flo

what you have there is no longer text. It’s now been rasterized and saved as a graphic. Did you blow that up from a smaller image? that can be one reason the edges look "steppy"
See Flo suggestion on matting the gif properly for the background.

Success!! Thanks to the good advice.

First, the owner wanted the font, Nueva Std, which isn’t in my DM fonts and would be changed by the browsers viewing the site anyway, so straight text wouldn’t do, as I understand Harry. Harry did mention some good ideas about enhancing the text which I will bring up tomorrow.

Kat, I didn’t expand the image at all, so the unsmooth of the text edges was a product of the way I made them. You were right about the matting.

I started over from scratch on the banners with a new file with a transparent bground. I added the text and then trimmed the excess transparent area away. When I saved as a gif, I used Flo’s suggestion to define the matting, something I had never heard of. I saved and VOILA, it looks the way it should. I redid the top banner the same way.

Now, on to soften the edges of the other images…

I’ve left the bottom banner in both versions, if you want to see the difference. http://www.partyarchesllc.com/test9.htm

Thanks a bunch!

Dennis

"Dennis Hughes" wrote in message

I’m working on a new web site and made up a top and lower banner with a speficic font.

I saved the psd file and then trimmed the transparent background, then saved as a gif.

Viewed on my monitor, the text looks ragged, particularly the lower banner.

Do I need to sharpen or what can I do to sharpen up the text?
http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis
CS2/XP

"Dennis Hughes" wrote in message

Success!! Thanks to the good advice.

First, the owner wanted the font, Nueva Std, which isn’t in my DM fonts and would be changed by the browsers viewing the site anyway, so straight text wouldn’t do, as I understand Harry. Harry did mention some good ideas about enhancing the text which I will bring up tomorrow.
Kat, I didn’t expand the image at all, so the unsmooth of the text edges was a product of the way I made them. You were right about the matting.
I started over from scratch on the banners with a new file with a transparent bground. I added the text and then trimmed the excess transparent area away. When I saved as a gif, I used Flo’s suggestion to define the matting, something I had never heard of. I saved and VOILA, it looks the way it should. I redid the top banner the same way.
Now, on to soften the edges of the other images…

I’ve left the bottom banner in both versions, if you want to see the difference. http://www.partyarchesllc.com/test9.htm

Thanks a bunch!

Dennis

"Dennis Hughes" wrote in message

I’m working on a new web site and made up a top and lower banner with a speficic font.

I saved the psd file and then trimmed the transparent background, then saved as a gif.

Viewed on my monitor, the text looks ragged, particularly the lower banner.

Do I need to sharpen or what can I do to sharpen up the text?
http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis
CS2/XP

Wow that looks great now.

Dennis Hughes wrote:

Success!! Thanks to the good advice.

Now you just need to do the same with the tabs, and make sure they are EXACTLY the same width for the on and off tabs. When I roll over any one of the tabs, they scruntch up a couple of pixels, meaning your highlighted buttons are a couple of pixels less in size than the "off" tabs.

Larry,

Thanks for the sharp eye. I was looking at them last night, wondering if they needed the same treatment. You answered my question. Good find on the width, I had missed that.

Dennis
"Larry Bud" wrote in message

Dennis Hughes wrote:

Success!! Thanks to the good advice.

Now you just need to do the same with the tabs, and make sure they are EXACTLY the same width for the on and off tabs. When I roll over any one of the tabs, they scruntch up a couple of pixels, meaning your highlighted buttons are a couple of pixels less in size than the "off" tabs.

I’ve redone the navigation buttons and can see the difference. Also rounded the corners of the three images on the home page and feathered the image edges.

This is slowly taking shape.

Other ideas are very welcome.

http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis

"Dennis Hughes" wrote in message

I’m working on a new web site and made up a top and lower banner with a speficic font.

I saved the psd file and then trimmed the transparent background, then saved as a gif.

Viewed on my monitor, the text looks ragged, particularly the lower banner.

Do I need to sharpen or what can I do to sharpen up the text?
http://www.partyarchesllc.com/test9.htm

Thanks,

Dennis
CS2/XP

in article jTcxe.12564$, Dennis
Hughes at wrote on 07/01/2005 7:59 AM:

I’ve redone the navigation buttons and can see the difference. Also rounded the corners of the three images on the home page and feathered the image edges.

This is slowly taking shape.

Other ideas are very welcome.

http://www.partyarchesllc.com/test9.htm

The center picture should be cropped to take out the woman on the left side that is now half cut off…

Finish the job and just cut her out of the picture.

Lon,

Thanks for the critical eye. I did that and it did improve the image.

Dennis

"Lon Chaney (Man of 1001 Faces)"
wrote in message

in article jTcxe.12564$, Dennis
Hughes at wrote on 07/01/2005 7:59 AM:

I’ve redone the navigation buttons and can see the difference. Also rounded
the corners of the three images on the home page and feathered the image edges.

This is slowly taking shape.

Other ideas are very welcome.

http://www.partyarchesllc.com/test9.htm

The center picture should be cropped to take out the woman on the left side
that is now half cut off…

Finish the job and just cut her out of the picture.