Type Readability on the Web

[ggreig]

There are a couple of interesting videos on Channel 9. They're the latest interview with Bill Hill, one of the most interesting guys to listen to at Microsoft.

Hill's originally from a publishing and typography background rather than software development, so for a start it's a nice change of perspective. He's a very enthusiastic speaker, and as it happens he's also Scottish - he worked on The Scotsman in the days when it was still a credible newspaper.

What he's talking about is trying to improve typography and page layout on the web in order to improve online readability.

He's not a web expert per se - he's picking up standards-compliant HTML and CSS as he goes along - and if you're a web developer, you may have qualms about some aspects of what he's trying to do. For example, his preference for full-screen viewing goes counter to received wisdom about how web content should be designed, and it's fairly easy to find situations in which his sample pages don't work.

However, you should bear in mind that this is work in progress, and that while he's challenging some web assumptions, he really does know his stuff on readability, so it's worth hearing what he has to say. Look past the bits that immediately give you the grue!

The real substance is that Microsoft are opening up their previously proprietary font-embedding technology for the web, and making it clear they won't support the alternative font-linking solution - for reasons that are perfectly good if you believe that type designers deserve to earn a living. Ascender Corporation are explicitly throwing their weight behind this, and it's likely to be supported by others. Hopefully it will also be possible for the other browsers to implement support for font-embedding now that it's no longer proprietary.

tobyaw will be glad to know he may have been ahead of the curve with the embedded-font typography on the Brighthelm web site.

Comments

[tobyaw]

His website looks a little unhappy in Safari.

I can think of a lot of problems with multi-column designs for online viewing, especially if one bumps up the text size. Too few words per line; too much scrolling up and down.

[ggreig]

I think his argument would be that there's not going to be much demand for bumping up the text size by much; 12 point is a comfortable size because of the dimensions of the human eye. However, you're right about multi-column layouts having potential problems if there is mch resizing.

One of the stated goals they're working on - and clearly aren't there yet - is greater responsiveness to rescaling, to the extent that layouts will work on a big-screen multi-column but still be OK on a hand-held device. Be interesting to see what they do.

[qidane.livejournal.com]

Yesterday I set the minimum font size in by browse to 16 pt as I am finding it increasingly hard to read some sites. My main text editor is now at 22pt by comparison. The layout of most sites almost works. But I have noticed some menus having problems.

[ggreig]

Well, that would almost certainly bust his current sample pages. It is clearly something he needs to work on; still, that does seem to be something that's intended.

Is that "true" 16pt (as in resolution independent, would be the same size if you held a print-out up alongside it), or is it dependent on your display?

[tobyaw]

The interesting developments in web browsers to allow full page scaling, rather than just scaling the text within a fixed layout, will really help. Increasing use of vector-based content will be a benefit; its good to see that most browsers now include decent SVG support.

I’m still not convinced that multi-column layouts are appropriate for text-based content on the web. For advertising and information, sure. But for reading a body of text, I want to scroll in one dimension, not two. And for reading on small screen sizes - the iPhone or the Wii for example - a single column that can be zoomed to the page width is the only sane way to present text. Thankfully most web sites work like that.

I can see good functional design arguments for using multi-column text in many forms of traditional publication, but can see very little reason (than an aesthetic desire to ape the printed page) to use multiple columns for on-screen reading. And there are plenty of reasons to use a single-column layout.

[ggreig]

Yes, if you have to do horizontal scrolling then it's a failure. But the goal is to get to the point where there's adaptive layout, where you can have single column in a small window, and multi-column when there's the space to accommodate/require it.

I'm not sure whether that necessarily clashes with full-page scaling; both are ways of trying to make the best use of the available space in the browser. Full-page scaling is probably, in idealistic terms, the less-good solution, but it's likely be more successful, at least in the short term, because it requires less of the page author. Long term - ten to twenty years - adaptive layout could, possibly, become the norm.

Microsoft's failure to support SVG is very annoying; it will be interesting (and possibly frustrating) to see whether SVG continues to suffocate in the meantime or drives adoption of other browsers. I'm inclined to think the former, because most end-users dont know about it and don't care. I'd rather it were otherwise.

[tobyaw]

I’m not sure that SVG is going to be a significant issue in desktop web-browsing in the near future, but I don’t see it suffocating. Particularly with its widespread support on mobile devices, and recent improvements in support across different browser engines, there is a lot of work going on with SVG. Which I approve of, as I find it a very likeable technology.

Interesting table of feature support at http://www.codedread.com/svg-support.php

[ggreig]

Maybe stifle would have been a better choice than suffocate! :-)

[ggreig]

Forgot to mention the poster-child of adaptive multi-colum layout: the New York Times Reader.