Monday, July 16, 2007

Why don't we use italics online, anyway?

At the risk of publishing something that relates directly to my work, Sprint has recently changed their branding. The type standards, currently print-based, say everything is in italics (well, oblique, but that's another post entirely).

My kneejerk reaction (to no avail in the first iteration) is "no italics online!" But then I had to prove it. And this was way harder than I thought it would be. It was sort of interesting trying to investigate such a deep-seated heuristic.

As it turns out, I never found the text of any study that proves it. There's reference to one, and that's good enough for me. Instead, I am relying on the "everyone says it" method, as well as proving it thru demonstrations of the grid effect. Oh, and one disclaimer. I didn't find all these links myself. The whole list is a straight up ripoff of those emailed to me by Fred Pilgrim, off to the south about 3 yards.

Overall, its just about web-resolution. Type traditionally is smoothly drawn or pressed; pen strokes or lead type create lines going any direction. Any irregularity from beat-up type, or paper texture was inconsequential at normal sizes (usually) and regardless had no direction, so italics with their angles suffered no discernability issues. In reproducable print, from the dawn of photo-lithography to today, the screen (whether angled, straight or stochiastic, square, round or oval) is of such high resolution that all shapes appear essentially straight. Except for very straight lines very close to (but not quite /at/) the screen angle, everything looks smooth and sharp.

Digital displays are generally around 80 ppi. Some are higher, some even nudging over 100, but generally not. If resolutions exceeding 200 ppi become commonplace, this will begin to become moot, but this is possibly decades away due to low-cost and high-longevity of current display devices if nothing else. Anyway, unlike print, the low resolution of type on the digital display means that angled items, like the vertical in italic type are rendered as a series of steps. Cleartype, Smoothtype and other technologies try to mitigate this with anti-aliasing, but its imperfect; the sharpness cannot be preserved with such technologies. Its just a limit of physics.

There are additional issues with readability (comprehension, fatigue) of italics or oblique faces in print, but they are not quite as severe as the online component so I am ignoring it for now.


Anyway, here's what a bunch of others say about this. Interesting quotes about italics are here directly, but follow the link for context and more useful info. The IE box model bug is a great one I had forgotten about. Seen a similar one with Verdana (I think) having a space/letterform issue with their Ws.

http://www.grc.nasa.gov/WWW/usability/textfontcss.html
Research has shown that people can read faster if words are written using mixed case rather than all upper case. Blocks of bold and italics text are more difficult to read. Black is easier to read than colored fonts.
http://www.jimbyrne.co.uk/show.php?contentid=53 Jim Byrne is the founder of the Guild of Accessible Web Designers and has been a Web accessibility specialist since 1996.
Avoid using italics for small text sizes: the problems of screen display of outline fonts has not entirely disappeared. Italized fonts look particularly bad at small sizes - as italics do not easy to render using a square pixel grid. If you must use italics, avoid using them for large blocks of text.
http://www.bindu-design.co.nz/pcnz.html
Italics don't work on current low resolution screens: Staying with the same page we see that the chief executive's message, is written in italics. Research has established that reading from computer screens is about 25 percent slower than reading from paper. Even users who don't know about this human-factor research, usually say they do not enjoy reading from a computer screen. Text in italics should be avoided on web sites, as italics are even harder to read on current low resolution (below 80 dpi) screens. I predict that the screen readability problems of today will be solved by the year 2008. By that time we will see screens of 300 dpi in common use.
http://www.smartisans.com/articles/web_writing.aspx
While the Stanford-Poynter study focused on reading news on the Web, the results were similar to various studies conducted by Jakob Nielson, Jarod Spool, and others in the mid-1990's... ...But don't use italics for emphasis because italics are difficult to read on a computer monitor. There are just not enough pixels to render italics clearly.
http://www.456bereastreet.com/archive/200501/ie_and_italics/ Interesting info about Internet Explorer & Italics
Ever seen IE/Win ruin a layout just because a few words are in italics? I have. Just the other day I was pulling my hair out over this bug...