Text in my Photoshop image looks "blurry"


Question

I am creating a website header in Photoshop CS5, however when I look at it, the text looks very blurry and I have no idea why.

I use the Web preset. What do you recommend for the sharpest and best results?

Here's the current mockup:

Header

1
9
11/6/2013 5:05:00 AM

Accepted Answer

By default, Photoshop applies some anti-aliasing to the text layers. Alex has provided a nice comparison in another question:

comparison

The anti-aliasing options are available on the toolbar and in the Character window:

anti-aliasing options


NB: if you are planning to use the text layers as regular (HTML) text in the final product, the browsers most probably will render the text differently than Photoshop does. More info on this you can find on the same "Font (anti)aliasing in Photoshop" question mentioned.

14
4/13/2017 12:46:00 PM

Make sure the height and width attributes (or CSS) for your img tag match the actual size of the image. Otherwise, it will be rescaled by the web browser, and many web browsers do this in an ugly way. Even the ones that do it relatively well may render the image somewhat blurry.

If you want to make sure that it looks right, keep the pixels 1:1.


Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
^