# Who Fell Off the Ladder? — narration script

Runtime 6:13. Timecodes are when each chapter starts; the film's animation is keyed to these cue times, so a recorded voice-over should keep each line near its timecode.

## 0:00 · Works on my machine

- `0:01` You built a store.
- `0:03` On your machine, it loads in under half a second. The build is green, the tests pass, and every page looks exactly the way you designed it.
- `0:12` It works. For you.

## 0:14 · Two stories, one second

- `0:15` Whenever someone opens a page, two stories run at the same time.
- `0:19` Yours is a pipeline: DNS, connection, TLS, request, response, parse, render, respond.
- `0:26` Theirs is a chain of questions they never ask out loud.
- `0:29` Is it there?
- `0:31` Did it arrive in time?
- `0:32` Can I perceive it, and operate it?
- `0:34` Can I read it?
- `0:36` Can I use it?
- `0:37` Do I want it?
- `0:39` Each question only gets asked if the one before it got a yes.
- `0:43` And the choices you make at every stage of your pipeline decide which of their questions get that yes.

## 0:50 · Eight visitors

- `0:50` So let's watch eight people open your store in the same second, and see how far up the ladder each of them gets.

## 0:58 · Rung 1 · Is it there?

- `1:00` Marcus is at work, and his office network blocks your scripts.
- `1:04` The HTML still arrives, but it's empty. The whole store lives inside a script.
- `1:09` And a trick that keeps the page hidden until the script finishes means he sees nothing at all.
- `1:15` For Marcus, your store isn't there.

## 1:18 · Rung 2 · Did it arrive in time?

- `1:20` Ana is on crowded hotel Wi-Fi.
- `1:23` Before your store can show her a single word, her phone has to download four megabytes of JavaScript.
- `1:29` She stares at a blank screen for thirty seconds, then closes the tab.
- `1:34` Your server answered. For Ana, the page was down.

## 1:38 · Rung 3 · Can I perceive and operate it?

- `1:40` Lucía is blind. Her screen reader doesn't read your pixels. It reads the accessibility tree that the browser builds from your markup.
- `1:49` Someone put aria-hidden on the navigation. For Lucía's screen reader, the menu doesn't exist, and neither does the way to the fleece.
- `1:58` Sam broke his wrist last week, so he's shopping with the keyboard.
- `2:02` Your Add to cart button is a div with a click handler. Tab skips right past it. For Sam, the button doesn't exist either.

## 2:11 · Rung 4 · Can I read it?

- `2:13` Kenji, in Osaka, has his browser translate your page into Japanese. Almost everything comes through.
- `2:20` But your shipping terms are text inside an image, and a translator can't read pixels.
- `2:25` He can't tell whether the fleece ships to Japan, so he doesn't risk it.

## 2:30 · Rung 5 · Can I use it?

- `2:32` Dani has a toddler on one hip and one thumb free.
- `2:35` Your checkout asks her to “Initiate procurement,” then to “Finalize fulfillment parameters.”
- `2:41` She leaves out one digit of her ZIP code. The form says “Error in form,” and clears every field she filled in.
- `2:48` No automated scanner would flag this checkout. Every control is real and labeled. Dani still can't buy the fleece.

## 2:57 · Rung 6 · Do I want it?

- `2:59` Omar makes it to the top rung.
- `3:01` A countdown says the deal ends in 4 minutes, 59 seconds. A protection plan he never asked for is already checked.
- `3:09` He buys the fleece anyway. A week later, the same deal is still ending in 4 minutes, 59 seconds.
- `3:16` He won't be back. Your analytics recorded him as a success.

## 3:21 · Who made it

- `3:22` One visitor climbed all the way up without a problem.
- `3:26` Fast connection. New laptop. Perfect eyesight. Steady hands. Reads English. Doesn't mind a countdown.
- `3:33` They look familiar. Almost nobody else is that user.

## 3:37 · The dashboard

- `3:38` Now check your dashboard. Zero JavaScript errors. Pages load in under a second. Two sales.
- `3:45` Marcus and Ana never ran the scripts that would have counted them.
- `3:49` Lucía, Sam, Kenji, and Dani show up as exits, with no reason attached. A hidden menu, a clickable div, a picture of words, and a confusing form never throw an error.
- `4:00` The ladder fails silently, and upward. The people who fell are missing from the very numbers you'd use to decide what to fix.

## 4:09 · The canyon

- `4:11` That gap, between how your site works for you and how it works for everyone else, is a canyon.
- `4:16` An empty HTML shell, a four-megabyte bundle, a button built from a div: each one is a choice made for the builder's comfort, and each one fails people on rungs the builder never tests.

## 4:30 · Rewind: built with the grain

- `4:32` Now rewind. Same store, same eight people, built with the grain of the platform instead of against it.
- `4:39` The content is in the HTML, and the script only enhances it.
- `4:44` The page weighs kilobytes, not megabytes.
- `4:47` The navigation isn't hidden anymore. The button is a button.
- `4:51` The shipping terms are real text, so the translator can reach them.
- `4:56` The labels say what they do, and a typo costs one field, not all of them.
- `5:01` The sale has a real end date, and the extras start unchecked.
- `5:05` None of this cost more to build. Most of it is what the platform does by default, as long as we don't break it.
- `5:13` Lucía reached your store, heard it, read it in Spanish, and bought the fleece. She has one question left. Will she come back?

## 5:21 · How would we know?

- `5:22` Even when you build it right, you don't own the whole trip.
- `5:25` Registrars, certificate authorities, CDNs, networks, browsers, extensions, and translators all touch your page before a person does. Somewhere, for someone, today, one of your rungs is failing.
- `5:39` So wrap the ladder in measurement: uptime probes, field performance from real visits, testing with assistive technology, funnels, and whether people come back.
- `5:49` The difference between a professional and a hobbyist isn't that the professional's pages never break. It's that the professional finds out.

## 5:58 · Every choice lands on a person

- `5:59` Every technical choice you make lands on a person.
- `6:02` In this series, we'll climb the ladder one rung at a time, and see which of your choices hold each rung up.