Readability: The Optimal Line Length (2024)

Readability: The Optimal Line Length (1)

Key Takeaways

  • The optimal line length for body text is 50–75 characters
  • Shorter or longer line lengths can hurt readability
  • Our large-scale testing reveals that text line length often makes product or service descriptions unnecessarily difficult for users to read

Having the right amount of characters on each line is key to the readability of your text.

Indeed, our Premium UX research and large-scale e-commerce UX testing reveals that long lines of text are typically perceived by users as intimidating and overwhelming.

As result, users faced with overly long lines of text are more likely to avoid reading the text.

Consequently, as readability drops more users will fail to fully understand a product’s or service’s benefits, and thus decide that a particular product or service won’t meet their needs.

In this article we’ll discuss the following:

  1. General principles regarding text line lengths and readability
  2. How overly long lines of text negatively impact e-commerce users
  3. The optimal text line length for e-commerce sites & accessibility concerns

1) General Principles Regarding Text Line Lengths and Readability

Readability: The Optimal Line Length (2)

Varying line lengths ultimately end up impacting the overall readability of a site’s text.

Having the right amount of characters on each line is key to the readability of your text.

Indeed, it shouldn’t merely be your design that dictates the width of your text — the ability of users to easily read through the text should also be a critical factor.

Some fundamental exploration of line length and readability was conducted by Emil Ruder, a mid-twentieth century Swiss graphic designer.

Ruder concluded that the optimal line length for body text is 50–60 characters per line, including spaces (“Typographie”, E. Ruder).

Other sources suggest that up to 75 characters is acceptable.

Setting aside the specific number for the moment, what are the downsides of violating this range?

  • Too wide: if a line of text is too long the reader’s eyes will have a hard time focusing on the text. This is because the line length makes it difficult to gauge where the line starts and ends. Furthermore it can be difficult to continue onto the correct line in large blocks of text.
  • Too narrow: if a line is too short the eye will have to travel back too often, breaking the reader’s rhythm. Too-short lines also tend to stress readers, making them begin on the next line before finishing the current one (hence skipping potentially important words).

It turns out that the subconscious mind is energized when jumping to the next line (as long as it doesn’t happen too frequently; see above bullet point). At the beginning of every new line the reader is focused, but this focus gradually wears off over the duration of the line (“Typographie”, E. Ruder).

During our e-commerce testing, we’ve verified these basic readability precepts for users who are navigating e-commerce sites.

2) How Overly Long Lines of Text Negatively Impact E-Commerce Users

While images, videos, gifs, and other content play an important role in e-commerce users’ ability to evaluate products and services, for many users text is the critical factor in their decision-making process.

Of course, the importance of a site’s text depends greatly on the product or service being considered: users considering dresses in apparel e-commerce are much more likely to be swayed by the visual representation of the product compared to users considering a new grill or digital subscription service, where the product and service features and benefits are typically communicated largely through text.

However, even if text isn’t as important for certain products, for the site as a whole text will always play a critical role — for example, in the FAQ UX or for reviews or when users are attempting to navigate the checkout UX.

Yet when text is difficult to read due to the length of the lines, users are much less willing to engage with the text, or struggle to read efficiently.

Readability: The Optimal Line Length (3)

“There’s way too much here, I can’t even suss out what would be helpful.” This user on Mahalo found the lengthy description paragraphs hard to digest.

Readability: The Optimal Line Length (4)

“It’s a little more difficult, I would say, to just kind of read through this…I’m never a fan of having to read through all this material.” This user shopping for rental properties at Vrbo complained about the lengthy “About Us” section for a property he was considering. Lengthy lines of text are intimidating and discourage users from reading.

Indeed, during testing we’ve observed users immediately go back to a previous page when arriving at a page that includes long lines of text, as they simply didn’t want to bother trying to “get through” the information.

Other users we’ve observed will reluctantly decide to read the text, but they often fail to read through the entire text and instead leave the page without a full understanding of the product or service.

Either way, long lines of text will be an impediment to users’ ability to gather more information about a product or service.

