: How can I make my Photoshop text appear like it does on the web? Do I really have to design everything in Photoshop with anti-aliasing set to "none"? I'm sure there is a better way.

@Radia289

In Photoshop CC, we added new aliasing modes for your fonts. Instead of "crisp", or "strong", try the new "Mac LCD". You'll get a 100% web safe design.

Vote Up Vote Down

@Megan533

To my eye, rendering in a browser is somewhere between Photoshop's "Sharp" and "Crisp" on a Mac, and between "Crisp" and "Strong" on Windows. I suggest using "Crisp" for live text to the graphic designers I work with. The default "Strong" always sets them up for disappointment. ;)

Vote Up Vote Down

@Hamaas979

Short Answer: You can't.

Not only is Photoshop never ideal for knowing how your typefaces will render outside of it, it's just not ideal for working with fonts in general. (When I worked at a Design Firm/Print Shop, everything designed in PS had to be exported as a PDF for this same reason). Then comes the issue of the web, it's browsers and the OS that runs those browsers. So far, as far I am aware of, OS X is the best in terms of rendering fonts appropriately, whereas Linux comes second, and Windows of course comes last. The reality is, they all use different algorithms for rendering fonts, and you're not going to get the same result everywhere. If there were a solution, it'd be that we all switch to Linux, Macs, or wait 'til Microsoft either succeeds next time with Windows Metro (Sorry, I hate calling it Windows 8) or totally blows it, or you can use Cufon (I wouldn't recommend it.).

Just my 2 cents,

Patch

Vote Up Vote Down

@Angie364

No. The new line of thought is to avoid Photoshop for layout and typography design and start in the browser as early as possible.

By passing the client an actual URL as opposed to a Photoshop comp, you avoid the client's expectations being dashed when the final product renders slightly different in their browser of choice vs the Photoshop comps.

Ultimately, it's our responsibility to educate the client and make them aware of the unavoidable typographical discrepancies that occur between browsers and OSs.

Vote Up Vote Down

@Pierce403

Most operating systems and browsers render with antialiasing or sub-pixel antialiasing. Sub-pixel antialiasing is common on desktop platforms, like Windows (with ClearType) and OS X. Standard monochrome antialiasing is common on mobile platforms, where the device's sub-pixel order may change with device orientation, and where sub-pixel rendering isn't as crucial, because they often have higher pixel density displays.

Aliased text rendering is common on Windows XP, where ClearType is disabled by default. Windows Vista and newer have ClearType turned on by default.



Rendering in Photoshop vs Windows vs OS X vs iOS vs Android vs WebKit vs Firefox (Gecko) are typically all different. So there's absolutely no way you can build something in Photoshop and know that the text rendering will be the same, unless you take a screenshot and add it to your document as a bitmap layer.

Vote Up Vote Down