Table of Contents

Scrolling is how I use a computer. I also scroll a lot on my smartphone. I scroll elsewhere—through menus on video game consoles, books on my Kindle, apps on my Apple Watch…

You get the point. I scroll a lot.

Most people who use modern computing devices navigate them, in part, by scrolling. Of course, there are other ways to navigate devices. You might search and jump to a specific spot on your device or document. Keyboards and accessibility devices also help us navigate computers. However, such affordances aren't uniformly provided across devices, nor is such functionality as widely understood and adopted as scrolling.

You get the point. We scroll a lot.

My zeal for scrolling

I've spent 20+ years scrolling through interfaces on countless devices. Such incessant scrolling has informed a more-or-less "intuitive" understanding of how it should feel. I'm used to scrolling through websites and apps on my computer and iPhone.

If I could sum up my relationship with scrolling in three concise bullet points:

• I know what to expect when scrolling
• Scrolling reliably gets me from point A to point B
• Scrolling isn't something I have to think about because it happens so naturally

This is why I'm such a stickler for how scrolling is implemented.

And why shouldn't I be?

Scrolling is one of my primary means for
navigating a bevy of devices — how about you?

The current state of scrolling

In my experience, websites are the primary offender for altering scrolling mechanics for no good reason. There's nothing more jarring than loading a web page, beginning to scroll through it, and immediately recognizing how unnatural the scrolling feels.

Changing how default scrolling mechanics work in an application is commonly referred to as scroll-jacking.

What's worse is realizing that such a core mechanic was altered for no good reason.

I emphasize that scrolling mechanics are frequently changed for no good reason because of how mindlessly such changes are thrust upon us. If I don't understand why you've altered scrolling within the first 5 seconds, you've done it for no good reason.

This isn't to say there aren't well-intentioned web designers and developers behind the scenes making such decisions who surely mean no ill will to the rest of us. I've been there. But we can do better.

Deciding whether to alter scrolling mechanics

Anybody building websites or user interfaces should recognize the importance of consistency with the mechanics of human-computer interaction.

I never want core scrolling functionality to change. If I can't quickly jump down your page using the Space key or CMD + ⇩, you've fucked up.

You might be able to get away with altering the physics, but only if it's for a Very Good Reason.

Spoiler alert: it probably isn't.

Furthermore, I don't want to notice or pay attention to scrolling when visiting your website. I like the action of scrolling to be as "invisible" as possible when navigating an interface so I can accomplish what I've set out to do.

The goal isn't to enjoy scrolling. The goal is to use scrolling to do something enjoyable.

Here are some Very Bad Reasons for altering scrolling:

• You think it adds to the "experience"
• You think it feels "cool" or "fun"
• You think it makes your website "dynamic"
• You think it enhances the animations
• You think I will enjoy it

Here are some Very Reasonable Reasons for altering scrolling:

• Scrolling is part of the mechanics for a game
• You intentionally want to create something experimental and push the boundaries of human-computer interaction while acknowledging the downsides that such alterations incur

Here are some Very Good Reasons for altering scrolling:

• crickets chirping

Focus on what matters

If I could succinctly summarize my thoughts on altering scrolling mechanics for websites, it would be to do so sparingly and intentionally. ^[1]

Don't do it if you aren't 100% confident that changing the scrolling mechanics is absolutely necessary for your goals. Just don't.

Focus your attention elsewhere—the content of your website, art direction, animations, accessibility, usability, etc.

Focus on what matters. Don't create new problems by solving a problem that doesn't exist.

Examples

I will update this section with examples of scroll-jacking as I find them. In no way am I trying to publicly roast, embarrass, etc. I simply wish to inform so that our industry can improve as a collective through quality user experiences.

Very good examples

• The Boat

Very reasonable examples

• The fate of half-lucky souls rest here

Very bad examples

• Ramotion: Design Agency

Resources

Articles

• Scrolljacking, by Robin Rendle

Libraries

• Smooth Scrollbar
  • I frequently see this library used across the web. I hate it. No, I don't hate who creates, uses, or maintains it. But I hate how the library is used. It may be a "high performance" plugin, but I strongly dislike having the momentum and physics of scrolling changed.

Footnotes

1. Though I'm not one for succinctly summarizing my thoughts on anything. ↩︎