Fuzziness around the edges of letters

[narnia]

If youlook at my website, Americandreamhomeplans.com, you'll see that the title in theheader is kind of fuzzy around the edges of the letters.
Icreated it in Photoshop, and I cannot seem to get the edge’s sharp and clear nomatter what I do in Photoshop. It also doesn'tseem to make any difference if I save it as a .PNG or a .jpg.
I havetried re-doing it from scratch several times, and it doesn't seem to make anydifference. I've created other headertitles in Photoshop that have come out clear and sharp and I haven't doneanything any differently. Can anybodytell me what I'm doing wrong?
Thankyou very much

 

[Tom Mann]

Although I didn't look at the HTML for that page, the reason for the difference is almost certainly that you brought in the top two lines (ie, "American Dream" and "Home Plans") as a bitmap, probably a png, whereas all other text on the page is probably ordinary HTML text that is completely and dynamically scalable to whatever size is needed.

The attached image is a screen shot with a magnification of around 2x. It shows how most of the text still looks perfectly sharp, whereas these two header lines have broken up into individual pixels.

HTH,

Tom M

 

[tomross]

I think the problem here is that your text is not anti-aliased. In the text styling it looks like you've got 'none' set as your anti-aliasing method, where it should preferably be 'smooth'. (Look for this in your top options bar).

 

[Tom Mann]

I had a moment, so I took a look at the HTML for that page, and, as I expected, the two lines of text in question were brought in as a png bitmap:
http://www.americandreamhomeplans.com/wp-content/uploads/2013/07/ADHP-Header2.png
(line 23 when the source for the page is viewed using Firefox's developer's tools).

Now, what Tom R says about the lack of anti-aliasing is absolutely true. However, even if you change this to "Smooth" or "Strong" anti-aliasing, it will still look coarse if someone with poor eyesight decides to magnify the page using the cntrl-+ command.

IMHO, a more general way to fix the problem is to display this text as one does all the other text on the page, not as a bitmap (ie, an image of text). The only problem you may run into is that you may not find the exact same script font used by the corporation and may have to settle for a similar font.

HTH,

Tom M

 

[narnia]

Thank you very much!

 

[Tom Mann]

Glad you stopped back in. Were you able to fix the problem?

Tom M