Comment by sublinear
8 hours ago
There are no bad animations, only bad designs.
If you design the animation to be way over the top like this, and then design the page to use it on every line then of course it looks like shit.
This is like arguing against any amount of sugar in food and then shoveling it into someone's mouth to try to prove your point. It's disingenuous and you aren't proving anything. I don't even think the top agreeing comments here are coming from web devs or the target users.
Animations need to to serve a purpose.
Fading in is justifiable when you're adding new content on top of existing content, and need to draw attention to the fact that something changed in that part of the screen. None of that applies in the case of fade-in during scrolling. The user is already scrolling, everything on screen is moving, and new content is already expected to be coming in to view at the bottom of the window. Adding animations on top of all of that doesn't help anything, and just distracts from and delays presentation of the content the user was already trying to reveal.
Scroll-fade does serve a purpose when used correctly, and others have posted real world examples of this already. It's so subtle that without them hardly anyone even knew what this blog post was ranting about.
It's just a way to draw attention to text without solely relying on typeface modifiers.
The real designs bring attention to what users are scrolling past as it flies by on the screen. That temporary urgency is why it's an animation. This is something that weight, height, underline, etc. cannot do as clearly. It's usually on the h-tags only, not every single line. That communicates the page structure too. It's clever and attractive when done right. It's not a new idea, and nobody was complaining about it until now.
> It's just a way to draw attention to text without solely relying on typeface modifiers.
Adding animations to bring attention to the thing that the user's attention is already focused on is not useful.
> The real designs bring attention to what users are scrolling past as it flies by on the screen. That temporary urgency is why it's an animation.
Did you mean to say "the good designs"? Because there are most certainly many real designs in the wild that badly abuse scroll fading to delay the appearance of all content below the fold.
> It's usually on the h-tags only, not every single line. That communicates the page structure too.
Making only the headings fade on is definitely something I see less often than the more blunt approach of having everything (or almost everything) fade in. And the message it sends to the user is that the text of the headings is not worth reading, otherwise the designer would let those words show up first.
> It's clever and attractive when done right. It's not a new idea, and nobody was complaining about it until now.
It's mildly annoying at best, and has been widely hated and criticized for as long as people have been doing it badly.
If you sped this up, and minimized it to the point it was unnoticeable, it would not hurt the browsing experience.
But that raises the question...