Reading Progress: Measuring Attention

approximately two cups of coffee

Reading Progress: Measuring Attention

Most progress bars track scroll position. Scroll fast enough and you can complete an article in seconds without reading a word. This experiment tries something different: measuring attention rather than movement.

The bar at the top moves based on your scroll position, but the indicators change based on how you read. The circle in the corner responds to pause duration. When you stop scrolling, it brightens. Stop long enough, and it deepens — a visual acknowledgment of sustained attention.

This block responds to your reading pace. Scroll quickly and it warns you. Linger here and it settles into green, suggesting you're taking time with the ideas.

What does it feel like to have your reading behavior reflected back to you? Does the feedback change how you read? Do you find yourself pausing deliberately to see the attention indicator respond? Or does the measurement become a distraction from the thing it’s trying to measure?

There’s something unsettling about quantified attention. Reading becomes performance. The pause becomes calculated rather than natural. You start reading for the indicator rather than for understanding.

But there’s also something honest about it. How often do we skim without admitting we’re skimming? How often do we claim to have read something we only glanced at? These indicators make the quality of attention visible.

This text appeared gradually as you read. Did you notice when it became visible? Or were you too focused on the other indicators to see the slow fade-in?

The problem with measuring reading is that reading isn’t uniform. Some paragraphs deserve quick scanning. Others reward slow consideration. Some ideas click immediately; others require circling back. A good progress indicator would somehow account for this variability.

What if the progress bar moved backward when you re-read a section? What if it slowed down automatically for complex passages? What if it could distinguish between productive re-reading and confused re-reading?

These are technical questions, but they point to deeper ones about attention itself. What does it mean to “complete” a piece of writing? Is understanding binary or gradual? Can attention be measured, or only experienced?

Notice how this block changes color based on your scrolling behavior. The CSS is listening to scroll events and pause duration, trying to distinguish between different kinds of reading.

In user experience design, engagement metrics often substitute for understanding. Time on page, bounce rate, scroll depth — these measure behavior, not comprehension. They optimize for attention capture rather than attention quality.

This experiment asks a different question: can technology support better reading rather than just more reading? Can progress indicators encourage depth rather than speed? Can measurement serve understanding rather than metrics?

The answers probably depend on intent. Measurement in service of learning looks different from measurement in service of advertising.

By the time you reach this paragraph, the reading progress bar shows completion. But completion of what? You’ve scrolled to the bottom, but have the ideas settled? Do they connect to anything else you’ve read? Will you remember this tomorrow?

True reading progress might not be measurable at all. It happens in the spaces between words, in the moments of recognition, in the way one text changes how you read the next one. It’s recursive, non-linear, often delayed.

Maybe the most honest progress indicator would be a question mark that grows larger the more you read.


Technical Notes

The CSS above uses scroll event listeners and timer functions to track:

  • Scroll progress: Standard position-based progress bar
  • Pause duration: Attention indicator that responds to reading breaks
  • Reading pace: Blocks that change color based on scrolling speed
  • Paragraph completion: Markers that brighten as content comes into view
  • Time-based reveals: Content that appears gradually during reading

The code distinguishes between fast scrolling (potential skimming) and deliberate pauses (potential attention). But it can’t distinguish between thoughtful pauses and distracted pauses — that gap between measurement and meaning remains.

Does knowing your reading behavior change your reading behavior? The feedback loop is immediate and visible. Whether it improves or degrades the reading experience probably depends on the reader, the content, and the quality of attention they bring to both.

*Last touched: April 5, 2026*