Sub-Pixel Text Position in Photoshop
- Date
- 20.03.09
- Comments
- 9
This is my biggest peeve in when trying to design a web site using Photoshop: text objects can't be forced to whole pixels. They always seem to render their start point from a sub-pixel location. In the following image, you can see two separate text objects that I created, each with the exact same text, but each is rendered slightly different because of its sub-pixel starting location.
Is there any way to fix this? I've been searching the web and looking through everything I can think of in Photoshop, but not finding an option like snapping shapes to pixels. Not that I have any intention of switching, but does Fireworks behave the same way?
9 Comments
No, fireworks does not behave this way. It actually lets you render the text in the same way your native OS does. At least that's been my experience. Things may have changed since cs2 and cs3.
Because typefaces vary so widely in how accurately they're aligned, it would be nearly impossible for Adobe to create a 1-button solution.
What we can do though, is tweak. Sometimes it helps to have kerning set to "optical", but I prefer to manually adjust the sub-pixel spacing by selecting where I want to make the tweak and using option-leftarr or option-rightarr to nudge the letters a tiny bit.
Other options that I've played around with:
- keeping an html file handy that has text I can edit and screengrab
- using Illustrator smart objects (which has decent results).
Honestly though, I just prefer using Photoshop to deal with my graphics work, which is what it does best and not stress too much over text.
All I really want is for my baseline to line up to a pixel. I don't understand how hard that is for Adobe to do.
Anton: You have a good point with keeping an HTML file handy, but I think that would just cause more headaches when anything needs to be updated.
Sometimes changing the antialiasing method can help. I've had mixed results by setting the alias method to "sharp" vs. "strong", depending on the font and the size of the type.
Don't know a way to actually fix this, but you can try do subpixel positioning by doing "free transform" while beeing zoomed in extremely. Then reposition the layer by keyboard arrows and it moves by fractions of a pixel (the more you are zoomed in, the finer the shift). Dare to say this subpixel placement appears to work (has positive results on the text) only horizontally.
Petr: While that works, it's not a great solution. It takes a lot of time to nudge and get the baseline to set vertically and horizontally at a full-pixel–especially when you're working with multiple text layers. I don't see why there isn't an option to just have it snap on its own.
I'd love to be there but, you know, I'm really far from USA :)
Your session sounds really interesting! I wonder if there will be some online videos about you and the other speakers (I've seen a lot of good sessions concerning great topics!)
However... have a good time at this conference, I'll follow things on twitter (ok, actually I'm pretty sure I'll forget to do that :P)!
This thread isnt actual but I still want to write a helping comment.
Dont use the brush tool!
Use the Pencil !
This one is able to draw pixel for pixel!
Hope this helps you.
Cheers
While not always a perfect result, I would recommend disabling Fractional Widths setting on text in PS CS3. This is done by:
Go to the Character toolbox on the right side of the screen (the one where you set the font, spacing, etc) Click on the more options icon (it's that little icon with 3 horizontal lines and a down facing arrow on the top right of this toolbox). Make sure Fractional Widths is UNchecked while you are editing a particular piece of text. Hope this helps guys.