Photoshop won't let me be small gracefully

January 30, 2009 1:52 AM

Whenever I try to write in really small characters in Photoshop, or, come to think of it, save anything small (like an company logo for email signatures) - it comes out all blurred. I'm saving as non-interlaced PNG but I think the same would happen if it were a JPEG. I've had this problem for quite a while, through several different versions of Photoshop. At the moment I'm on CS4. Photoshop isn't really my thing, I use it for touching up digital photos, not creating logos - but it would be great to get this resolved once and for all: how can I create tiny images without pixelation/blurring. Any help appreciated! Thank you!
posted by dance to computers & internet (11 comments total)

duh... it's looking like it was a DPI problem...testing.
posted by dance at 2:12 AM on January 30

hmm...still not exactly sure but image size's 'auto...' window helped a lot.

I'm still a little unsure how to get Photoshop to do what I want it to predictably in this realm where size, pixels and resolution meet. I've encountered this before when printing digital photos with Photoshop.
posted by dance at 2:39 AM on January 30

2 issues.

1)It's a vector/raster problem: Photoshop saves data as a series of pixels, so any text will be rendered 'blurrily' in a sense. If you want sharp, accurate data that you can send to a printer, use Illustrator instead. But that's a different issue...

2) It's a resolution/PPI problem. You have to realize that 'tiny' on the screen and 'tiny' in the file are separate things -- that is, a small logo still needs to be a considerable size (in terms of pixels) to not be blurred.

I'm guessing that you're making a document, inserting some small text, and realizing that the text is blurred. What you need to do is to make a file large enough that the small characters are still clear when 'zoomed in' on -- that is, the file has to have enough pixels.

After that, you can also decide how many pixels the file uses in printing each inch. Right now, you probably have a file that has X amount of pixels and is set to print Y pixels per inch. What you need is a file that's 3 * X amount of pixels and is set to print 3 * Y pixels per inch. (It may be 2, 3, 4, whatever, you get the idea.)

You can do this in image>image size.
posted by suedehead at 2:50 AM on January 30

Could it be that that's just how tiny-size fonts look after anti-aliasing? You might want to consider turning off anti-aliasing for the text tool.
posted by ignignokt at 2:52 AM on January 30

Thanks, suedehead and ignignokt.

I've used vector images before for my thesis, but I'm not sure they'd be useful as an email logo. (I disagree personally with including uneccessary HTML/images in email messages but this isn't my call.) Wouldn't it have to be a GIF/PNG/JPEG to have the most widespread readability?

I realise that small file size and small physical size are different things, but thank you for your answer, it's hard to know from what level to answer the question - especially when this is such a seemingly obvious issue I'm having trouble with.

Since I got the results I wanted with the auto option, I've not played about with anti-aliasing. I'll try that as well, though.

Now, strangely, the PNG email signature I sent off to a friend to test has come back in the reply looking horrible, and is a GIF to boot. I wonder why (presumably) his client mangled the image?
posted by dance at 3:19 AM on January 30

The key thing here is to discard all consideration of DPI (or PPI, or centimetres, or inches, or furlongs). For screen images these concepts are entirely useless. You need to think in pixels.

Work on your image at 100% magnification in Photoshop, and that's exactly how the image will appear as a GIF/PNG/JPEG in your email signature. All you need to do is make sure you export the image at 100% (i.e. the same number of pixels wide and high as you used to create the image. You may need to set your measurement units to pixels in the preferences.

Text antialiasing is quite flexible in Photoshop - you have several options. Select the text and choose 'None' in the font-smoothing toolbar, and you will see that the text is pixel-perfect with no 'blur' (although it may appear jagged). This works best for font sizes of 10pt and below, although you'll need to use a font that is optimised for use at smaller sizes. For larger sizes, try all of the smoothing options to see what looks best, remembering to view the document at 100%.
posted by le morte de bea arthur at 4:31 AM on January 30 [2 favorites]

Perhaps I don't understanding the problem correctly but have you tried resizing the image to it's smaller size as the final step.

In other words, if you want the final image to be 50 x 10 pixels then:
1. Create an image 500 x 100 pixels.
2. Add the text to this image using a font large enough so that it takes up most of the image
3. Resize the image to 50 x 10 pixels
4. Save as a .png or .gif*

*The way .jpg files are compressed means they aren't very good for images containing text, rather use .gif or .png.
posted by Gomez_in_the_South at 4:48 AM on January 30

Try a Pixel font ?
posted by Duke999R at 6:26 AM on January 30

gomez,

yes, that was my methodology. Logical and tried and tested.

Only it didn't work! Very strange. What did work was letting the auto box work out the settings for me.
posted by dance at 7:59 AM on January 30

If you are comfortable with vector design, then it may just be easiest to design the logo in something like Illustrator and then save it as a jpg/gif/png from that program. You may find that it will come out sharper. Illustrator has the same "Save for Web" dialog box that Photoshop does and you should be able to get a good result.

Otherwise, I agree with le morte de bea arthur (best username on MeFi ever, btw) that you should experiment with the text antialiasing options. Fiddling with this usually gives me good results. There are different options to choose from like "strong," "sharp," "crisp" and "smooth." And of course, changing it to "none" is sometimes the best option, too.
posted by bristolcat at 8:49 AM on January 30

I completely disagree with the "work big then make it small" approach. When it comes to fonts I find it better to design it at the exact size it'll be instead of shrinking it from something bigger.

If you have a logo that's already in vector form, then put it in the image as a smart object. That way you can scale it down easily and you'll get better anti-aliasing results.

But I have to admit your original question is a little vague -- I'm not sure exactly what you're trying to do and what your intended results are.
posted by O9scar at 9:58 AM on January 30