Skip to content
Up To Code
Free class · nothing to sign · drag the sliders

You can tell in five seconds.

Walk up to a job the last guy botched, the outlet crooked, the trim shy of the wall, and you know before anyone says a word.

A website is that first look, and your customer’s gut is quicker than yours. Researchers timed it: about fifty milliseconds, faster than a blink, to decide whether a site looks like it knows what it’s doing, before a single word gets read.

That snap read is wiring, not taste, and it’s been measured. Everything below lets you feel it for yourself. Break it, fix it, and watch what your own eye does. Then build the same into your own work.

Brand new and not sure where to start? The Field Manual sorts you in two minutes: /learn/start/.


01Make one thing loud

Contrast

Grab the slider. Watch the phone number sink into the truck door, then jump back out. That jump is the whole job of contrast.

reads as: unfinished

What just happened. Your eye finds the one thing that’s different in one way, brighter or bolder, before you even look for it. It’s the one red-handled driver in a drawer of black ones: instant. Ten black ones: you dig.

And the cleaner it reads, the more it gets trusted before a word is read; that part is measured, not our opinion. In 1995, researchers showed 252 people twenty-six versions of a bank-machine screen. The better-looking versions got rated easier to use, even though every one worked exactly the same.

They scored how tightly “looks good” and “seems easier to use” moved together: 0.589. On that scale, 0 means no connection at all and 1 means moving in lockstep, so that’s a strong pull from looks alone. Same machine, more trust. Here’s the actual study.

On your site: one thing is the loudest — your phone number. Everything else steps back so it can. Loud everywhere is loud nowhere.

See it live: open our pricing page or the work page — one bright thing per section, and your eye lands on it first. Same rule at work.


02Give the eye a foreman

Order

Same card, same words. Flip the switch and watch the eye lose its place.

Water heater out? Same-day in the metro. We pull the permit. Call (555) 018-4420 Licensed and bonded. Twenty years on these streets. We show up when we say, clean up before we leave, and the price we quote is the price you pay.
the eye lands here → the headline

What just happened. With sizes and weights doing their job, the eye starts big and walks down — headline, then the offer, then the number. Flatten everything to the same size and it’s a job site with no foreman: everybody standing around, nobody knows where to start.

On your site: biggest thing = the one thing you want read first. Then the next. If it’s all the same size, you chose nothing for them, so they choose to leave.

See it live: open our pricing page. The price is the biggest thing on it, then what’s in it, then the fine print — your eye walks straight down.


03Plain isn’t dumb. It’s honest.

The wall

Same exact words, two ways. Read the first one. Then throw the switch and read it again.

Our comprehensive service methodology leverages industry-leading best practices to deliver seamless, end-to-end solutions that are meticulously engineered to exceed expectations while ensuring your complete satisfaction throughout the entirety of the customer journey from initial consultation through final walkthrough and beyond.

40 words · one sentence · a wall

What just happened. A wall of long, fancy sentences makes the brain work, and worked-for reading gets discounted. A researcher named Oppenheimer tested the words themselves: the fancier the vocabulary got, the less intelligent readers judged the writer, every time.

He gave the paper a title that’s a joke about itself: “Consequences of erudite vernacular utilized irrespective of necessity.” Translation: using long words needlessly backfires. You’ve lived this one: the fine print you signed without reading was built as a wall on purpose. Plain and short is how someone with nothing to hide talks.

On your site: say what you do like you’d say it to a neighbor. Short lines. Real words. If it sounds like a brochure, tear it up.

See it live: read any page in our Field Manual. Short lines, plain words, the way you’d tell a neighbor — no brochure talk in the whole thing.


04Cut to length

The measure

Text gets cut to length like anything else. Drag the column wider and narrower and feel where reading stops being work.

Researchers timed people reading on screens. Lines around fifty-five characters were read comfortably and understood best. Longer than that, and the eye loses its place on the long trip back to the start of the next line. Shorter, and reading turns into stutter steps.

≈ 105 characters — too long

What just happened. A line of text is a round trip: the eye reads out to the end, carries back, and has to land on the right next line. Between roughly 50 and 75 characters, that trip is automatic. Researchers clocked it: lines around 55 characters got understood best on screens.

Sentences have a cut length too. A web-reading study measured comprehension highest, and mental effort lowest, between sixteen and twenty words a sentence. The wall you read one station back? One sentence, forty words.

On your site: keep text columns narrower than feels natural — 50 to 75 letters wide, about what a phone gives you anyway. And when a sentence runs past twenty words, cut it in two. Both upgrades are free.

See it live: every page in the Field Manual holds its lines to that readable width — go open one. The 50-to-75 rule, already set.


05Built by hand, never bought off a template rack

Drawn in code

Most sites are a template with your name dropped in, same bones as every other template on the block. Ours are built by hand, in code, and the whole build is laid out step by step. Here’s our own mark being drawn from the exact lines that make it.

<svg viewBox="0 0 32 32" stroke-width="3.4">
  <path d="M4 14 L16 4 L28 14"/>   // the roof: a bracket ^
  <path d="M9 20 H23"/>            // the equals sign =
  <path d="M9 26 H23"/>            //   two strokes, one sign
</svg>

The mark, honest. An angle bracket for a roof, an equals sign for the walls, and it reads as a house. A bracket is code. An equals sign means level — it checks out. A house built from the same characters the site is written in. That’s the whole story. No hidden meaning, no legend.

Its job is what earns its keep, not the story. It still reads at 16 pixels, the size of a browser-tab icon. It prints in one color. And it’s nothing you’ll hate in five years. Watch.

16 px · still reads
one color of ink · still works light-on-dark
drag me level

On your site: a logo earns its keep by working, not by meaning something. Readable small, printed in one color, still right in five years. If yours passes, keep it and spend the money on real photos.

See it live: open our work page and load one of the three real businesses on your phone — built by hand, not rented — and the process page walks the whole build ticket by ticket.


06Your handwriting, chosen once

The letters

Type is handwriting you get to pick at your best and keep forever. Drag it — that’s the real font bending on your screen, not a video.

RIVERA & SONS

weight 800

On your site: one typeface, everywhere — the invoice, the card, the yard sign, the site. Same letters every time. Matching beats fancy, and free fonts are fine.

See it live: the pricing page and the work page are set in one typeface, top to bottom. The rule, kept.


That’s the class

Five things the gut decides first

  • Contrast. One thing loud, found before they look.
  • Order. Biggest first, so the eye knows where to start.
  • Plain words, cut to length. Short sentences, narrow columns — reads as honest.
  • Built, not rented. Custom reads as a pro; a template reads as everyone.
  • One set of letters. Same handwriting, every time.

The first three are lab findings; the studies are right below. The last two are our craft rules, and we put our name on those.

All five are load-bearing. Together they’re the difference between a stranger trusting you at a glance or clicking away, decided faster than a blink. That’s what we build on every job, and every price is printed on the pricing page.

The studies behind this class, so you can check us — checking is the whole idea:

The class is free. So is everything else we know.