Advertisement


PSD fonts and Html Page fonts


Question

I am a web developer. What happens is that the Client sends a PSD (Photoshop designs) to the company. Then the designer needs to create a HTML page from the PSDs

What happen every time is that the designer does not create the HTML with same fonts ie the boldness goes away and the font does not look similar as per the PSD means the quality is too degraded.

And the designer can convince my seniors that this is not possible i.e. The same font size, boldness cannot be achieved in the html while conversion

Can you please specify is it really true? or the designer is just fooling the developers.

I am really sorry if this question is not correct is this website

2012/04/05
1
3
4/5/2012 6:49:00 AM

the designer does not create the HTML with same fonts ie the boldness goes away and the font does not look similar as per the PSD means the quality is too degraded.
...
this is not possible i.e. The same font size, boldness cannot be achieved in the html while conversion
...
Can you please specify is it really true?

This is a fairly accurate statement. It is impossible for Photoshop text to look the same as text rendered by the OS. There is more detailed information in this answer, but to summarize: Photoshop has several different anti-aliasing options, and none of those options are the same as what your operating system's font smoothing will do.

For example, here is a comparison of 4 fonts using Photoshop's "sharp" AA with an HTML render using Windows ClearType (Font size set at 12pt in both Photoshop and CSS):

font comparison

With some manual tweaking, a designer can make the HTML CSS more closely approximate the Photoshop output, but converting a PSD to HTML is not as simple as copying font settings verbatim. Because of this, the results will always be an interpretation of the design and not a pixel-for-pixel recreation.

As Lauren and others have mentioned, it is part of the designer's job to explain this in a clear way so that the client does not maintain unrealistic expectations.

2017/04/13
5
4/13/2017 12:46:00 PM