3) The Optimal Text Line Length for E-Commerce Sites & Accessibility Concerns

Given the issues caused by overly lengthy lines of text, what’s the ideal line length to support readability?

The Web Accessibility Initiative (WCAG) guideline 1.4.8 states that, in order to be accessible to all users, lines of text should be 80 or fewer characters (or 40 or fewer characters if the text is Chinese, Japanese, or Korean).

Our accessibility research, as well as our other general e-commerce Premium research, supports this guideline, as users have been observed to get fatigued when trying to navigate extremely long lines of text (e.g., 100+ characters).

Thus, this is another case where adhering to guidelines written based on accessibility principles will, at the same time, improve the experience for all users, including those without accessibility needs.

To ensure line lengths don’t exceed 80 characters, the CSS max-width property can be set using font-relative lengths of around 70ch or 34em (note that this value will need to be adjusted slightly up or down depending on the font used).

Readability: The Optimal Line Length (5)

“They’re making a different point with the ‘Plays where you play’…‘Bluetooth connectivity’…it’s a lot easier for me to understand. You can tell that…these are the selling features that make our speaker different from others, and this is what makes it special.” A user at Bose found it easy to navigate the product description for Bluetooth speakers, which was structured by “feature highlights” and had line lengths that supported readability.

Readability: The Optimal Line Length (6)

“I wanted to see if it was waterproof…and it said ‘Don’t submerge it’. Which I thought was helpful to know.” The product description for the speaker at explained the speaker’s features in an easy-to-read format featuring blocks of text and bullet lists. When it comes to the mobile UX, line length is less likely to be an issue due to the narrow viewport in portrait mode, but line length can become an issue in landscape mode if the design doesn’t support keeping lines of text at 80 characters or fewer.

Additionally, using blocks of text together with bullet lists can help break up lines of text, as can structuring product pages by feature highlights.

Support Users Attempting to Learn More about a Product or Service

Readability: The Optimal Line Length (7)

“I can’t immediately tell from this picture but the fact that it says it fits ‘in the palm of your hand’ means it is quite small.” A user at Bose relied on product description text to get a sense of a speaker’s size. Images are critical for users considering products online, yet they often fall short. In these cases it’s critical that the text supports readability so that it can serve as an effective fallback.

Providing users with text line lengths of 80 characters or fewer is one step toward more readable text on a site.

However, it’s important to keep in mind that line length is only one component of text readability.

Additionally, in order to be in compliance with accessibility standards, text styling must be able to be set as follows:

  • Line height (i.e., the spacing between lines of text): 1.5em (i.e., 1.5 times the font size)
  • Paragraph spacing: 2em
  • Word spacing: 0.16em
  • Letter spacing (i.e., tracking): 0.12em

(Premium subscribers can view our guideline for more on general page design requirements for accessibility.)

By setting line lengths to support readability, sites will encourage users to learn more about their products and services — which, as our testing has shown, typically results in increased user interest and increases the likelihood that users will decide to purchase a product or service.

This article presents the research findings from just 1 of the 600+ UX guidelines in Baymard Premium – get full access to learn how to create a “State of the Art” e-commerce user experience.

Readability: The Optimal Line Length (2024)

FAQs

How do you determine the most readable line length? ›

  1. Line length is the distance between the left and right edges of a text block. ...
  2. The most useful way to measure line length is by average characters per line. ...
  3. Shorter lines are more comfortable to read than longer lines. ...
  4. Alternatively, use the alphabet test to set line length.

How many words should a line of text be for optimum readability? ›

To determine line length for optimum readability, a good guideline is between 9 and 12 words for unjustified text. Fewer words may cause the sentence structure to break up, and may also result in too many hyphenations. Both of these reduce readability.

What is the best line height for readability website? ›

While there is no perfect line height, a good rule of thumb is to set it at approximately 150% of the font size. While there is no perfect line height, a good rule of thumb is to set it at approximately 150% of the font size.

What is the optimal text width for readability? ›

Optimal line length or column width for body text is 40–70 characters. When people read, their eyes jump across a line of text, pausing momentarily to take in groups of three or four words. Studies have shown that readers can make only three or four of these jumps (or saccades) per line before reading becomes tiring.

