Text in Photoshop and Fireworks Help

[EmmaGale]

I am having a few problems with a logo graphic I am creating. Please see the template page below.

http://www.northdorset-pct.nhs.uk/indextest.html

I have tried in both Fireworks and Photoshop 6 but I cannot seem to get the lettering to appear very clear.

i have tried large text and making it smaller, every anti-aliassing option from none through to strong and nothing seems to be working.

I have not come across this problem before although can honestly say that I have not used either program very much for text.

i hope some kind soul will help me.
Kind regards
Emma Gale

[blastradius]

Emma,
Your link doesn't seem to me to be going to where you wanted so I don't have a visual of what you are working with. The only thing I could think of that might cause this would be if image resolution is really low or you are really zoomed in on the image.

[Jeff Colburn]

Hi,

It could be a few things.

Be sure the width and height are set properly, that is, that you are not reducing the size of the graphic by making the width and height smaller than the graphic really is.

You could try a different font, although this font shouldn't be causing a problem.

You could make the font larger.

For the life of me I can't remember what it's called, but Photoshop puts a 1 pixel border around text. You can change this border to the background color, and this sometimes fixes what your problem is.

Have Fun,
Jeff

[cthathem]

Hi :) just some comments..

What are you trying to do with this css code:
#smokeheader {
background-image: url(file:///E|/web%20for%20north%20dorset/smokestop/smokebanner.jpg);
}

The Problem at Hand
The graphic looks odd because it's a GIF that is both transparent and RESIZED via HTML! Don't do that ;) ... it will make the picture look terrible. Either create your picture in the resolution you need it in (212 x 49px), or you make the background blue (the dark blue of your gradient, I guess, would be appropriate).

If the background is transparent, and the text is resized using the width and height attributes of the img tag in html, the browser doesn't know how to blend the solid pixels with the transparent ones... so your graphic looks clunky. If it was solid, then the browser would blend between the white of the text and the blue of the background,... :) but I guess you are WAY better of with a logo in the appropriate size!

:) Hope I could be of help to you..
Georg

[EmmaGale]

What are you trying to do with this css code:
#smokeheader {
background-image: url(file:///E|/web%20for%20north%20dorset/smokestop/smokebanner.jpg);
}

OK the page you see is the draft template for the new site. One of the pages will have a different colour header - grey for smoking :o) and different colour rollovers on the sidebar. I have renamed the table cells with a different class ID so that when you take the link the header changes to a grey gradient. If there is a better way of doing this please let me know. Im still learning about all this cSS stuff !

Either create your picture in the resolution you need it in (212 x 49px), or you make the background blue (the dark blue of your gradient, I guess, would be appropriate).

I have now tried that and it still isnt working too well. I created the image again in photoshop to the correct size and removed the resizing. it still isnt liking it too much. If I change the background its fine... this is really puzzling.

:) Hope I could be of help to you..

Your help is very much appreciated.

kind regards
emma[/quote]

[EmmaGale]

For the life of me I can't remember what it's called, but Photoshop puts a 1 pixel border around text. You can change this border to the background color, and this sometimes fixes what your problem is.

This was it..... thank you.. Its called Matting and as you save the gif you have an option to change the matting to the foreground, background and other options.

Thank you all so much for your help!!

Emma (not going the throw the computer thru the window now) Gale.

Kind regards

[EmmaGale]

False alarm. It is only working when I change the matting to background colour - which I thought to mean the background colour of the image which was transparent. It is actually taking the background colour and for the ease of being able to see the test I was testing with blue on a white background and it took white to be the background.

This is still very very puzzling....

Kind regards

[cthathem]

Hm, well.. the background color for the matting can be troublesome too, yep. Did you think about trying:

1) a font, that looks good altough you do not use antializing?
2) try setting the option for matting background to 'none'

This may not fit your current psd and style, but maybe playing around with different fonts, that look good without antializing them (using px for sizes, instead of pt) could prove being a suitable workaround, if you can't handle it in another way...

Georg :)

[EmmaGale]

1) a font, that looks good altough you do not use antializing?
2) try setting the option for matting background to 'none'

Unfortunately I need to use arial because it is our house style style.

I found some information about transparent background gifs on a tutorial for PS5 here: http://<br /> http://www.webclass.r...xt_on_the.html

There are a number of notes at the bottom which say that the G89a format facility is no longer availabe for PS6 and later.

Does this format mean anything and can it help me?

Kind regards

[EmmaGale]

http://www.webclass.ru/eng/Tutorials...xt_on_the.html

Sorry link wrong in message

[cthathem]

No, I guess it's not the Gif98 that's the problem. But you could check out other file formats, that's for sure. Consider PNG, for example. It may be bigger in the end, but you may find PNG8 exactly the thing to look out for. It also supports transparency! :)

I'll check back later, if you still experience any problems. Maybe I should try for myself :)

[EmmaGale]

Hi there..

No PNG is making the NHS logo orange and the text may be slightly better but does not make a significant difference.

I really would be grateful if you would take a look and try it yourself. It may be that im just missing something very simple.

I cant believe that something that appears to be so basic is really difficult to achieve... computers eh? who'd have em ;o)

thank you for your help so far.
emmagale

[Jeff Colburn]

Hi EmmaGale,

I was messing around in Photoshop Elements and created your logo in a few minutes. I'm not sure if the canvas size is correct, the the font looks like the same size. Give me an e-mail and I'll send you the .PSD and a .GIF of the logo.

Have Fun,
Jeff

[cthathem]

Hoi! :)

Could you pm me your mail address? I'll send the pictures to you :D ...

By the way, 212 x 49 isn't the correct size, it should be 212 x 46 (if I resize your picture from the original 379 x 83px)!

I did 3 pics...

1) with your blue background, working absolutely fine.
2) with transparent background, but with blue matting, it's still fine, as long as you stick to the background.
3) as png, without any matting.. dunno if that works out on all browsers, but if png turns your graphics orange, this maybe is due to an error in the compression/palette.

geg