The ByteBaker

In my last post I talked about my dilemma regarding webapps: they’re wonderful and they’re letting us do amazing things, but in the effort to become a general-purpose app platform webapps seem to be struggling against the basic document-oriented nature of the web. However, there are some applications that I think are successfully embracing the idea that web is a sequence of connected documents. I mentioned Simplenotes and Dropbox in my last post and they’re both awesome apps that you should check out. However, the document nature of the web has given rise to some new uses that aren’t applications in the conventional sense of the term.

When we hear the term “document” we generally think of something along the lines of a traditional paper document. Perhaps we can blame “word processors” for that. But in this brave new age of Web 2.0 documents aren’t just flat sheets of text. The best demonstration that I’ve seen of this new potential is the HTML5 Slideshow. It’s an HTML web page, but thanks to the the tools of JavaScript and new semantic elements it’s a great presentation too. It probably took a good amount of time and effort to put together and I don’t think you want to put this much of effort into each document. Right now, it’s a great showcase but I’m hoping that eventually there will be tools that make it easier to generate these kind of HTML5 documents with minimal effort, the same way we have great CMSs for building web pages today. There are already HTML presentation tools out there, but right now I think too many of them are trying to hard to clone desktop apps.

Moving on from presentations, another really nice example of innovative documents is the the Google book/website entitled “20 things I learned about browsers and the web”. This is almost certainly not the type of thing you think about when you hear “document” or web-page. Personally I think the pageturn effects are overdoing it a bit, but it presents a large amount of information presented in a very attractive format. I also like that the format they used is quite innovative. It’s not like anything you’d expect to see on a desktop for the simple reason that it’s not a program, it’s a document. Well, that’s not technically true: there’s a significant amount of JavaScript code being executed while you’re viewing it. But would you download and install a program whose sole purpose was to tell you 20 things about browsers and the web? We expect documents to work differently than programs (irrespective of what’s going on in the background): we don’t want to run them or interact with them to perform complex tasks, we just want information. And this book makes access to that information quick, easy and obvious.

Presenting information effectively doesn’t need to have great design and cool animations. In fact, perhaps the easiest way to present information is to get the design elements out of the way and let the content speak for itself. This isn’t a call to ignore design or to consider it as unnecessary frills. Quite the opposite: creating design that doesn’t clutter up the data is a hard job that we’re only just starting to get right. Two services that are leading the pack in this regard are Instapaper and Readability.

Instapaper has the goal of letting you save long form text you find on the web for later reading. The website itself is really simple and behaves mostly as a lightweight bookmarking service; you just save links to things you want to read when you have the time. But it really shines when paired with the iPhone or iPad apps. Instapaper strips websites of all their clutter and presents just the text on a simple background in a good font. It’s goal is simple: putting the focus back on the content and letting you read without distractions. I’ve only used the iPhone app so far, but the iPad app looks really good too. If I had an iPad it would probably be my one of favorites. Instapaper lets you read web-based content without having to be in front of a computer (or even connected).

Next up is Readability. It’s a brand new service who’s mission is similar to Instapaper: make reading easier. But Readability is focused on the web. It’s a browser plugin that will take text-rich web pages and present them in a cleaner, simpler design. There are a number of themes to choose from (I like Inverse myself). There will be Instapaper-like iOS apps soon, but that’s not the real point of Readability. It’s for people who will spend time reading in front of their computers instead of on the move (such as me). I’ve only been using it for a few days, but I’m already hooked. Whenever I see a webpage with a lot of text I want to read, but the design isn’t to my liking I hit the Readability button (or just the backtick key). I get the whole article in a nice serif font on an easy-on-the-eyes dark background as well as a list of things I’ve read recently. You can see that list here. I have some more things to say about Instapaper and Readability, but that deserves to be in a post all by itself.

I think we’re only just seeing a resurgence of the web as a document platform. These are still early days no doubt: creating HTML5 slideshows or flip-page books is not something you can do at the push of a button, but I think we’ll get there. Tools like Instapaper and Readability are helping us take back the web, so to speak. There’s still a lot of to do and I’m pretty sure we haven’t even come close to how far we can push the document-based nature of the Web. I’m certainly looking forward to seeing the new formats and services that get built in the years to come (and maybe build a few myself). While webapps won’t go away, we’ll also gain a lot from the web staying true to its document-based roots.