Increase Readability of Your Online Content

Decorative: Screens with different reading formats, from solid blocks of text to one using headings, bullets, F-pattern, etc.


"UX Writing: How Scannable Content Can Increase Reading Time" (post) offers suggestions for presenting your online content to take advantage of current information-seeking behaviour and online reading patterns.

  • Breaking up your written course content as outlined in the post increases student engagement with the material and, hopefully, content retention.
  • The post contains more information on each point below as well as practical suggestions and images illustrating each point.

1. Online Reading/Scanning Patterns

  • "F-pattern": Readers "scan from left to right at the top. Then, they scan from top to bottom at the beginning of the sentences."
  • "Spotted pattern": "Users’ eyes go from one place to another, looking for keywords or guided by highlighted elements."
  • "Layered-cake pattern": "People’s eyes are encouraged to scan not only words but chunks."
  • "Commitment pattern": "People ... read word by word ... because it seems connected to their goals. And it looks inviting to scan."

2. Checklist to Reach a Commitment Pattern

  • Each point is elaborated in the text.

a. "Chunking content"

"3 paragraphs of 3 lines are much better than 1 paragraph of 9 lines."

  • "Use subheadings every time you can." 
  • "Write shorter sentences." 
  • "Make shorter paragraphs." 
  • "Break paragraphs into lists." 

b. "Front-loading key information"

"Answer first what they’re looking for. Then get to the details."

  • "Rule of twos": "Watch carefully what’s in the first 2 paragraphs ... first 2 lines ... first 2 words." 
  • "Add a summary at the beginning." 
  • "List of contents as links to the respective subheading." 
  • "Hierarchy of content"
    • "Answer ... the what, when, who, and where."
    • "Then get into the why, keeping the extra details at last."

c. "Creating a visual hierarchy"

"Sizes, colors, and spacing ... hel[p] to infer what is more important."

  • "Typography": "[C]ommunicate the reading order."
  • "Key ideas on bold." 
  • "Images": "[M]eaningful[ly] complement your ideas and invite to keep exploring." 

d. "Avoiding distractions"

Avoid the following or use them only with great care.

  • "Centered-aligned texts": "They break the reading flow." 
  • "Colored spots: "They can ... distract people from the reading flow." 
Printer Friendly, PDF & Email