upvote
Anthropic uses it across all their websites, here's a typical example where the effect is obvious as you scroll down: https://claude.com/solutions/agents

I could be wrong, but my simple guess is that it's become widespread in LLM-generated websites partly because of Anthropic's own style guides getting adopted through Claude-bundled skills and such.

reply
It is partly to blame, yes. This is from Claude’s official frontend skill:

“Motion: Use animations for effects and micro-interactions. Prioritize CSS-only solutions for HTML. Use Motion library for React when available. Focus on high-impact moments: one well-orchestrated page load with staggered reveals (animation-delay) creates more delight than scattered micro-interactions. Use scroll-triggering and hover states that surprise.”

reply
Who thinks like this? The last thing I want on a website is surprise. I want to do what I came there to do, the same way it worked last time, and then get on with my day.
reply
On a Web site or anywhere else. Apple, Microsoft, "flat design," and peek-a-boo UI all insult the user and waste his time by turning an important tool into an Advent calendar.
reply
s/micro intentions/micro aggressions/
reply
Replying to the wrong person and trying to replace a phrase that wasn't used. Bravo, you take the cake for low effort post.
reply
> creates more delight

ARE YOU NOT DELIGHTED?

reply
That's a bit different since those are separate chunks of content rather than running prose (and they're mainly meaningless marketing fluff anyway). I don't find it all that annoying compared to the original article.
reply
It's still incredibly insulting to waste the user's time trying to force them to read the page sequentially instead of being able to immediately scroll to the chunk of content they are actually trying to find. Especially if it is not the user's first visit to the page.
reply
Studies show that viewer comprehension is strictly worse for presentations that use “build” animations vs ones that do not.

I assume the study results would be the same if they were repeated using fade scrolls.

reply
It's not as bad because it's a much faster fade in, but I still find it incredibly obnoxious.
reply
On top of that, that page took 10 seconds to load. On a Gbit network connection, lol
reply
I used to inject a prefers-reduced-motion: true to most websites a few years back when this trend really picked up; and generally have all animations turned off at the OS level and at least on mac that injects reduced motion preference to the browser.

So for example on claude's website I get no animations, pretty good QoL improvement. Now webdevs HONORING prefers-reduced motion, that can vary.

reply
This is a great example of LLM feedback loops. Anthropic's site uses scroll fade, Claude's training data includes Anthropic's site, Claude recommends scroll fade to users, those sites become future training data. The web converges on one aesthetic and nobody remembers choosing it.
reply
https://webflow.com/ is what i blame for the fade-in on scroll module.

15 years ago it did look very polished, boutique, professional. Now that it's a module everyone can do, everyone literally does it for every module.

Also there's tailwind that likely has a module for all the modules in webflow.

reply
Are the little hand animation graphics meant to flicker like they're an epilepsy test? That was so awful I didn't have brain power left to notice the fade scroll.
reply
You are absolutely right!
reply
Parts also seem to ignore prefers-reduced-motion.
reply
the effect in this example fine though, and not obnoxious like OPs? I don't get it
reply
> The poster seems to be implying that this effect is prevalent across the web

Because it is.

For sites with dynamic content (social media, news, etc.), it doesn't happen.

But commercial sites trying to convince you to use their product, they're incredibly common. It's not always a fade in exactly like this site does it. Sometimes it's content sliding in from the side.

It's incredibly pervasive on SaaS marketing pages.

reply
> It's incredibly pervasive on SaaS marketing pages.

That would explain my ignorance of it - such sites are in the bottom negligible percentage of sites which i might accidentally visit but never purposely do.

reply
I was redesigning a website of mine and Claude suggested to add this as an animation. My theory is that, if claude is confident in a suggestion, a lot of other people have done the same.

Maybe it's too subtle to notice.

Edit: on odeva.nl

reply
The scroll fade on that site is comparatively inoffensive (comparatively), because you messed with scrolling itself, which is one of the worst things you can do, taking over and ruining inertia. You’re literally going out of your way to make things worse. The ONLY time scrolljacking of any kind is acceptable is for things like maps where there is no “normal”.
reply
Or for a game, where it's part of the interface.
reply
Got an example of what you mean? Because if you mean the only thing I can think of, I very strongly disagree.
reply
Hijacking native scroll behavior to badly reimplement anything remotely like scrolling is wrong even in a gaming context. But if you're implementing Half Life 2 in a browser, where the user no longer has a normal cursor, then hijacking scrolling to implement the weapon switcher is fine.
reply
You probably haven't noticed it before because when it's done well, it's a subtle and pleasant effect that can be used to draw your attention to particular elements on the page.

