Multicolumn Readability Preview

Here’s an article from the New York Times as it appears on my 1920 Ă— 1080 display. There are lots of distractions, but only about one and a half paragraphs of article text are visible.


Here’s how it looks with Readability, a great bookmarklet that filters out the crap and presents the content in a simple, elegant, format:


I created an alternate stylesheet for Readability that formats the text in multiple columns, newspaper-style. (NEW! Compare to Safari Reader.) You scroll sideways; in this format, it’s easier to consult more of the article without scrolling.


This modification was inspired by a desktop app called Tofu.


All Readability configuration options are supported, including footnote links. Margin width is interpreted as the inverse of column width (wide margins yield narrow columns). Some column width tweaking and cross browser debugging remains to be done. I know it works in Webkit and Mozilla (Safari and Firefox); implemented with CSS3 Columns.

That’s hot, Jim. I want it.

First I want to check if it’s feasible or worthwhile to submit it as a patch to the original bookmarklet, although there are valid concerns that the column format isn’t appropriate for all types of content that may be viewed with Readability.

Otherwise, I’ll definitely make it available here – although I’ll have to investigate what’s permissible. (I have difficulty understanding the terms of many open source software licenses.) Fortunately, since all my changes are confined to the stylesheet, a normal Readability bookmarklet can be edited to point to a copy of the multi column stylesheet.

Update: Now available.

Posted on Monday, June 7th, 2010. Tags: , , , , , .

3 Responses to “Multicolumn Readability Preview”

Posted by DDD on Monday, June 7th, 2010 at 8:47 PM.

Sign me up! I think you’ve made a really strong option. The link-as-footnote function at Readability was news to me also: I upgraded my configuration to it. I’ll also be sharing that Nicolas Carr article (probably on my blog) with a bunch of folks; makes a whole lotta sense.

Posted by Nik on Saturday, June 26th, 2010 at 8:50 AM.

“Limitations and Acknowledgements
The McReadability stylesheet…”

In America, “acknowledgment” is spelled “acknowledgment.”

Posted by Jim on Sunday, June 27th, 2010 at 5:07 PM.

Thanks for the tip. In English, and on my website, it is spelled either way.