Do Fancy Website Animations Hurt Conversions?

4 days ago

11 min read

Two phones compared: one with a beautiful scroll video that hides the main button, and one that shows it right away

Sometimes, yes. Fancy website animations hurt conversions when they make a visitor wait for the thing they came for. That wait can be a slow page. It can also be a beautiful scroll video that plays before that thing shows up.

That is my honest answer after looking at the research and at the websites I see lately. I did not find a study that proves fancy motion lowers sales, and I did not find one that proves it helps. So this article is part evidence and part logic, and I will tell you which is which.

Two quick definitions, so nobody has to guess what I mean:

The thing they came for is the reason the visitor clicked and opened your page in the first place. It can be an answer to their question, a solution to their problem, a service, or a product to buy.
A scroll video is a video that plays only as the visitor scrolls. The visitor has to keep scrolling to move the story forward. It is not a fixed video in one section that they can skip in a second. In the designs I am talking about, reaching what comes after it means scrolling through the whole story first.

Your website is not a painting. It's an employee.

Think about your website the way you think about an employee. It has one job: help your visitor get what they came for.

That might be a purchase, a sign up, or a booking.

When you hire someone, you don't ask how impressive they look. You ask what they get done. Your website deserves the same test.

Why do visitors come to your website?

A visitor comes to your site for one thing. An answer to a question. A solution to a problem. A service. A product to buy.

Many of them have no time. They are on a phone, in between other things, and they want to know one thing: can this business help me?

The data on how long people stay is not kind to slow starts. Jakob Nielsen's summary of research by Microsoft Research, covering more than 200,000 web pages, says users often leave a page within 10 to 20 seconds. The first 10 seconds matter most, and his advice was to make your value clear within that time. That article is from 2011, so it is not new, but the point makes sense to me: the clock starts the moment a visitor lands.

What do I mean by fancy website design?

I mean websites with videos playing in the background, scroll animations, and whole stories told in motion. Lately I see more and more of them, especially in design portfolios. One popular type is the scroll video, where the video plays only as the visitor scrolls. They have to keep scrolling to move the story forward, so it is not a fixed video in one section that they can skip in a second.

And honestly? They look GREAT.

Here is an example. Recently I saw a restaurant website built as a scroll video. The video only moves forward while the visitor keeps scrolling. First it shows a street with directions, then it takes the visitor inside the restaurant, then it moves between the tables. It is a beautiful experience. But the menu button only showed up after about a minute of scrolling.

The visitor came for the menu. Every business has its own version of the menu. It is the thing the visitor came for: an answer to a question, a solution to a problem, a service, or a product to buy. Where is that thing while the story is still playing?

I'm starting to see the same idea repeat on websites made with AI tools. AI makes it faster and easier to build these effects, so I expect we will see more of them. That is my opinion, not a fact I can prove.

But "looks great" and "works great" are two different things. A portfolio is made to impress people. A business website is made to help a visitor who needs something.

Is waiting for a video the same as waiting for a page to load?

Most studies on speed measure one thing: how long it takes a page to go from blank to loaded. I look at it differently. The visitor's wait does not end when the page loads. It ends when they can do what they came to do.

Timeline showing that speed tools measure until the video appears, but the visitor waits until they get what they came for

So to me, a blank page that tells the visitor nothing and a beautiful video that gives no clear direction are in the same category. In both cases, the visitor is waiting.

Is that fair? Partly. A video is not a blank page. It gives people something to look at, and some people enjoy playing with the effects. I agree with that. But what about the visitor who has no time and came for an answer, help, a product, or a service? For that person, a beautiful video that does not point to the next step is still a wait.

Google's own guidance points in the same direction. Google's web.dev team says the moment a page "loads" does not always match what users care about. Its example is a page that loads quickly but shows its real content several seconds later. It asks a better question: has enough content shown up for the user to engage with it?

