Do scroll animations and 3D hurt SEO and page speed?

What actually hurts rankings, the animation or the page?

The page. Google's own page on Core Web Vitals does not call them a direct ranking factor and does not say how they weigh against relevance. It does say it highly recommends good vitals for success in Search, and that they align with what its core ranking systems seek to reward¹. Animation is not mentioned. Slow loading, laggy response and jumping layouts are.

A scroll film or a 3D scene is heavy by nature: video or image sequences, script, sometimes WebGL. That weight decides whether the first screen paints inside the 2.5 second target⁴. web.dev's guidance for the biggest first-screen element is specific. It should be discoverable in the initial HTML, and it should never be lazy-loaded⁷. A hero that waits for a script to fetch its video before showing anything fails both.

Pass rates show how often this goes wrong. Only 62 percent of mobile sites had a good LCP in 2025, against 74 percent on desktop³. Phones are where an animated site is won or lost.

Will Google read text that appears as I scroll?

Yes, if the text is in the page's HTML when it renders. Google crawls a page, queues it for rendering in headless Chromium, then indexes the rendered HTML². Words that reveal on scroll are fine when the animation only moves text that is already in the markup.

The risk is text that never becomes HTML. Words baked into a video frame or drawn onto a canvas are not part of the rendered HTML. Google also says it will not render JavaScript from files or pages that robots.txt blocks, and it finds links only when they are anchor elements with an href². So do not block your script files, and keep navigation as real links.

How do I keep a scroll site fast on a phone?

Start with how the scrolling is driven. Scroll handlers written in JavaScript run on the main thread and often cause jank. CSS scroll-driven animations are declarative and can run off the main thread. They are supported in Chrome 115 and Safari 26, with Firefox in preview⁵. Tokopedia, an e-commerce company, reported that average CPU use while scrolling fell from 50 percent to 2 percent after it moved over⁵.

Speed is also money. In a 2019 study of 37 European and American brand sites, a 0.1 second mobile improvement raised conversion by 8.4 percent for retail and 10.1 percent for travel⁶.

Test where your buyers are. The vitals are judged at the 75th percentile of real page loads, split by mobile and desktop⁴, so a fast result on a studio laptop proves little. Ask for results from a real iPhone and a mid-range Android phone.

What about people who get dizzy from motion?

They need a version without it. web.dev describes the prefers-reduced-motion setting, which detects that a visitor has asked their operating system to minimise motion. It notes that parallax can cause dizziness, nausea and migraine headaches, and that animations driven by JavaScript need their own listener for the setting⁸.

There is a standards angle too. WCAG success criterion 2.3.3 is Level AAA and says motion triggered by interaction can be disabled unless it is essential. It names parallax scrolling as a common non-essential animation⁹. Criterion 2.2.2 is Level A: moving content that starts automatically, lasts more than five seconds and sits beside other content needs a way to pause, stop or hide it¹⁰.

What should I ask a studio before I sign?

Five requests cover most of the risk:

• Largest Contentful Paint, Interaction to Next Paint and layout shift results from a real phone, against the 2.5 second, 200 millisecond and 0.1 targets⁴.
• A statement of what loads first and what loads later, including how the first-screen image or video is fetched⁷.
• Proof that every heading and paragraph is in the rendered HTML².
• A demo with motion switched off in the device settings, and the page used with a keyboard⁸.
• The robots.txt file, to confirm script files are not blocked².