Did you forget something at home?

What I do

Scroll
jacking
Done Right

Websites built by hand, from a blank file — and the site you're on right now is the pitch. It scrolljacks, and scrolljacking has earned a genuinely bad reputation: sites that take your scroll away and give nothing back. This one hands the controls back — how it moves is your choice, not mine. Keep scrolling — this page is how I fixed it.

The approach

Your scroll.
Your rules.

The bad reputation

ScrollHijacking.

Scrolljacking — or scroll hijacking — is when a website overrides your native scroll and decides for itself what happens next. Usability researchers have condemned it for years, and about the usual version they're right: motion you can't predict, a back button that stops working, keyboard users locked out, and animation forced on people who explicitly turned it off.

Most scrolljacked sites break the web to look clever. The look was never the problem — the breakage is, and every bit of it is optional. The full guide to scrolljacking lays out the risks and the six rules that avoid them.

Four controls a scrolljacked site takes away Four crossed-out panels: the back button stops working, the keyboard is locked out, scroll speed is overridden, and motion settings are forced back on. BACK BUTTON stops working KEYBOARD locked out SCROLL SPEED overridden MOTION SETTINGS forced back on

The fix

Accessible Scrolljacking.

Every complaint about scrolljacking is really the same complaint: the site took controls you've trusted for twenty years and gave nothing back. Your scroll speed, your back button, your keyboard, your motion settings — all overridden because a designer wanted a moment.

So the fix isn't a lighter touch of the same trick — it's handing the controls back. Wheel, trackpad, touch and arrow keys all do exactly what you'd guess. Every screen is a real page with a real URL: the back button works, any view can be shared or bookmarked, and search engines index all of it. If your system asks for reduced motion, the site quietly stands down to a normal, scrolling website — and the selector in the corner offers you that same choice outright, no settings dig required. Accessibility isn't the fallback here — it's the design.

Four controls this site hands back Four ticked panels: the back button works again, the keyboard is fully mapped, scroll speed stays yours, and your motion settings are respected. BACK BUTTON works again KEYBOARD fully mapped SCROLL SPEED stays yours MOTION SETTINGS respected

How I do it

Use it appropriately, and give the user Options

Four ways to experience the site, each annotated FLOW STATE SLIDE DECK STANDARD REDUCED MOTION One scroll. The whole film. One screen per action. Coming soon. Ask about it → Motion earned on scroll. Turns almost everything off

Every action has the expected outcome — or a surprisingly better one.

The Engine

One animation. Real page loads.

The seamless part is the browser's own View Transitions API. Swapping sections runs a same-document transition; moving between pages runs a cross-document one with the exact same animation — so a page change is visually indistinguishable from a scroll, and the one continuous site you're riding is really seven separate URLs.

No SPA framework, no client-side router, no hydration. Separate, honest HTML pages that happen to feel like one continuous experience — and a browser without the API just loads pages instantly. Nothing breaks.

How view transitions work
Illustration on a blue-to-tan gradient: two white browser windows side by side — thebetterwebsite.com/web-development/ titled "Scrolljacking Done Right" and thebetterwebsite.com/portfolio/ titled "Themes, Built by Hand" — joined by a white arrow and a pill reading "View Transitions API, one motion", captioned "Two real pages. One seamless slide."

Speed

Kilobytes, not megabytes.

A hand-coded page ships only what it uses. No theme engine, no plugin queue, no render-blocking third parties — the fonts live on this domain, the animation runs in your browser's compositor, and the JavaScript fits in a few kilobytes.

Google measures how fast a page paints and how quickly it responds, and ranks accordingly — this is where the system quietly wins. Nothing loads that isn't doing a job, so there's nothing to wait for: under all the motion, this site scores like a static page, because that's what it is. That is what starting from an empty file buys — and it is why minimalist website design and speed keep turning out to be the same decision.

Why hand-coded
Illustration on a blue-to-tan gradient: a white card with a green ring gauge reading 95+ Performance, labeled "PageSpeed, mobile — this site, on a real phone connection", beside three white cards reading "A few kilobytes of JavaScript — no framework, no hydration, no jQuery", "0 third-party requests — fonts self-hosted, nothing render-blocking", and "Animation on the compositor — CSS the browser runs on its own thread", captioned "Nothing loads that isn't doing a job."

Security

Nothing to hack. Nothing to patch.

Most hacked websites are hacked through the software around them — a stale plugin, a CMS core that missed an update, a database login. A site built this way isn't sitting on any of that by default. There is no admin panel to brute-force, no plugin stack to keep patched, no database between a visitor and the page.

We host the site and look after it, and if you ever leave you take a copy of your files with you. That's not a ceiling: start from nothing, add only what a project actually needs, and it grows into a CMS, a database, whatever the job calls for. Most sites never need them — and every part you don't ship is a part that can't break.

Start a build
Illustration on a blue-to-tan gradient: a white card with a blue shield holding a green check mark, reading "Static files. Nothing running to break into — plain HTML, CSS & JavaScript", beside a white Attack Surface card listing five crossed-out entries — /wp-login.php, CMS core updates, 23 plugins to patch, SQL database, admin dashboard — each tagged "doesn't exist" or "not installed", captioned "No admin panel. No attack surface."

The Better Website SystemFAQs

What is scrolljacking?

Scrolljacking is when a site intercepts your scroll to drive its own animation — used here to make one continuous experience span real pages, while the page still scrolls the way you expect. The what-is-scrolljacking post explains it fully.

Is scrolljacking bad for SEO?

Not if it's built right — this site keeps real, crawlable URLs for every page, so scrolljacking only changes the transition, not what search engines index. See the scrolljacking & SEO post.

Is a scrolljacking site accessible?

Yes — full keyboard navigation, screen-reader-friendly markup, and a complete fallback to normal scrolling for reduced-motion users. See Is scrolljacking bad for accessibility? for the full answer.

What if I don't like the motion?

Turn on "reduce motion" in your OS or browser, or pick Reduced Motion from the "Choose your experience" menu in the site's navigation — either way the whole site switches to a normal scroll, same content, no animation.

Does every site you build scrolljack?

No — it's one motion option, not a house style. Some clients want it, most don't, and it's never used just to be flashy. The build fits the site's actual goals.

What's the View Transitions API got to do with it?

It's the browser feature that makes the effect work across real page loads, not just within one page. The view transitions post explains the mechanics.

That's the pitch

Now the
proof.

That's the whole method, and there isn't a secret second half — every site I ship is hand-written HTML, CSS and JavaScript, the same stack this page is built from. If you'd rather see it than read about it, here's what I've built and who builds it. The blog is where I show my work, the FAQ answers the five questions I always get, and the front door is still open. Run an architecture practice? That one is written for you. Want to talk about your site instead? Say hello. Or just keep scrolling — the work is next.

Adam Hoidahl The Better Website

The Better Website is a one-person web design studio in Raleigh, NC, serving the Triangle and clients nationwide. Adam Hoidahl hand-codes every site in plain HTML, CSS and JavaScript — not built on WordPress, a page builder or a CMS.