-
1. Re: How to exactly replicate webpage fonts in Photoshop? Can it be done?
Chris Cox May 25, 2010 10:30 PM (in response to TF22Raptor2)I am trying to simply replicate a peice of text in photoshop so that it is pixel by pixel exactly the same as what I would see in a webbrowser with some text from a css/html based webpage.
Sorry, you can't (without copying text from a browser).
Part of the problem is that every browser renders text differently.
And part of it is that many browsers currently render with an anti-aliasing style that Photoshop doesn't support (color edges).
Then there's the lack of kerning in browsers and ....
We've been thinking about how to replicate browser font rendering, but it's not nearly as easy as it sounds.
-
2. Re: How to exactly replicate webpage fonts in Photoshop? Can it be done?
Zeno Bokor May 25, 2010 10:40 PM (in response to Chris Cox)Actually, it's not so much the browser rendering as it is the ClearType smoothing from Windows that's making text look like that outside of Photoshop. With ClearType disabled the text at small sizes in browsers will look just as jagged as it does in Photoshop when you set Anti-Aliass to None (though it gets a tiny bit of anti-aliassing at larger sizes).
-
3. Re: How to exactly replicate webpage fonts in Photoshop? Can it be done?
Marian Driscoll May 26, 2010 3:45 AM (in response to TF22Raptor2)Why don't you create the text in HTML/CSS instead of burying it in your graphics where it becomes unreadable to search engines and people with accessibility issues?
Text can be layered on top of an image via HTML/CSS.
-
4. Re: How to exactly replicate webpage fonts in Photoshop? Can it be done?
TF22Raptor2 May 26, 2010 4:00 AM (in response to Marian Driscoll)Hi Marian yes that is what I will be doing, it's just that I design everything to pixel perfection in photoshop before building the page and want to get the fonts to look correct in the initial concept design.






