One more thought regarding Jerrold’s approach of toggling between a “web page” experience and a “book onscreen” experience:
Your comment mentions –
“cases where a compromise must be reached between the needs of a rich-content experience and the needs of the reading experience.”
But this is ALWAYS the case, not a special one. Readability can only be achieved by drawing on what works best from the world of books and magazines (400 years of trial-and-error is not to be dismissed) and what’s best about the world of networked screens. (And the screens and user-agents are improving all the time.)
The right blend will be found, I’m sure. And it’s nice to see the topic of Readability getting some play at AlistApart.
Your comment mentions — “cases where a compromise must be reached between the needs of a rich-content experience and the needs of the reading experience.”? But this is ALWAYS the case, not a special one.
But why is it always the case? Because of some inherent nature of the medium which requires it? Or because we have become accustomed to an idea of the web that reflexively values quantity over quality? I suspect the conflict herein is a tautology of our own making. In which case, we’re free to tear it down.
Copy & paste the code below to embed this comment.
Richard Fink
Look, I’m just a small-town boy from Brooklyn, what do I know?
But here’s a few things:
Hyperlinks. Enormously useful but when styled so that they are easily identifiable as links, they distract from the flow of reading. There is no equivalent on paper.
How do we meld the two without a stylistic switch of some kind?
Also, there is the inherent difference between a backlit LCD screen and a piece of paper. Screens today can’t match the resolution – in text, anyway – of print. (But color is free!) Sub-pixel font rendering like Cleartype helps a lot, but it’s still not quite the same.
What techniques can we bring to bear to make that difference as slight as possible? (Of course with an E-Paper screen, there is hardly a difference at all. And one may be appearing on a laptop near you, very soon.)
Yesterday I got delivery of an out-of-print paperback with real tiny text. And my eyesight, for various reasons, just isn’t up to reading text that small for long periods without discomfort. And so, for the first time in my life, I got angry at a book.
If the text was in HTML, I thought to myself, I could style it, change the font size, paginate, do whatever I wanted to do – and, in this case, I would gladly put up with the deficiencies in resolution, whatever, to be able to read it onscreen.
We can no longer assume that books “will always be around”.
I, for one, don’t believe they will.
The web empowers each and every one of us to become writer, publisher, typesetter, and even illustrator, all rolled into one.
A real challenge, that.
I’ve just scanned (apologies for not reading) the comments to see if anyone has mentioned that the interesting and thoughtful points made were contradicted by the post’s layout.
I really enjoyed the article, but the massive paragraphs made the experience feel like the visual equivalent of wading through custard.
Yes, I often read long articles online, becoming immersed in them. But I still need lots of white space, short paragraphs and sub headings to keep track of where I am and to stop my eyes going funny…
Copy & paste the code below to embed this comment.
Richard Fink
@Jerrold:
Re: your font sample page. Missing are the Microsoft “Cleartype” or “C” fonts that ship with Vista or MS Office 2007 and are by far the most screen-readable available. (MS has made the investment, others haven’t. It’s that simple. Creating good font sets – especially for the screen – is both a time AND knowledge intensive thing.)
By now, the installed base of these fonts is pretty big and I’m seeing them used on more and more sites.
The quality of the serif fonts is especially apparent. Those are Cambria and Constantia (Constantia is very similar to Georgia but better in a lot of little ways).
For monospace, Consolas beats the heck out of Courier or Courier New.
The san-serifs are Calibri and Candara.
This is probably the first time I have seen someone talk about reading experience on the web so wonderfully. Reading is more associated with the printed media that people completely forget to acknowledge the presence of online readers!
Copy & paste the code below to embed this comment.
Jerrold Maddox
Certainly the “C” fonts could be added to the list – when I developed this site a year and half ago they weren’t widely available on the computers where I teach. (They aren’t, of course, Microsoft’s first effort to make screen readable fonts – Georgia, Verdana and Tahoma were developed by Matthew Carter in for MS the ‘90s for that purpose.)
But the specific font used is just half the story - what I am more interested in is how we can use CSS to control font size, line length, line height, word spacing and letter spacing to make whatever font we are using as easy to read as possible in extended text.
I never knew I am a good reader until I developed my interest in reading web design articles on internet. Now I just love reading about anything interesting.
As you said it’s limitless, I keep an eye regularly to follow some of the selected witters whom I love to read as they touch my heart – like you :-)
A brilliant article and something that we should think about more often. It raises some points that make perfect sense and are blatantly obvious to me as a reader and yet somehow hadn’t occurred to me as a designer. Thanks.
Refreshing and relevant article. As designer’s we tend to forget that there is a wovld of readers who rely ever more on the internet as a reading source. I am referring here to the disabled community in particularly for whom web accessibility is a big issue.
Every web designer should read this article! Sometimes I wonder if some web designers know anything at all about typography – line lengths are often far too long, type too small etc.
I rarely ‘skim’ even when reading online. If the copy is supposed to be read, then the designer has a duty to make sure that experience is as easy as possible, regardless of the medium the reader reads from.
Yeah, some of these things are obvious, but I know I personally need to spend more time allowing my users to read, rather than get them to the next thing. I’ve never enjoyed reading on screen. It is now my goal to make this a possible experience. thanks
I loved this article. As a web designer, I’m always working in Flash, thinking about eveything like the design, the layout, the content, graphics, everything but what could be done to make reading the content on my sites better. I’m definitely going to remember this one!
Thankyou for such a well-written and engaging article, its the best I’ve seen on ALA for months I think. Interesting ideas on how to design for readers as well, I’ll have to try them out.
Copy & paste the code below to embed this comment.
Dan Stramer
Hi,
I am designing a web-portal for the third age(65+) and am trying to make the article reading as easy as possible.
Once the user clicked on an link to the article the article is set on top with a dark background making the user concentrate solely on the article. if he wants of course he can close the page and continue to other areas of the site.
The web site is in hebrew, but here is a design sketch showing my point:
http://www.dmdesign.co.il/commino/html/Commino_article[v6].html
Would be happy to know what you think about this method.
Thanks,
Copy & paste the code below to embed this comment.
John Myrstad Myrstad
Thanks Mandy, its a great article and I hope it will initiate further articles at ALA on “reading on the web”.
Some of you may find some interest in a thread at Typophile forum, and might want to join in at the discussion there: http://www.typophile.com/node/54631
Copy & paste the code below to embed this comment.
Richard Fink
Re: Dan Stramer’s post-
Jakob Nielsen has reported on the popularity and effectiveness of this technique:
http://www.useit.com/alertbox/application-design.html
I think this page-on-top-of-a-page idea is worth a try.
(BTW – The font-size in your demo looks a little small for the 65+ age group you’re targeting.)
Re: John Myrstad at Typophile’s post –
Bill Hill of Microsoft is interested, as am I, in exploring techniques taken from the world of print, but used onscreen and within the browser.
His post about font-embedding on the IE blog, which included a link to his experimental site that uses columns with justifed text in a magazine-like layout, sparked an old media vs. new media kerfluffle for some reason. (And analyzed on the thread at Typophile.)
Hill’s original post is here:
http://blogs.msdn.com/ie/archive/2008/07/21/font-embedding-on-the-web.aspx
Worth checking out for anybody interested in readability on the web.
I think people miss the point of the text on a sight and also ignore the fact that people do read it. Of course first impressions of a site is taken in by the use of flash and images, but honestly people need to take care when writing content to really push their website. Text is just as important as the initial first impression.
I applaud your article and it raises issues that more people need to become aware of: that reading is a delicate activity that requires attention, and we as designers need to pay more attention to how we read on screens. Here’s my contribution to this effort, The Redub Reader, an app which is designed to make it easier to read long texts on screen.
Copy & paste the code below to embed this comment.
Richard Fink
@Irwin Chen
Really interesting approach. Bookmarked!
Too much to say here.
Don’t like the typography but the page-flip bars certainly are attractive and smooth.
What about copyright issues – how are you handling that?
In addition to the word count, I would give a page count up-front also.
Nice effort – I, for one, will be eagerly awaiting to see how it evolves.
Unfortunately, a vast majority of web users are simply used to scrolling down the web page, without paying much attention to the content. I agree that the focus should be put on the content of the web site, but the main question is as to how to capture the interest of the reader. The quality of the texts, when it comes to web pages, might not be enough.
Today, more than never, content has to be complete in the internet. Complete means entire. There are too many content in the world and more coming each second. We can’t waste the attention of our visitors. In advertisement, after gotten by a message, the person go after the other informations about the product. When this person access a website he wants to get the entire information. Even if many of our visitor wont read that text, that text has to be there for those who will. How the information is displayed, how easy to find, how easy to find later.
readers, like myself, are still adjusting to on-screen reading. I still feel more comfortable with a hardcopy in my hands instead of staring at a screen. However, recently I bought a new LCD 24” monitor, so staring at the screen is not as bad any more. It makes reading some of the websites more bearable.
This has given me some definite pause for thought about how I build web pages for clients, specifically the manner in which we determine the use for a particular page.
“An experienced reader can lose herself in a good text with anything short of a war going on (and, sometimes, even then)—the horticultural equivalent of growing orchids in a desert.”
My boyfriend can’t understand why he can’t talk to me while I’m engrossed in a book. He gets a weird look on his face if I make the impatient noise and look pointedly at him if he’s rambling on about something that requires my attention if I have a book in my hand. This one sentence sums us readers up perfectly!
I am an avid reader, so I can say that reading is not just an activity or a hobby. It is a “˜passion’ that engrosses you so well that you even forget that whether you are reading in your room or at a noisy bar or street. Keeping reading, it not only entertains you but makes you intelligent too!
67 Reader Comments
Back to the ArticleRichard Fink
One more thought regarding Jerrold’s approach of toggling between a “web page” experience and a “book onscreen” experience:
Your comment mentions –
“cases where a compromise must be reached between the needs of a rich-content experience and the needs of the reading experience.”
But this is ALWAYS the case, not a special one. Readability can only be achieved by drawing on what works best from the world of books and magazines (400 years of trial-and-error is not to be dismissed) and what’s best about the world of networked screens. (And the screens and user-agents are improving all the time.)
The right blend will be found, I’m sure. And it’s nice to see the topic of Readability getting some play at AlistApart.
Mandy Brown
@ “Richard”:http://alistapart.com/comments/indefenseofreaders?page=4#31 said—
But why is it always the case? Because of some inherent nature of the medium which requires it? Or because we have become accustomed to an idea of the web that reflexively values quantity over quality? I suspect the conflict herein is a tautology of our own making. In which case, we’re free to tear it down.
Richard Fink
Look, I’m just a small-town boy from Brooklyn, what do I know?
But here’s a few things:
Hyperlinks. Enormously useful but when styled so that they are easily identifiable as links, they distract from the flow of reading. There is no equivalent on paper.
How do we meld the two without a stylistic switch of some kind?
Also, there is the inherent difference between a backlit LCD screen and a piece of paper. Screens today can’t match the resolution – in text, anyway – of print. (But color is free!) Sub-pixel font rendering like Cleartype helps a lot, but it’s still not quite the same.
What techniques can we bring to bear to make that difference as slight as possible? (Of course with an E-Paper screen, there is hardly a difference at all. And one may be appearing on a laptop near you, very soon.)
Yesterday I got delivery of an out-of-print paperback with real tiny text. And my eyesight, for various reasons, just isn’t up to reading text that small for long periods without discomfort. And so, for the first time in my life, I got angry at a book.
If the text was in HTML, I thought to myself, I could style it, change the font size, paginate, do whatever I wanted to do – and, in this case, I would gladly put up with the deficiencies in resolution, whatever, to be able to read it onscreen.
We can no longer assume that books “will always be around”.
I, for one, don’t believe they will.
The web empowers each and every one of us to become writer, publisher, typesetter, and even illustrator, all rolled into one.
A real challenge, that.
Helen Baker
I’ve just scanned (apologies for not reading) the comments to see if anyone has mentioned that the interesting and thoughtful points made were contradicted by the post’s layout.
I really enjoyed the article, but the massive paragraphs made the experience feel like the visual equivalent of wading through custard.
Yes, I often read long articles online, becoming immersed in them. But I still need lots of white space, short paragraphs and sub headings to keep track of where I am and to stop my eyes going funny…
Jerrold Maddox
Here is another site I use for a class that suggests what appears to me the best way to style some of the widely available fonts on the web.
https://www.courses.psu.edu/art/art101_jxm22/typefaces.html
I would be delight to know what others think.
Jeffrey Zeldman
So ironic!
Richard Fink
@Jerrold:
Re: your font sample page. Missing are the Microsoft “Cleartype” or “C” fonts that ship with Vista or MS Office 2007 and are by far the most screen-readable available. (MS has made the investment, others haven’t. It’s that simple. Creating good font sets – especially for the screen – is both a time AND knowledge intensive thing.)
By now, the installed base of these fonts is pretty big and I’m seeing them used on more and more sites.
The quality of the serif fonts is especially apparent. Those are Cambria and Constantia (Constantia is very similar to Georgia but better in a lot of little ways).
For monospace, Consolas beats the heck out of Courier or Courier New.
The san-serifs are Calibri and Candara.
Maneet Puri
Hi,
This is probably the first time I have seen someone talk about reading experience on the web so wonderfully. Reading is more associated with the printed media that people completely forget to acknowledge the presence of online readers!
Jerrold Maddox
Certainly the “C” fonts could be added to the list – when I developed this site a year and half ago they weren’t widely available on the computers where I teach. (They aren’t, of course, Microsoft’s first effort to make screen readable fonts – Georgia, Verdana and Tahoma were developed by Matthew Carter in for MS the ‘90s for that purpose.)
But the specific font used is just half the story - what I am more interested in is how we can use CSS to control font size, line length, line height, word spacing and letter spacing to make whatever font we are using as easy to read as possible in extended text.
Web Design Creatives
I never knew I am a good reader until I developed my interest in reading web design articles on internet. Now I just love reading about anything interesting.
As you said it’s limitless, I keep an eye regularly to follow some of the selected witters whom I love to read as they touch my heart – like you :-)
Matt Obee
A brilliant article and something that we should think about more often. It raises some points that make perfect sense and are blatantly obvious to me as a reader and yet somehow hadn’t occurred to me as a designer. Thanks.
Anne C.
Refreshing and relevant article. As designer’s we tend to forget that there is a wovld of readers who rely ever more on the internet as a reading source. I am referring here to the disabled community in particularly for whom web accessibility is a big issue.
Amelia Vargo
Every web designer should read this article! Sometimes I wonder if some web designers know anything at all about typography – line lengths are often far too long, type too small etc.
I rarely ‘skim’ even when reading online. If the copy is supposed to be read, then the designer has a duty to make sure that experience is as easy as possible, regardless of the medium the reader reads from.
Joshua taylor
Yeah, some of these things are obvious, but I know I personally need to spend more time allowing my users to read, rather than get them to the next thing. I’ve never enjoyed reading on screen. It is now my goal to make this a possible experience. thanks
hubert guillaud
I’ve made a french translation of this very good article. Thanks Mandy !
http://lafeuille.homo-numericus.net/2009/02/la-defense-des-lecteurs.html
Jarryd Crawford
A good read, and very valid points about font-size, spacing and whitespace.
Distractions around a body of text that you wish a user to read would not assist at them in continuing to read.
A small note: I noticed that your writing scope is aimed at a woman? :) (her, she).
No problem with it, haha.
James Mason
I loved this article. As a web designer, I’m always working in Flash, thinking about eveything like the design, the layout, the content, graphics, everything but what could be done to make reading the content on my sites better. I’m definitely going to remember this one!
Jylan Wynne
Thankyou for such a well-written and engaging article, its the best I’ve seen on ALA for months I think. Interesting ideas on how to design for readers as well, I’ll have to try them out.
Damian Sefton
Excellent article, will certainly be using your suggestions. Thanks.
Peter McLachlan
Nothing fuels the imagination in my experience like the printed word.
Dan Stramer
Hi,
I am designing a web-portal for the third age(65+) and am trying to make the article reading as easy as possible.
Once the user clicked on an link to the article the article is set on top with a dark background making the user concentrate solely on the article. if he wants of course he can close the page and continue to other areas of the site.
The web site is in hebrew, but here is a design sketch showing my point:
http://www.dmdesign.co.il/commino/html/Commino_article[v6].html
Would be happy to know what you think about this method.
Thanks,
Dan
John Myrstad Myrstad
Thanks Mandy, its a great article and I hope it will initiate further articles at ALA on “reading on the web”.
Some of you may find some interest in a thread at Typophile forum, and might want to join in at the discussion there: http://www.typophile.com/node/54631
John Myrstad
Richard Fink
Re: Dan Stramer’s post-
Jakob Nielsen has reported on the popularity and effectiveness of this technique:
http://www.useit.com/alertbox/application-design.html
I think this page-on-top-of-a-page idea is worth a try.
(BTW – The font-size in your demo looks a little small for the 65+ age group you’re targeting.)
Re: John Myrstad at Typophile’s post –
Bill Hill of Microsoft is interested, as am I, in exploring techniques taken from the world of print, but used onscreen and within the browser.
His post about font-embedding on the IE blog, which included a link to his experimental site that uses columns with justifed text in a magazine-like layout, sparked an old media vs. new media kerfluffle for some reason. (And analyzed on the thread at Typophile.)
Hill’s original post is here:
http://blogs.msdn.com/ie/archive/2008/07/21/font-embedding-on-the-web.aspx
Worth checking out for anybody interested in readability on the web.
Jenny Pilley
I think people miss the point of the text on a sight and also ignore the fact that people do read it. Of course first impressions of a site is taken in by the use of flash and images, but honestly people need to take care when writing content to really push their website. Text is just as important as the initial first impression.
Irwin Chen
I applaud your article and it raises issues that more people need to become aware of: that reading is a delicate activity that requires attention, and we as designers need to pay more attention to how we read on screens. Here’s my contribution to this effort, The Redub Reader, an app which is designed to make it easier to read long texts on screen.
http://reader.redub.org/dev
I’d love to hear your thoughts. Thanks!
Richard Fink
@Irwin Chen
Really interesting approach. Bookmarked!
Too much to say here.
Don’t like the typography but the page-flip bars certainly are attractive and smooth.
What about copyright issues – how are you handling that?
In addition to the word count, I would give a page count up-front also.
Nice effort – I, for one, will be eagerly awaiting to see how it evolves.
Anne Wayman
love that last nugget… you’ve got to read it yourself. How true and how necessary. Thanks.
Mark Shui
Unfortunately, a vast majority of web users are simply used to scrolling down the web page, without paying much attention to the content. I agree that the focus should be put on the content of the web site, but the main question is as to how to capture the interest of the reader. The quality of the texts, when it comes to web pages, might not be enough.
Harry Lund
This was an absolutely fantastic article. Thnak you for caring about the reading experience on the Web.
F Ahmad
This is very informative and useful post. But I would like to say that the web has made reading flexible.
seo blog
books will become obselete
this is why even the newspapers are sending digital copies of their articles…instead of delivering to a home
luiswouters
Today, more than never, content has to be complete in the internet. Complete means entire. There are too many content in the world and more coming each second. We can’t waste the attention of our visitors. In advertisement, after gotten by a message, the person go after the other informations about the product. When this person access a website he wants to get the entire information. Even if many of our visitor wont read that text, that text has to be there for those who will. How the information is displayed, how easy to find, how easy to find later.
joecallahan
readers, like myself, are still adjusting to on-screen reading. I still feel more comfortable with a hardcopy in my hands instead of staring at a screen. However, recently I bought a new LCD 24” monitor, so staring at the screen is not as bad any more. It makes reading some of the websites more bearable.
vancouver web design
What a fantastic article!
This has given me some definite pause for thought about how I build web pages for clients, specifically the manner in which we determine the use for a particular page.
Thanks for the great insight!
smallflower
“An experienced reader can lose herself in a good text with anything short of a war going on (and, sometimes, even then)—the horticultural equivalent of growing orchids in a desert.”
My boyfriend can’t understand why he can’t talk to me while I’m engrossed in a book. He gets a weird look on his face if I make the impatient noise and look pointedly at him if he’s rambling on about something that requires my attention if I have a book in my hand. This one sentence sums us readers up perfectly!
solef80treadmill
I am an avid reader, so I can say that reading is not just an activity or a hobby. It is a “˜passion’ that engrosses you so well that you even forget that whether you are reading in your room or at a noisy bar or street. Keeping reading, it not only entertains you but makes you intelligent too!
johnl123d
Thank you for caring about the reader’s experience, though typography is not my thing.