homepage Welcome to WebmasterWorld Guest from 54.198.148.191
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Accredited PayPal World Seller

Visit PubCon.com
Home / Forums Index / WebmasterWorld / Accessibility and Usability
Forum Library, Charter, Moderators: ergophobe

Accessibility and Usability Forum

    
What is the ideal line height
for readability
annej




msg:3537453
 5:17 pm on Dec 30, 2007 (gmt 0)

I've been reading about the importance of adding line height to improve the readability of my site.

Are there any studies about what the best height would be?

 

pageoneresults




msg:3537457
 5:24 pm on Dec 30, 2007 (gmt 0)

Reading Online Text: A Comparison of Four White Space Layouts
[psychology.wichita.edu...]

It's from 2004 but I believe it still applies today and beyond.

Here is the previous WebmasterWorld topic posted by tedster...

Usability: line height means even more than I thought
[webmasterworld.com...]

annej




msg:3537734
 4:45 am on Dec 31, 2007 (gmt 0)

Interesting though it doesn't give specific information on just how high a line height is ideal. Any thoughts?

For now I've made it 135% and it does seem easier on the eyes. But I want to be sure I make it enough for optimum viewing but not so much is seems odd or awkward.

pageoneresults




msg:3538226
 12:40 am on Jan 1, 2008 (gmt 0)

Interesting though it doesn't give specific information on just how high a line height is ideal. Any thoughts?

Sure! I like white space. I'm going to tend to lean towards more line-height than the norm. Not so much so that it breaks readability but just enough to where it provides what I feel is a pleasant reading experience for the eyes.

Personally, I don't think line height should be to a point where things look double spaced or even 1.5 spaced.

I've seen many designs that fail miserably in this area. It's rampant out there and it all comes down to how much information one can stuff on a page before it becomes a readability nightmare.

Line height should also vary based on font size. It should not be fixed across the board. It needs to be fluid. I've seen fixed line height on relative font sizing and it wasn't a pretty site (pun intended). :)

sonjay




msg:3538308
 12:36 pm on Jan 1, 2008 (gmt 0)

I always use extra line-height in every site -- usually around 140%, but sometimes as much as 150 or 160%. I've actually had compliments from people on how nice the text looks! They're so used to all the sites that use the default line-height, which is insufficient (IMO), they think I'm doing something really special to the text to make it so readable.

Clark




msg:3560584
 9:08 am on Jan 29, 2008 (gmt 0)

Don't use percentages. Use unitless line-heights [meyerweb.com].

sonjay




msg:3560743
 12:21 pm on Jan 29, 2008 (gmt 0)

Clark, that article does a good job of explaining the difference between using, say, line-height:1em vs line-height 1.

But is there any real difference between line-height:1 and line-height:100%? Seems to me it would work out pretty much the same way.

Clark




msg:3561120
 5:43 pm on Jan 29, 2008 (gmt 0)

Read the comments [meyerweb.com] too.
Percentages share the same problem as ems do.
1.5em and 150% have the same effect [meyerweb.com]...they pass on the computed value of line-height to any descendant element.

sonjay




msg:3561389
 9:54 pm on Jan 29, 2008 (gmt 0)

Oh, I hadn't looked at the comments previously (obviously). That sure is news to me. I'm glad you pointed that out.

And now that I think about it, I've sometimes had to declare line-height for elements that I didn't think should need it -- they were probably inheriting the "computed" line-height from a parent element.

I love learning new things. I hate learning that I've been doing something the wrong way for all these years! ;)

Clark




msg:3561653
 3:26 am on Jan 30, 2008 (gmt 0)

That meyer really knows his stuff. I guess you look at the whole thing differently when you've had to code a browser to standards :)

camp185




msg:3568101
 12:01 am on Feb 7, 2008 (gmt 0)

Mine is set to 1.5em. You might want to consider the amount of reading on your site. Slightly smaller height might make for less scrolling which is a good thing.

DrDoc




msg:3601281
 5:36 am on Mar 15, 2008 (gmt 0)

I, too, set the line-height to 1.5 and have had great success with it. It generally works best if the text is a tad larger to begin with. Too small and the thin lines turn to an illegible mess where paragraphs don't stand out as separated.

D_Blackwell




msg:3625368
 3:53 pm on Apr 12, 2008 (gmt 0)

Sure! I like white space. I'm going to tend to lean towards more line-height than the norm. Not so much so that it breaks readability but just enough to where it provides what I feel is a pleasant reading experience for the eyes.

Personally, I don't think line height should be to a point where things look double spaced or even 1.5 spaced.

I want enough line-height to give optimum readability; agree that anything over 1 1/2 leading probably has negative effect.

I vary it according to font-size being used, which is even more important to me because people hate text that they can't read. I'll design at 1.2em to 1.3em. Sure, users can increase the size of the font display (if they know how), but even a +1 bump will blow up the design of many sites. Even with a larger than typical font-size, I like for the design to stand up to at least one zoom bump before breaking layout. 'Standard' font-size, which is too small IMO on most sites, needs to be able to withstand several bumps or I'm probably gone. Screen resolutions are getting higher and higher, so the problem is getting worse for a lot of sites that nobody can read anymore:))

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / WebmasterWorld / Accessibility and Usability
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved