notes
1 min read

Notes on scroll, restraint, and speed

Smooth scrolling is easy to add and easy to abuse. A few rules for keeping scroll motion on the right side of pleasant.

  • Motion
  • Web

Scroll is the most-used interaction on the web and the least-designed. We polish buttons for weeks, then let the entire page move however the browser defaults to. Smooth scrolling libraries changed that — and, predictably, a lot of sites now feel like they’re stuck in syrup.

Here’s how I think about it.

Smooth, not slow

Smooth scrolling should reduce the distance between your input and the page, not increase it. If the content keeps moving after your fingers stop, the effect has gone too far. If you can feel the easing as a delay, it’s too heavy.

The good settings tend to be conservative: a small lerp, no long glide, no inertia on short flicks.

Never fight the reader

Scroll effects should never interfere with reading. No horizontal hijacking. No sections that pin until an animation finishes. No progress indicators that lie about where you are.

The page belongs to the person reading it. Motion is a courtesy, and courtesies are quiet.

Reveal once, then get out of the way

I like a small reveal when a block first enters the viewport — a short lift, a soft fade, done. What I don’t need is the same element fading out when I scroll back up, or a perpetual parallax that forces me to re-read.

Animate the entrance. Then leave it alone.

Test it on a slow phone

Everything feels fine on a laptop. The honest test is a mid-range phone, one thumb, bad signal. If the scroll stays responsive there, the effect earns its place. If it stutters, it was never about design in the first place.

Speed is the most tasteful motion of all.