4

This question already has an answer here:

I'm designing the UI for a financial application. I'd usually do high-fidelity mockups using Photoshop and send them to the developers. What I have noticed is that the text in the actual product looks different from my mockups, but they are in fact the same font. The left image is the hi-fi mockup, using Arial. The right image is the actual product, also in Arial. I tried all the different anti-aliasing options, but none gets me close to the image on the right.

Most websites/web apps I see don't have this problem. I wonder how they do it?

enter image description here

marked as duplicate by Yisela Sep 5 '13 at 21:17

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

  • Photoshop anti-aliases text unless you tell it to stop. – Scott Sep 5 '13 at 19:20
  • to extend what Scott said: the OS and the browser also anti-alias (or use sub-pixel rendering) unless disabled by the user, but they do it differently than Photoshop. Photoshop overrides/ignores the OS settings for rendering text in images. – horatio Sep 5 '13 at 20:34