0

I'm using Tahoma font in my site. I'm using all the css settings like text-rendering -webkit-font-smoothing to ensure that my font renders properly in browsers.

The only thing is the stroke contrast of the typeface is rendering badly in browsers (tested in mac - chrome, firefox & safari).

Text in Photoshop looks like this. Observe the letters 'I', 'T', 'P' especially bold letters. The stroke contrast looks very beautiful here.

photoshop text

This is the how browser renders. Looks very bad.

enter image description here

Is there any way that I can fix this issue. Is it possible?

8
  • Are you using a separate bold font file for the bold text? Or are you letting the browser do it? The browser can only approximate bold fonts Sep 24, 2015 at 14:56
  • I'm having bold face too. I have fonts installed in my machine. Even the normal font renders the stroke contrast differently if you observe them closely.
    – bharat
    Sep 24, 2015 at 15:01
  • What are you expecting to see?? the 2nd one clearly looks smoothed (and better) Sep 24, 2015 at 15:43
  • In Photoshop your image is handled like a photo/picture. The rasterisation is done by Photoshop. In a browser the (system) font render technique kicks in (and the color profile is turned off). Now redering should look like what you would see in other programmes that treat text as text and not as a photo. So render engines are different and give you different results. This is true for both regular and bold. But the bold has another trouble. It's not a true one. It is a 'faux bold' (Google that ;)).
    – allcaps
    Sep 24, 2015 at 16:11
  • 1
    If I had a nickel for every time in the 90's I heard from a client --"How come the type on the web site doesn't look the same as it did in the Photoshop mockup?" . . . I'd have some nickels. - Two different rendering engines. You can't make one engine run like another. This is why it is sometimes better to design in a browser rather than creating a full page mockup in other software.
    – Scott
    Sep 24, 2015 at 17:33

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Browse other questions tagged or ask your own question.