Text Legibility: Using 120 DPI Fonts on High Resolution Displays
Let's talk about fonts. As somebody who spends far too much time in front of a computer each day, I've become incredibly picky about display quality, and fonts in particular. With Windows XP, ClearType, and a sufficiently high DPI display, onscreen type is now getting close to the legibility of paper.
There's only one problem (well, several actually, but they're related): People aren't taking advantage of this!
It's very unfortunate, but I run across all kinds of people running LCD displays below their native resolution. The irony is that they're suffering reading blurry low resolution fonts because their display is so high quality (high DPI) that normal font sizes are too small to read comfortably!
The solution is to bump up the DPI setting in Windows. This recalibrates Windows to better match the actual number of dots per inch on your display, so that when an application requests a 12 point font it's approximately 1/6th of an inch on your screen -- just like it would be on paper -- not 1/8th or 1/10th or even smaller.
Unlike when you reduce your resolution, when you increase the DPI there are more dots (pixels) that can be used to more precisely form the characters. This means instead of just getting bigger, the text gets more readable: O's look round, not blocky; serif fonts have serifs; spacing and kerning improves; and bold and italic text text doesn't turn into a muddy mess. ClearType improves these even more by taking advantage of sub-pixel rendering.
Setting your DPI
- Go to Display settings, click the Settings tab, and then click Advanced.
- Click the General tab, and read it.
- Choose your DPI. You can use "Custom Setting..." to view a ruler on your screen so that you can hold up a real ruler and match DPI exactly. However, a good rule of thumb is to start with 120 DPI if this is the first time you've tried increasing the DPI setting.
- OK out of the dialogs and (sigh...) reboot. Let XP update the fonts if needed.
Tweaking Font Settings
If you're like me, 120 DPI is just a bit too big for text in standard window decorations. I tweak the Display settings further:
- Go to Display settings, Appearance, Effects.
- Turn on ClearType! If you have a display that necessitates 120+ DPI fonts you need ClearType. Besides the obvious anti-aliasing aspects, ClearType gives fonts better weight. Without ClearType the fonts will be too thin and light, decreasing readability.
- Click OK, and then click the Advanced button.
- Bump down Icon, Menu, Message Box, Selected Items, and Tooltip by 1 pt.
- Reduce title bars and related controls to a sane size.
- Fix icon spacing and scroll bar width.
Alternatively, you can download and try my theme file..
Caveats
There are a few minor issues with running at 120 DPI or above in Windows. First, a few applications may have drawing issues or otherwise not work properly. I can't tell you what they are because they got purged from my software library a few years back. They must not have been important (heh).
Web pages have this problem as well, particularly when they use fixed-pixel font sizes. Like bad software they quickly get eliminated from the selection of sites I visit. Fortunately this problem is a lot less common than it used to be.
The other caveat is that icons and most toolbars do not scale with the DPI setting (although dialogs do), so those may become too small to use comfortably. For people with normal vision this isn't a problem unless you start getting into the extremely high-end displays such as IBM's T221 or Viewsonic's VP2290b. However, if you are having this problem I have an instant solution: send it to me. Maybe I'll go in and fix IE's PNG transparency support or CSS bugs if you do, but I can't make any promises. ;-)
Finally, if you increase the DPI setting and use Office 2003 you'll have to put up with the resampled toolbars and other UI elements:
Note that this is a PNG file, not a lossy-compressed JPEG. I talked to the Office folks about this before it shipped, and it is simply an unfortunate issue where the realities of software development (i.e. money and deadlines) meant that they couldn't substitute higher resolution images or offer an option to turn off scaling. Ironically, scaling the images was done to better support higher DPI displays.
Comments
- Anonymous
March 22, 2004
Any chance that IE 6 will now finally allow the user to resize any web text (Like IE 5 Mac since year 2000, Mozilla, Opera and Safari) on a page? - Anonymous
March 22, 2004
Forgot to add the URL, read Jakon Nielsens article on the issue:
http://www.useit.com/alertbox/20020819.html - Anonymous
March 22, 2004
I've been using 1600x1200 with 120dpi fonts and cleartype for a while now (luckily my Laptop has 1600x1200 as it's native resolution too) - I am loathe to go back to horrible 1024x768 screens now... - Anonymous
March 23, 2004
I'm at 1400x1050 with ClearType (no 120 DPI fonts yet). - Anonymous
March 23, 2004
The comment has been removed - Anonymous
March 23, 2004
I have a DELL Lattitude D800 with a 15.4" widescreen lcd. The problem is that the native resolution is 1920x1200. Of course, 120dpi was turned on by default.
Why I turned it back to 96dpi:
- Graphics (like the google homepage image) & certain clipart look slightly distorted (seems to be mostly round/oval shapes). On the other hand, jpegs from my camera look ok.
- Icons in the taskbar (both quicklaunch and the tray) and start menu look pixelated.
- Some dialog boxes on old apps don't work as well. For example, on one install wizard, the OK button was out of reach, and the dialog couldn't be resized.
- I use a 17" LCD monitor at work connected to my laptop. I'm able to also use my laptop lcd at the same time, effectively getting a multiple monitor setup. The only downside is that I either drop the laptop to the 1280x1024 resolution of the monitor (which widens everything on my laptop) or leave it on 1900 and suffer the small text. I can compromise and set it to some resolutions in between those two values, but since it isn't the native res, everything is still a little "fatter". 120 dpi would be great here, but I have to do it for both screens or none.
I know that in order to really do multi-monitor setups, you need 2 monitors with the same size & resolution next to each other, but the current set-up is so useful at times, I'm loathe to give it up.
One question: I just tried 120dpi again - why did Windows re-arrange the icons on my desktop after the required reboot? Arrgghh... - Anonymous
March 23, 2004
Robi: Don't quote me on this, but I think we fixed this for whidbey and made a hotfix for Vs.Net 2003. If you contact me (see me blog) I can try and track down the KB entry that references this for you. (as usual this post is provided as is) - Anonymous
March 24, 2004
Andrew, regarding your list:
1) I can't imagine why graphics would be distorted, unless it's simply an aspect ratio problem with the resolution not properly matching the dimensions of the screen, or a utility Dell installed.
2) Download my style. If you set the window title text sizes right they're still plenty big and you won't get any distortion.
3) This has become very rare. As I stated, I throw out apps with this problem. :-)
4) Yeah, there is no per-screen DPI setting. It might be possible for a video driver to do this, but I'm not aware of any that do. Maybe in Longhorn... - Anonymous
March 24, 2004
The comment has been removed - Anonymous
March 29, 2004
Great tip for improving legibility of fonts - Anonymous
March 29, 2004
Great tip for improving legibility of fonts - Anonymous
April 06, 2004
Thanks for the great info! This seems to be the only page I have found with information reguarding the issue I've been dealing with. I too have a dell laptop (inspiron 8600) with the ati mobility radeon 9600 and WUXGA, 1920x1200. It shipped set at 120 dpi, but I seem to have to set it back to 96 dpi due to web sites that seem to draw very slow. Now I know its because of the fixed font size. Thanks a lot for the info! - Anonymous
May 04, 2004
I just found this gem on MSDN:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/overview/highdpi.asp
You need to add a regkey to IE to turn this on. - Anonymous
May 16, 2004
The comment has been removed - Anonymous
May 17, 2004
rebus, sounds like a good monitor. :)
If you haven't read them already, some of the other posts and links has some suggestions for IE, although Liquid Surf may already expose all of that.
Beyond that, others may have ideas. - Anonymous
May 20, 2004
These advices doesn't really help me. Like harry above I have an dell inspiron with 1920x1200 native resolution. But cleartype is distorting Shapes like "S" in the Middle. CT tuning didn't help me. there are some fonts that looks better than others, but I do have Suse Linux 9.1 installed, and the x11 display server with antialiasis and subpixel looks about 200% better and really paperprint smooth. I am sorry to inform you that windows xp is a very old os system now developped primarily for small 96dpi displays. Its lacking scalability for big screens. - Anonymous
May 20, 2004
Nicco, I have not seen the distortion you are talking about, but I'm always interested in seeing how others do it. See my other entry:
http://blogs.msdn.com/tonyschr/archive/2004/04/28/121908.aspx
Can you post a screenshot for Suse Linux based on the HTML I provided? Feel free to change the fonts. - Anonymous
May 23, 2004
I had to jump up to 120 dpi b/c 96dpi was way to small with my sxga 14.1 screen (should have gone with xga). Anyways icons on my taskbar , quicklaunch and submenus where very pixelated, i reduced the caption buttons item and the icons became sharp by reducing in size. I still have the TURN OFF COMPUTER Red Square pixelated as well as the Log Off button pixelated...any solutions to this? - Anonymous
May 23, 2004
Antonio, nope - as far as I know there's no way to fix the pixelated "Log Off" and "Turn Off Computer" buttons. - Anonymous
May 30, 2004
Why do you need to adjust the default theme after switching to 120dpi fonts? Unfortunately it means only one thing: the default theme at 120dpi is ugly. You have to fix it. It should not require reducing the size of menu font, the scrollbar, the window title and so on. Everything should look OK by default as it is now with the default theme at 96dpi. Otherwise the majority of users will try it, find it unacceptable, and switch back. Or worse, users will resort to reducing resolution of LCD monitors and have everything blurry. That's exactly what you state at the beginning of this blog entry.
We should have better experience in Longhorn. - Anonymous
June 01, 2004
The comment has been removed - Anonymous
June 16, 2004
I've got an application written with VB6 and when i run it on Win2000 the GUI looks fine, but when it is ran under WinXP (and under the same display configuration) there are problems with some buttons (you can just see half of it) and other controls.
Has someone got a solution for this? - Anonymous
July 25, 2004
Graphics on my Dell is also distortet.
I have to sst the key
[HKEY_CURRENT_USERSoftwareMicrosoftInternet ExplorerMain]
"UseHR"=dword:00000001 <---0 GIFs no more distortet
to 0.
Thomas