There is one more detail. Google's Largest Contentful Paint metric, one of its main page speed measures, counts a video's poster image or first frame as content. What follows is my reasoning, not Google's statement: a page can score well because the first frame of a video showed up fast, while the visitor still can't find what they came for, whether that is the answer, the service, the product, or the main button. The tools measure when something appears. They don't measure whether the visitor can get what they came for.

What happens when the thing people came for shows up late?

Back to the restaurant example. Making visitors scroll for a minute before they reach what they came for bets that every visitor will stay and keep scrolling. The research I found says that is a risky bet. None of these studies tested that exact design, so treat them as the closest evidence I could find.

What the research found	Source	What it means here (my reading)
In an eye-tracking study with 120 people, 57% of viewing time was spent above the fold, and 74% in the first two screens of a page	Nielsen Norman Group, 2018	What shows up late is seen by fewer people. People do scroll when they have a reason to, so this does not mean nobody scrolls.
When navigation was hidden, people used it less on desktop (27% of the time versus 48% when it was visible), and tasks took at least 39% longer	Nielsen Norman Group, 2016 (179 people, six websites)	Hiding what visitors need makes it harder to use. The study looked at hidden menu icons, not buttons or content that only appear after a long scroll, so it is close but not the same.
In testing, people skipped past animations while looking for something specific, some visitors saw a nearly blank screen while pages loaded slowly, and most users were indifferent to the effects	Nielsen Norman Group, 2019	Visitors with a goal tend to ignore the show. The article gives no sample size, so this is observation, not a measured result.

Put simply: the top of the page gets the most attention, and the harder you make the main thing to find, the less people use it. Anything the visitor came for that shows up late works against both.

Does page speed still matter?

Google reported that 53% of mobile site visits are abandoned when a page takes longer than 3 seconds to load.

That number is about load time, not animation. But here is my logic: videos, large images, and scroll effects add weight to a page, and a heavier page can load slower, especially on a phone. If you use them, test your speed.

That number measures load time only. It does not measure the kind of wait I described with the restaurant website, and I did not find a study that does. That part is my own observation, not proven data.

Where could I be wrong?

A good argument has to face the other side. Here are two points that go against me.

Looks matter, and they matter fast. A 2006 study led by Gitte Lindgaard found that people can judge how visually appealing a web page is in about 50 milliseconds. That is one twentieth of a second. The researchers also suggest that this first impression can color how people judge the rest of the site, as reported by E-Commerce Times. So I will not tell you that looks don't matter. But the study measured how appealing a page looks. It did not measure whether people buy, book, or sign up. Looks open the door. They don't finish the job.

Some people enjoy the effects. In a 2013 master's thesis at Purdue University, 86 people were split into two groups, and each group used one of two websites that were identical except for the parallax scrolling effect. Parallax scrolling means the background moves at a different speed than the content as you scroll. The only significant difference was that people found the parallax site more fun. The researcher concluded it did not necessarily improve the overall user experience. This is one small, older study, so treat it as a hint, not a verdict.

Here is what all the evidence in this article shows, and what it doesn't:

It shows	It does not show
People judge how a page looks in a split second	That looks alone lead to sales
Many visitors leave a page within 10 to 20 seconds	That a fancy design is the reason they leave
Many mobile visitors leave slow pages	That a video or animation is what slows down your page
Hidden navigation is used less and slows tasks down	That making visitors wait for what they came for lowers conversions in your case
In one study, parallax was more fun but did not improve the overall experience	That fancy design lowers conversions

My reading: motion is not the enemy, and looks are not the whole job. Speed and clarity decide whether the design works.

When does a good thing go too far?

Anything good, taken too far, can turn into its opposite. A little salt makes food taste better. Too much, and nobody can eat it.

Motion works the same way. A little can guide the eye to the button. When everything moves, the visitor can't tell what matters, and the design that was meant to help starts to get in the way.

A calm screen with one clear button next to a chaotic screen where everything moves and nothing stands out

That is not a reason to ban motion. Here is the rule I use.