This site is intentionally doing it very poorly to make a point. Really, the takeaway should be don't do things poorly. But that's kind of obvious.

reply
> when it's done well, it's a subtle and pleasant effect

I've seen it quite a lot, but apparently I've never seen it done well. It's a very annoying effect that chases me away from the site using it.

reply
deleted
reply
Not doing it at all would be better still. It's really annoying.
reply
Fade in in scroll will always be slower than the reading speed of a significant percentage of population.

This becomes worse for people who just skim content, re-read the text, or want to quickly scroll to a specific place in text

reply
It can speed up the loading of the above-the-fold content because the images on the rest of the page can be loaded as the user scrolls closer to them.
reply
You can do this with just the 'loading' attribute on img elements and let the browser handle it without the gratuitous animations:

   <img loading="lazy" src="image.jpg" alt="..." />
reply
So you agree that for text, it should NEVER be used. And you are only arguing for lazy loading of images?
reply
Yes, if you make things only slightly worse it's better than if you make them a lot worse. But neither is quite as good as not deliberately making things worse.
reply
> when it's done well

It's always awful. This site is exagerated in degree, but in kind it's merely on the scale of awful.

Computers should not waste my time. Even if eyes are 10ms faster than the awful fade, if a million people see it, that's almost three hours of human life down the drain.

And when scrolling fast, or far, it's not uncommon to have it waste a second of human time. A million of those is 38 human working days, just flushed down the toilet, because someone wanted "pleasant".

It's fantastically disrespectful of other people's time.

The web is already slow. No need to deliberately spend effort to make it even slower.

reply
"It's fantastically disrespectful of other people's time."

And this is what people have become way, WAY too tolerant of. The deliberate theft of customers' time. While this is obviously a very minor example, there are lots and lots of others that aren't.

reply
Agree 100%!

I’m a fast scroller and skimmer. Info scroll down and the text is not there I’ll just assume that the site is shot and close it. Ain’t nobody got 200ms to wait for a god damn fade in when there’s an infinite amount of sites out there to discover.

reply
I don't have a strong opinion either way on the effect, but I do have to say that I always find it amusing how fatalistic HN can sometimes be over the most minor cosmetic inconveniences, couching them as "wasting (large amounts of) humanity's time" and "disrespecting people" as if we're talking about something far more serious than little animations on a webpage.

I mean, you might not like it, and that's fair and understandable, but is it really that big of a deal? Surely not.

reply
I mean, like the other commenter I would just close the page instead of enduring it.

But yes, in fact if this page succeeds then it's wasting human life on things as productive as spam phone calls. People have solved the latter by simply not answering for unknown numbers.

Not sure what you mean by "fatalistic". To the point where I'm not sure that's the word you mean. It's fatalistic as in fate. Maybe you mean morbid?

Standing in line at the DMV is also all "counting flowers on the wall, that don't bother me at all"? But even at the DMV it's (hopefully) not done maliciously.

> cosmetic inconveniences

Sometimes things suck. That's not remotely as frustrating as knowing that someone went out of their way to make your life worse.

> is it really that big of a deal? Surely not.

If we capped all laptop CPUs to 600MHz, would it really be that big of a deal? Maybe they did it because of the acoustic preference of not needing to spin the fans as much, and therefore you are not allowed faster CPUs?

reply
They didn't go out of their way to make your life worse. They went out of their way to design something they thought you would like, but you didn't like it.
reply
> million of those is 38 human working days, just flushed down the toilet, because someone wanted "pleasant".

This is the wrong conclusion. The amount of work that can be accomplished summing one second from 38 million people is approximately zero - much different from stealing 1 day from 38 people or 1 hour from 912.

reply
[dead]
reply
Are you sure you don't have prefers-reduced-motion enabled? I just found out I already have it enabled when I went to look for how to enable it...
reply
I’ve seen the mostly in personal website templates used by people that would have had very sparkly MySpace profiles had they been creating for the web back then.
reply
It definitely isn't prevalent, and usually is for "feature" pieces (like an expose on the Washington Post back when they were a real newspaper), along with product pages.

Apple uses it for their various pages, and it is legitimately annoying-

https://www.apple.com/iphone/

Tesla is a fan as well-

https://www.tesla.com/models

Occasionally sites use lazy loaded images, and do a "fade in" effect when they're actually loaded. Nothing wrong with that particular use.

reply
> https://www.tesla.com/models

Love how that page takes almost 10 seconds to load for the first time on a 200Mbps connection

reply
> The goldfish

It goes where you click in the water area

reply