How To Design For Readers

Light_5Mandy Brown (she of A Working Library) has written this fantastic piece in A List Apart Issue 278 that explains how people read on the Internet, and how designers should cater for these reading patterns. In it, she makes a very interesting distinction between browsing and reading, one that I think explains many of the design decisions I’d observed or made in the past. Some of these design decisions can be seen here on Novelr, but I’ll come back to that in a bit.

The underlying shtick in Mandy’s article is how readers evaluate before reading. She calls the first stage the browsing stage, where a reader looks for context-sensitive clues about the book/article/post at hand, to determine if it’s worth committing time and energy to. If it is, and the clues are favourable ones, then the reader moves on to the second stage – reading. The designer’s job is then to ensure the reader has enough contextual clues at the top of the page; remove all distractions at the middle, and provide further links at the end when the reader has come out of the (ooh I like this word!) reading trance and is looking for further content to consume.

Mandy also provides some suggestions on how to ‘lure’ the reader in – some of them things that I hadn’t considered within a browsing/reading dichotomy. She suggests pictures to establish context, pullquotes, or typographic tricks: the whole paragraph set to a larger font, for instance. I personally lean towards visual lures – many of my posts in Novelr used to have picture leaders, although the new redesign (the current one) has now enough visual power to draw a reader into the text, and I’ve largely dispensed with that.

There are also lures that she haven’t discussed; ones that I’d like to point out here: site identity, for instance, and strong writing. Site identity (and how to create it; a.k.a the Picture Book Effect) I’ve talked about before, and I think remains the major subconscious element in the browsing stage. People who visit well-designed websites know that the owner has taken care to present his or her work, and with such care comes the assumption that the content on such a site must be good, so buckle up and prime eyeballs for reading quick! As for the second lure: the benefit of a strong first line/paragraph should be familiar to all writers who’re reading this, so I guess I’ll spare you the monotony of listening to me drone on about something you already know well.

As an aside: I found myself identifying with these design decisions mainly because I’d included almost all of them in Novelr’s redesign – without consciously thinking about them (imagine my surprise!). Novelr’s sidebar is purposely set to grey, with text smaller than the site norm (and in sans-serif, for legibility), to ensure that reader attention remains on post content. The post content is itself presented in large Georgia. And the sidebar is purposely kept short, so that for a majority of the article length the reader is left alone with just prose. There are problems with this design, I’ll admit, and I now wonder how much more to tweak … first paragraph in caps, anyone?

Possibly Related Posts:

Category: Design · Writing Web Fiction
  • http://inmydaydreams.com JZ

    Hey Eli… This appears to be one of your less commented on posts, but it’s probably because it’s a big issue and one that most writers don’t really have opinions on.

    I read “A List Apart” regularly. It’s a great website to read when thinking about this sort of thing.

    My current website violates a few of these ideas (though I don’t think it’s horrible). That being said, getting a website right is a long term process and includes a bunch of tweaks even after you think you’re finished (people involved in software engineering think that 50% of an application’s cost comes in later maintenance. Websites likely aren’t much different).

    Personally, I’m still in the process of figuring out what the key points of my next redesign are.

    I’m thinking that they have to include:
    1. Readability
    2. Ease of starting the story and finding where you were if you stopped partway through.
    3. Room for advertising should I someday want to accept it.
    4. Avoiding having a million little blinky spots (that make it harder to find the story). I’ve noticed a lot of sites that do take advertising/have online stores have this problem.
    5. Creating community through making comments prominent.

    How this will translate into font/layout decisions remains to be seen.

  • http://www.ashleyladd.blogspot.com Ashley Ladd

    For a long time I tried to make my own website. Finally, I gave up and hired a designer. I do the maintenance but she got me started. I love the look and think it meets most (hopefully all) of the criteria you’ve mentioned.

    I’ll have to try some of the other tricks you mention above.

  • http://poorbob.blogspot.com Bob Collins

    I just started putting up some chapters of a portion of my auto-biography and haven’t even given a thought to design. Maybe I should start. I think Ashley’s money was well spent.

  • Pingback: Omneckron Genesis: Online Fiction » Changes afoot

  • http://gavinwilliams.digitalnovelists.com Gavin

    has anyone heard from Eli in a while?

  • http://www.novelr.com Eli James

    Sorry for the late replies, guys, I was caught offline for way too long.

    @Jim, that sounds like a wonderful idea. Though to tell you the truth, at my current level of emotional involvement with Legion, I probably won’t care how you present your site … I’ll still read it anyway. It’s the new readers you’ve got to worry about …

    @Ashley: glad to help, then. =)

    @Bob: Oh yes indeed, you should. Your blog’s quite readable, actually, though you may want to give thought to the new reader, the ones who don’t have the patience or the inclination to trawl your archives.

    @Gavin: I’m back now. Sorry about that. =S