Houtos Labs · Web design servicesCustom design, measured
Web design & development servicesWe build the measured way.
Websites, web applications, and the five specialist practices behind them — engineered from first principles and graded before we start, graded again when we ship, on a rubric anyone can read. This page doesn't tell you we can build. It shows you, live.
100% in-house development · Oregon & California, USA · 25+ years building production systems
25+ yrsDesign & technologyCA & ORFounded in CaliforniaGlobalWho we design forIn-houseZero contractors
Performanceread ✓
Accessibilityread ✓
SEO & AEOread ✓
Securityread ✓
Trustread ✓
Reputationread ✓
The grading pass — illustrationReal readings: sample report
Scroll — the exhibits below are live, not screenshotsThe rubric is public: how we grade · the registry
01
The approach
Updated July 2026 · reviewed with every release
Houtos Labs is a web design studio that measures its work. We design and build custom websites, e-commerce stores, web apps, and redesigns — and every engagement is graded on the same public six-lens rubric before we start and after we ship, so you can see the improvement instead of taking our word for it.
Founded in California with 25+ years across design and technology, working in-house from California and Oregon for clients anywhere. Engagements start with a conversation and a reading — not a contract.
"Evaluation-led" is not a slogan; it's the order of operations. Before we design anything, we measure what exists — speed, accessibility, findability, security, trust — so the work aims at evidence instead of taste. While we build, every decision traces to a finding. When we ship, we re-grade and hand you the before-and-after in writing. If a number didn't move, you see that too.
And the standard is not private. The rubric is published, the sample reporting is public, and this page runs on the same system we ship to clients — which is why the demonstrations below are operable rather than decorative. We don't guess. We grade.
Graded before & afterPublic rubricPlain-language reporting100% in-house
No borrowed reels. No stock mockups.
The portfolio you're standing in.
Every technique on this page — the type, the motion, the theming, the accessibility, the way it holds together on your phone — is the product. Inspect it. Operate it. Grade it with our own instrument. That's the point.
02
Live demonstrations
Everything below runs on the same system and standards we ship to clients — you can test the quality yourself. Seven working exhibits, built by hand in this page: no libraries, no screenshots, no video.
Exhibit 01 · RedesignLive demo
The redesign, under your thumb
Two versions of the same imaginary storefront. Left: the site most businesses live with — cramped, shouting, three things fighting to be clicked. Right: the same content, disciplined — one hierarchy, one action, room to breathe. Drag the divider and watch the readings move.
C · beforeA · after
Performance74
Accessibility68
SEO & AEO69
Trust67
What this demonstrates: hierarchy, restraint, one primary action — the moves that turn browsing into buying. Wireframes and readings are an illustrative model, not client work or a live scan.
Exhibit 02 · The Measurement EngineLive demo
Break a website. Watch it get caught.
This is the heart of how we work, in miniature: a site starts healthy, you introduce the mistakes we see every week, and the instrument re-reads it instantly. Every fault you flip is one we design out of client work — and one The Grader flags in the wild.
Flip the faults. The lenses respond.
AComposite
95 / 100
Healthy. Every lens reads clean — this is the state we ship in.
Performance96
Accessibility94
SEO & AEO95
Security97
Trust93
Simplified demonstration model — five lenses, illustrative weights. The real rubric reads 26 metrics with Measured / Estimated provenance: the method.
Exhibit 03 · TypographyLive demo
Type that knows its job
One sentence, three voices. Display type sells, editorial type explains, mono type measures — a page works when each shows up in the right place.
Design is a reading, not a guess.
Satoshi 900 · display · −0.04em tracking
display
heading
body 16px
mono label
What this demonstrates: the Satoshi + IBM Plex Mono pairing this whole platform runs on — scale, weight, and tracking doing the hierarchy work.
Exhibit 04 · MotionLive demo
Motion with manners
Interface motion should orient, not perform. This choreography moves only transform and opacity — the two properties browsers animate without re-doing layout — staggered 60ms apart.
What this demonstrates: entrance choreography, tuned to be felt rather than noticed. With reduced-motion switched on, this exhibit deliberately doesn't move — that's part of the craft.
Exhibit 05 · ThemingLive demo
Two rooms, one system
Real theming isn't a color swap — it's a token system: every component reads named values, and the room decides what the names mean. Flip it.
Reservation
Same markup, same class names, same components — only the token values changed.
Token-true
What this demonstrates: the same discipline behind this site's theme toggle (top right — that one's live too).
Exhibit 06 · ResponsiveLive demo
Designed at every width
Layouts shouldn't survive small screens — they should be designed for them. This frame reflows by container width: squeeze it and watch three columns become two, then one.
What this demonstrates: container-query reflow — drag the frame's right edge on desktop, or use the width presets. No breakpoint hacks; the layout listens to its container.
Exhibit 07 · AccessibilityLive demo
Craft you can feel with a keyboard
Accessibility isn't a compliance chore bolted on at the end — it's design quality you can test right now. Press Tab and watch focus land deliberately; the contrast figures below are computed from this site's actual color tokens.
ink / paper 15.7:1accent / paper 5.75:1button text 6.44:1stage ink 17.53:1
What this demonstrates: visible focus, honest contrast, reduced-motion respect — the lens we grade every site on (the ADA/WCAG lens), practiced here first. All four ratios clear WCAG AA for their roles.
The exit gate
No build leaves without the reading.
Graded before · graded after · in writing — the same pass every exhibit above just made
The same rigor you just operated, pointed at five demanding domains. Each practice is its own instrument — with its own live demonstration on its own page.
Something that doesn't fit a room? General web, app, and platform work runs through the build studio — same standard, same gate.
04
How we work
One loop, in writing, every engagement — the same standard the exhibits above run on. Measured against the public six-lens rubric: Performance · Accessibility · SEO & AEO · Security · Trust · Reputation (how we grade).
Before · the baseline
Your site, read honestly
We measure what you have today and put the reading in plain English — what's strong, what's costing you customers, what's worth fixing first.
During · the build
Every decision tied to a signal
Layout, copy, code — each choice traces to a finding from the baseline, so effort lands where it moves the score.
After · the exit gate
The lift, in writing
We re-grade the finished work and hand you the before-and-after. If a number didn't move, you'll see that too.
1
The reading
We measure your current site (or your market) and talk through what it says.
2
The blueprint
Scope, timeline, and cost in writing — aimed at the findings, agreed before work begins.
3
Design & build
In-house design and engineering, with progress you can see and question.
4
The re-grade
The exit gate: before-and-after readings, side by side, in plain terms.
5
Ship & hold
Launch, then keep the numbers honest — quality that holds after the ribbon is cut.
05
Proof & the Registry
You won't find borrowed client logos or stock testimonials here. What we can show you is better: the instrument we're judged by, and work labeled exactly as it is.
The standing rule: an estimate is never dressed as a measurement, a concept is never dressed as a shipped product, and the rubric we grade clients with is the rubric we grade ourselves with. If that discipline is what you want applied to your website, we should talk.
Most agencies ask for trust. We hand you the instrument.
The rubric is public. The sample report is public. The grader points anywhere — including at us. Judge the work the way we do: by reading it.
You've been holding the instrument this whole time.
Every exhibit you just operated is how we'll work on yours. Point it at your business.
Designed · measured · graded · shipped — yours next
06
Start your project
Tell us what you're building and we'll come back with a reading, not a pitch — what we'd measure first, what we'd fix or design, and an honest sense of scope. A person replies; usually within a business day.
Want a diagnostic before we talk? The Grader is the tool our readings start with — run it free. Prefer plain email? hello@houtos.io works too.
Project intake
Open
07
Fair questions
Q1What do web design services include?
Web design services cover everything customer-facing about a website: layout and visual design, content structure and copy support, mobile responsiveness, accessibility, on-page SEO, and the build itself. At Houtos Labs the service also includes what most agencies leave out — a measured baseline of your current site before work starts and a re-grade when it ships, so the improvement is documented rather than claimed.
Q2How much do web design services cost at Houtos Labs?
Every project is scoped individually after a reading of your goals and, if you have one, your current site — cost follows scope, and we put the scope in writing before any commitment. We don't publish flat prices because a five-page marketing site and an e-commerce platform are different animals. The honest first step is free: run your site through The Grader and you'll see exactly what we'd be fixing and why.
Q3How long does a custom website take to design and build?
It depends on scope, and anyone who quotes a timeline before understanding the project is guessing. What we commit to: a written scope with a timeline attached before work begins, visible progress while we build, and a re-grade at the end that shows the result in measured terms. Simple sites move in weeks; platforms take longer — the scope document says which yours is.
Q4Do you redesign existing websites, or only build new ones?
Both. Redesigns are where evaluation-led design shows off: we grade the current site first, so the redesign starts from measured evidence of what's actually weak — speed, accessibility, findability, security, trust — instead of taste alone. When we finish, we grade it again and show you the lift in the same terms.
Q5What makes Houtos Labs different from other web design companies?
The instrument. Most agencies ask you to judge their work by a portfolio and a pitch. We publish the rubric we grade websites with, we grade our own work with it — before and after every build — and we label every number as measured or estimated. You don't have to take our word for the quality of the work; you can read it. (Choosing between firms? Our plain-language guide: how to choose a web design company — disclosure included: we are one.)
Q6Do I need to buy a report before commissioning design work?
No. The instant grade is free and always will be, and design engagements begin with a conversation, not a purchase. The $50 Deep Report is a separate product for owners who want the full written audit — useful, but never a requirement for working with the studio.
GRADED
Commission design you can hold to a number.
The intake takes two minutes; the reply is a reading, not a pitch. And if all you do today is grade your current site, that's a good day's work too.
100% in-house development · Oregon & California, USA · 25+ years building production systems
development-led brief instead? the build studio · for the curious: the hidden lab · questions? hello@houtos.io