Animated websites look impressive in design portfolios. The hero fades in, the text slides up from the bottom, a parallax effect shifts the background at a different rate from the foreground. On a fast MacBook with a retina display and a fibre connection, it all feels polished and intentional.

Your client's customers are not on a fast MacBook. They are on a three-year-old Android phone, sitting on a couch, using a 4G connection that drops to 3G the moment they walk to the kitchen. And they have no patience for a website that takes four seconds to show them whether you do house cleaning in their suburb.

What animations actually cost you

Loading time. A hero animation that requires a JavaScript library to run adds weight to every page load. On a fast connection you will not notice. On a mid-range phone with a weak signal, it is the reason someone hits the back button before they even see your headline. The animation that was supposed to impress them prevented them from reaching the page at all.

Motion discomfort. A meaningful percentage of people experience discomfort from parallax scrolling, continuous motion, and elements that arrive from unexpected directions. The Web Content Accessibility Guidelines recommend providing a reduced-motion option for users who need it. Most animated sites do not. You are not just slowing down your site. You are actively making it unpleasant for a portion of your visitors.

Battery and CPU drain. Continuous animations keep the GPU busy. On a phone already running warm, your website becomes the reason someone puts their phone in their pocket and forgets to come back. The session ends not because your offer was wrong, but because your site was exhausting to load.

The device gap nobody talks about

When designers build websites, they work on fast machines with fast connections. That is simply the environment in which the work happens. It creates a blind spot that affects the entire industry.

The median mobile device in active use globally is three to four years old. A three-year-old mid-range Android handles clean HTML and CSS without breaking a sweat. It struggles with JavaScript-heavy scroll animations, lazy-loaded video backgrounds, and scroll-triggered effects that require constant layout recalculation as the user moves through the page.

There is a term for this in the industry: the portfolio effect. Work that looks spectacular on a designer's preview URL, on their device, on their connection, performs entirely differently in the wild. The gap between "looks great in Dribbble screenshots" and "works on a real customer's phone" is where most animation-heavy sites fall apart.

What the data actually says

Google's Core Web Vitals measure three things: loading speed, interactivity, and visual stability. Heavy animations hurt all three. A page that shifts its layout as elements animate into position scores poorly on Cumulative Layout Shift. A page that loads a JavaScript animation library before rendering content scores poorly on Largest Contentful Paint. Poor Core Web Vitals are a confirmed Google ranking signal. Animations that make your site look impressive can push it down in search results.

The conversion data from real A/B tests is consistent across industries: simpler pages load faster, and faster pages convert better. Walmart found that every one-second improvement in load time increased conversions by two percent. For a service business receiving 500 website visitors a month, two percent is not a rounding error. It is real bookings.

When animations actually help

Not every animation is a problem. Some serve a genuine purpose and should stay.

The animations that hurt are the ones that exist purely because they look impressive to other designers:

None of these communicate anything about the business. They make the designer's case study look interesting. They make the client's actual site slower, heavier, and harder to use on the devices most customers own.

Simple does not mean boring

This is the objection I hear most often. "Won't a simple site look cheap compared to the animated ones?"

No. A simple site looks cheap when the typography is poor, the spacing is inconsistent, and the color choices are random. A simple site looks professional when the hierarchy is clear, the font pairing is deliberate, the spacing is generous, and every element earns its place on the page.

Apple's website is simple. It uses white space, clean type, and a limited number of images. It does not feel cheap. It feels considered. It also sells products worth thousands of dollars to people who have never touched them in person. The restraint is part of the message.

The work of a good designer shows in the decisions about what to leave out. Anyone can add a parallax scroll effect. Knowing when not to is the skill that takes longer to develop.

The tradeoff for service businesses specifically

For a product business, a premium visual experience can be a genuine sales tool. If you are asking someone to spend $300 on headphones they cannot hold, the website has to do the sensory work the physical product would do in a store. Rich visuals, careful staging, and deliberate motion can all serve that goal.

For a service business, the logic does not transfer. Someone looking for a house cleaner in their area does not need to be wowed by your scroll animation. They need to quickly answer three questions: do you work in my suburb, roughly what is the cost, and how do I get in touch?

The conversion action is a phone call or a form submission. The website's job is to get out of the way and make that as straightforward as possible. A site that loads in 1.2 seconds and has a clear "Get a quote" button visible without scrolling will generate more bookings than a visually striking site that takes 4 seconds to fully render and buries the contact form inside an animated section midway down the page.

Fast is a feature. Clear is a feature. Anything that slows the page or adds visual noise works against the goal, regardless of how well it plays in a portfolio. Your customers are not judging your website. They are trying to solve a problem. The website that solves it quickest wins.

What I actually do when building for service businesses

When I build a site for a service business, I use a small set of CSS-only transitions. A fade-in on page load. A subtle border highlight when hovering over a button. Nothing that requires a library, nothing that fires continuously on scroll, nothing that needs JavaScript to control frame-by-frame.

The result loads under two seconds on a mid-range phone. It scores well on Core Web Vitals. It works on a three-year-old Android with a mediocre connection. And when someone lands on it looking to book, it gets out of their way immediately.

That is the goal. Not "impressive." Not "award-winning." Not "something I can post on Dribbble." A site that reliably turns the right visitors into paying customers, on whatever device they happen to be holding.

The simple version is the offer.