If your fancy design helps visitors find what they need fast, go for it.

If it makes them scroll, wait, and search, simplify the journey.

Five quick checks:

Can a visitor on a phone see what you offer and what to do next, without waiting for an animation to finish?
Is what your visitor came for (the answer, the price, the service, or the main button) visible right away, without scrolling through a story?
Does each animation explain something or point to the next step, or does it only decorate?
Does your page load fast on mobile?
Can a visitor pause or skip moving content?

If you answer no to any of these, that is where to start simplifying.

One more reason to be careful: the W3C accessibility rules (WCAG 2.2, level A) say that content that starts moving on its own, lasts more than five seconds, and sits next to other content needs a way to pause, stop, or hide it. The reason is that continuous movement can distract people with attention or reading difficulties. The rule does not speak directly to scroll-controlled effects, but it shows that motion has limits.

What should I ask before I approve a design?

Before you approve any design, ask: "What did my visitor come here to do, and how fast can they do it?"

Don't pick a design because you like how it looks. Pick it because of what it does for the people you want to serve.

One more thing. Be logical about how you decide, but don't forget how your customers decide. Trust is partly a feeling, and the 50-millisecond study shows how fast it forms. Your design should look trustworthy and then get out of the way.

How can I test my own website?

You don't need special tools for the first test.

Ask three to five people who don't know your business to open your site on their phone.
Ask them to find one thing a visitor would come for: your price, your services, your contact form, or your booking button.
Time it with a stopwatch. Watch quietly and don't help.

Three-step website test: ask 3 to 5 people, give them one task, and time it without helping

If they struggle, your design is in the way. Many visitors leave within 10 to 20 seconds, so I use that as a rough yardstick. That yardstick is my own rule of thumb, not a rule from the study.

Then run your homepage through Google PageSpeed Insights, a free tool, to check how fast it loads on mobile.

Frequently asked questions

Do fancy website animations hurt conversions?

They can, when they make a visitor wait for what they came for. That might be a slow page, or a scroll video that plays before the visitor reaches what they came for, like an answer, a service, or a product to buy. They don't have to. I did not find a study showing that animation lowers sales on its own, so test your own site.

Is a video playing the same as a page loading?

Not exactly. A video gives visitors something to look at, and a blank page doesn't. But the visitor's wait ends when they can do what they came to do. If the video doesn't show a clear next step, the visitor is still waiting.

Does a hidden or late main button hurt a website?

In one Nielsen Norman Group study with 179 people, hidden navigation was used less and tasks took longer. That study looked at hidden menu icons, so it is close to the late-button problem but not the same.

Is a simple website better than a fancy one?

A simple page with a clear answer often serves a visitor better than a fancy page that makes them search. But simple is not automatically better. A plain page that looks careless can hurt trust. Aim for clear and trustworthy.

Should I choose a website design based on how it looks?

Looks matter for first impressions, but the choice should come from what the design does for visitors: buyers, sign ups, or bookings.

What is a scroll video?

A scroll video is a video that plays only as the visitor scrolls. The visitor has to keep scrolling to move the story forward, so it is not a fixed video in one section that they can easily skip.

What is parallax scrolling?

Parallax scrolling is an effect where the background moves at a different speed than the content as you scroll, which creates a feeling of depth.

What's the last website that made you leave, and why?

I'm curious. Was it slow loading, a confusing menu, or an animation that got in the way? Tell me in the comments on my LinkedIn post. https://lnkd.in/p/epKtdTHi

If you want an honest second opinion on your own website, you can reach me here.

About the author: I’m Ali Mourchid, and I build websites for businesses. Before I approve any design, I always ask one question: what do my client’s visitors come to this website to do?

For one business it’s a booking. For another it’s a price, an answer, or a product to buy. Whatever it is, I make sure visitors can do it fast, and I only add fancy design and motion when they help.

I write articles like this to share what I’ve learned, and I hope it helps you whether or not we ever work together. If you need a solution for your own website, just ask me.