What is the optimal line length in reading -- a literature review? ›

Research has led to recommendations that line length should not exceed about 70 characters per line. The reason behind this finding is that both very short and very long lines slow down reading by interrupting the normal pattern of eye movements and movements throughout the text.

What is the maximum readability? ›

The Flesch Reading Ease gives a text a score between 1 and 100, with 100 being the highest readability score. Scoring between 70 to 80 is equivalent to school grade level 8. This means text should be fairly easy for the average adult to read.

What should my readability score be Grammarly? ›

Next time you're working on a document in the Grammarly Editor, open up the writing assistant and click Performance. Under the Readability section, you'll see a numerical score. The higher the number, the easier it is to read your document. In most cases, you should aim for a score of 60 or higher.

What is a good readability level? ›

What is a good readability Score? A Grade Level of 8 or lower is good for text aimed at the public. 85% of the public will be able to read and understand your content at Grade Level 8. Read more about readability scores.

How can you optimize the readability of your text? ›

Are there proven strategies to improve readability?
  1. Use short, easy words. ...
  2. Shorten your sentences. ...
  3. Nix some of your adjectives and adverbs. ...
  4. Drop the jargon. ...
  5. Use reader-friendly fonts. ...
  6. Break up your copy. ...
  7. Test your writing using readability formulas, and aim for grade level 7 or 8.
Sep 27, 2017

What does line height 1.5 mean? ›

line-height: 1.5 (without units) will mutiply the element's font size by 1.5 to compute the line height. line-height: 150% will take 150% of the element's computed font size to compute the line height, which is equivalent to multiply it by 1.5 .

What is the ideal character line length? ›

Traditional line length research, limited to print-based text, gave a variety of results, but generally for printed text it is widely accepted that line lengths fall between 45 and 75 characters per line (cpl), though the ideal is 66 cpl (including letters and spaces).

What is the standard line height? ›

The default line height in most browsers is about 110% to 120%. This is a paragraph with a smaller line-height. This is a paragraph with a smaller line-height. This is a paragraph with a bigger line-height.

How do I check text readability? ›

Go to File > Options. Select Proofing. Under When correcting spelling and grammar in Word, make sure to select the Check grammar with spelling check box. Select Show readability statistics.

How do you calculate readability? ›

Count the number of words with three or more syllables in the input. Count the number of sentences in the input. Count the average length of sentences (number of words) in the input. Count the average number of syllables per word in the input.

What are the rules for readability? ›

For optimal readability:
  • Use visual and semantic space. ...
  • Provide the right amount of space between lines of text. ...
  • Use clean typography. ...
  • Avoid using all caps. ...
  • Don't underline text. ...
  • Use left-aligned text. ...
  • Don't put two spaces after a period. ...
  • Support text resizing.

What does the length of the line represent? ›

This line segment has two endpoints A and B whose length is fixed. The length of this line segment is the distance between its endpoints A and B. So, a line segment is a piece or part of a line having two endpoints.

Why 80 characters per line? ›

The limit of the line length in 70–80 characters may well have originated from various technical limitations of various equipment. The American teletypewriters could type only 72 CPL, while the British ones even less, 70 CPL. In the era of typewriters, most designs of the typewriter carriage were limited to 80–90 CPL.

What is the lowest readability score? ›

Then, it provides you with a score between 0 and 100. A score of 100 means your copy is very easy to read. And, a score of 0 means your text is very difficult to read.

What is a good readability score in word? ›

Flesch Reading Ease, or readability based on the average number of syllables per word and the average number of words per sentence. Standard writing averages 60 to 70 on a 100-point scale. The higherthe score, the more people can readily understand the document.

What does high readability mean? ›

High readability lessens misunderstanding and lets the reader easily process the information that you've shared without expending a lot of energy. In business, particularly in marketing, readability is very important, because it can affect how engaged readers are with your content.

Is 90 a good Grammarly score? ›

