What is the ideal line length for web pages?

What is the ideal line length for web pages? It’s a question that I’ve been pondering over on this blog design. Traditionally the ideal line length was around 66 characters. One of the main reasons for this line length (in print) was to help the human eye to easily find the next line and thus increase the speed and ease for the reader.

Does this ring true for web pages? Rather than taking this line length as gospel, I’ve taken my own straw poll of some of the world’s most popular sites, and here are the results;

The line length of some popular websites

  1. Fox news – Generally uses around 112 characters much longer line length than the suggested 66.
  2. BBC News – Seems to stick with the suggested line length of around 72 characters
  3. CNN news – Bang on 66 characters.
  4. Ny Times – Fixed width design of around 63 characters.
  5. wikipedia – has a flexible layout so line length can be anything.
  6. amazon – Also has a flexible layout so line length can by really long.
  7. imdb – 92 characters on the review section so much more than the 66.
  8. About.com – around 86 for the max character count.
  9. WordPress blog – They have a max character count of 115 so again more than 66.
  10. huffington post – 101
  11. techcrunch – 93
  12. mashable – 109
  13. The daily beast – 87
  14. engadget – 101

The ideal conclusion

Well from my initial findings of the sites above, it’s still unclear on what exactly the ideal line length is. Do you stick to optimal recommended lengths? Quite a few of those sites are using a much bigger character count that I thought they would. Even some of the news sites, who you would expect to stick to recommended guidelines are using much longer character counts. So that in itself is an interesting find.

If it’s good enough for WordPress then surely it’s good enough for us?

It seems to me that you don’t really need to be as conservative as 66 characters. If wordpress, mashable and Engadget are using more than 66 characters, then surely it’s good enough for us?

The perfect line length

There are lots of imperial studies about the cognitive theory of learning and reading – and in this post I’ve kind of run rough shot over all that (oops). My reason, well if you look on the web you can find information to back longer or shorter line lengths – so you’ve got to make up your own mind and what works best for you and your site. Find the blogs you like to read and figure out why you like them, look at their line lengths. Personally I’m going for around 90 – 100, it’s easy to read and it looks good.

I did find quite a few posts on the subject, so dig deeper;

  1. Ideal line length for content
  2. Web style guide
  3. The line length misconception
  4. An ideal page

Fluid layouts

Depending on your layout, the whole line length gets very messy, take fluid layouts – do line lengths still apply to them. Look at Wikipedia, it’s fluid, lines are long or short depending on your browser window size – on my screen I can still read the copy very easily.

Fixed layouts

Much easier to apply the line length that you want to. My advice for what its worth, stick to somewhere between 70 – 100 characters.

Adaptable and responsive layouts & line length

Well, if you cater for multiple device sizes (like I do) then you open up a whole can of worms. All I can say is work out the line length of your most popular size and make the text HTML {font-size:100%} then increase or decrease that for other sizes.

That is all.

No Comments

Sorry, the comment form is closed at this time.