Re: 120 DPI & HTML text woes

Yeah wrote:
Ever since I upgraded my Windows display to 120 DPI (kind of a necessary change), fonts have been clearer and graphics have been crisper. However, the 25% automatic increase in the text size on my web site has thrown it all askew.

The whole concept of 'screen resolution' has been utterly bastardised. In one place, Windows tells me that my 'screen resolution' is 1280x1024. In another it says that if things look too small I should 'increase the DPI to compensate'.

Now logic tells me that if I pack more dots into each inch, images will look smaller - but that ain't what happens.


Combining my monitor's native resolution of 1280x1024 and the XP setting of 120 DPI, everything else is great, but now standard Serif on my web site looks like I'm reading a Dr. Seuss book.

What you have done is told your display device to use a grid of 1280 pixels by 1024 pixels to display images (noting that each pixel is made of three dots - one each for red, green and blue). Those numbers may not bear any relationship to the number of physical pixels that your screen has. LCD screens look best if the grid dimensions are the same as the display's physical pixels, CRT screens can usually look good for a wide range of grid sizes - a 17" CRT will still look good at 1600x1200, but a 17" LCD would look like crap (if you could set it that high) even though the CRT almost certainly has a smaller physical screen in inches or cm.

I'll guess that you have an LCD that actually has 1280x1024 physical pixels and that they are are spaced at about 96 pixels per inch (ppi). Measurements of my own physical screen show they may be at 94 ppi.

By telling Windows to use a setting of 120 dots per inch (dpi), you are telling it to send image to the screen that would appear correctly sized if your screen had 120 ppi. The fact that your physical screen probably is 96 ppi means that the images appear larger.


Obviously, downscaling my text (i.e. size: x%) will apply to everybody, so that's a no-win scenario. Now I see myself having to "clean up" the text flow in my entire web site (sizes too big, one word on the last line of a paragraph, etc.).

You are probably now seeing your site the same way someone with a standard display of 1024x768 sees it. Since there are still a very large number of screens of that size, you may have just realised what your pages actually looked like to a good proportion of your visitors.

Note that shifting your screen 'resolution' to 120 dpi with a setting of 1280x1024 pixels effectively makes your screen 1024x768 pixels.

Have a read here:

<URL:http://blogs.msdn.com/fontblog/archive/2005/11/08/490490.aspx>


I've been educated enough to know that coding text in pixels is a no-no. But I need some guidance in reoptimizing my text so it may perhaps be most comfortable for everybody.

Make the majority of the text content on your site 100%. Let users adjust their browser settings to whatever suits them best. Design your site so that it is functional at any reasonable screen size (say 320x240 up to whatever) - it may only look fantastic within a small range, but it should still be functional for everyone.

Note that IE7 allows users to set a 'zoom' factor to make entire pages look larger/smaller - won't that play havoc with font sizes?

Does anybody have any creative insight on how to solve these problems?

Yes, see above. But that is a goal, in reality you will likely have to compromise.

Incidentally, 'pixel' is considered to be a relative unit, though many believe it to be absolute. 'Point' is an absolute unit as it should be the same size regardless of the display device.


--
Rob
.