A score of 90, for example, means that the writing in your document is more accurate than the writing in 90 percent of other documents with similar goals. This menu also allows you to check the document statistics, such as readability score, word count, and vocabulary use.

Is Grammarly writing score accurate? ›

Understanding Grammarly's scoring method

Grammarly's score isn't necessarily indicative of a writer's voice quality. It's related to all other text the tool analyzes. So, an overall score of 82 means the work ranks better than 82% of all the content Grammarly analyzes.

Is Grammarly 100% accurate? ›

One Final Tip: Help Grammarly to Help You

As we know, Grammarly isn't 100% accurate, so be sure to research any suggestions that seem iffy. By doing this, you'll learn more about grammar and punctuation and be better prepared to know if you should keep or toss Grammarly's future recommendations.

What is a good example of readability index? ›

Flesch Reading Ease Index – the classic readability index
Flesch reading ease valueReadabilityUnderstandable for
30–50Difficult
50–60Fairly difficult
60–70Standard13 to 15-year-old students
70–80Fairly easy
3 more rows
Jul 9, 2018

What is readability and why is it important? ›

Readability is a measure of how easy a piece of text is to read. The level of complexity of the text, its familiarity, legibility and typography all feed into how readable your text is. Readability is a key factor in user experience. Accessible content builds trust with your audience.

How can you improve readability and presentation? ›

Shorter sentences

Shortening sentences will increase readability of your text more than any other advice on simple language. Keep the average between 15 and 20 words per sentence. Some other language tips: • Address the reader rather than talk about them. Use verbs rather than nouns when possible.

What does line height 1.4 mean? ›

Each line becomes 1.4 lines in height, so it is 140% of it's original height based on your font-size. This is not the same as height:140%; since width and height % 's are based on the parent Element. line-height is not based on the parent Element, so line-height:140%; is the same as line-height:1.4; .

How many points is 1.5 lines? ›

The first is set to “1.5 lines” (which is 21 points per line).

How do you specify a line height? ›

The line-height CSS property sets the height of a line box. It's commonly used to set the distance between lines of text. On block-level elements, it specifies the minimum height of line boxes within the element. On non-replaced inline elements, it specifies the height that is used to calculate line box height.

What is good line and length? ›

For fast bowlers the "good length ball" is usually six to eight metres in front of the batsman, and for slower bowlers (spin) it is usually at about three to four metres before the batsman, though the optimal length will vary according to the state of the pitch, prevailing weather conditions and the height and playing ...

What line spacing is easiest to read? ›

Most UX designers learn line spacing of 130-150 per cent is best for readability (1.3-1.5), with 140 per cent (1.4) the golden ratio, but that formula won't benefit all users.

What is the best length for a long line? ›

A long line is simply a long leash, typically between about 10 and 30 feet long, that attaches to your dog's harness or collar.

Why is line spacing important? ›

Spacing such as space between lines and space between words impacts readability. The space between lines in a block of text is also called leading. Some people need more space between lines to be able to read text. Line spacing also helps with tracking.

What is a good line spacing in word? ›

The default line spacing in Word is 1.15. By default, paragraphs are followed by a blank line and headings have a space above them.

What is line spacing question answer? ›

Line spacing determines the amount of vertical space between lines of text in a paragraph. By default, lines are single-spaced, meaning that the spacing accommodates the largest font in that line, plus a small amount of extra space.

Top Articles
Latest Posts
Recommended Articles
Article information

Author: Msgr. Benton Quitzon

Last Updated:

Views: 6240

Rating: 4.2 / 5 (63 voted)

Reviews: 94% of readers found this page helpful

Author information

Name: Msgr. Benton Quitzon

Birthday: 2001-08-13

Address: 96487 Kris Cliff, Teresiafurt, WI 95201

Phone: +9418513585781

Job: Senior Designer

Hobby: Calligraphy, Rowing, Vacation, Geocaching, Web surfing, Electronics, Electronics

Introduction: My name is Msgr. Benton Quitzon, I am a comfortable, charming, thankful, happy, adventurous, handsome, precious person who loves writing and wants to share my knowledge and understanding with you.