Two builds, and what they had to solve

Three businesses that looked unrelated, rebuilt into one structure that makes them look inevitable.

Client

Heritage Hands

Where

The Thumb and North East Michigan

Sector

Property management, event planning, dental consulting

Build

Hand written HTML, CSS and JS, PHP 8.5 for the contact form, Apache

Status

Complete, replacing a Wix site, held for attorney review and client content

The problem

Heritage Hands started with home repair and grew, the way real businesses grow, into whatever the property or the weekend or the practice actually needed. By the time we saw it that was three divisions: property and rental management, event planning, and dental practice consulting. On the old Wix site those three read as one person trying anything. The site also could not be fixed from the inside: no control over response headers, so no content security policy and no HSTS, old hashbang URLs that no server can ever redirect, and page weight spent on the platform rather than on the work.

What we built

Ten pages on one idea. Heritage Hands is hired to be responsible for an asset its owner cannot personally watch: someone else’s building, someone else’s front desk, someone else’s lake house. One job, three asset classes. So the brand is drawn as a single grey load bearing rail that runs down the page and, at one exact moment on the hub, splits into three coloured rails. From there on the colour of the rail is the answer to “where am I.”

Under that: self hosted variable fonts (Bricolage Grotesque and Instrument Sans, no Google Fonts CDN, so no third party request on any page), motion written entirely in native CSS scroll driven animation with zero motion JavaScript, one PHP contact form carrying CSRF, a honeypot and per IP rate limiting, and a hardened .htaccess holding the CSP, the security headers and a redirect map for the old Wix URLs. Analytics is one GA4 property for the whole site with a division custom dimension, so the three divisions report separately without splitting the data into three properties that can never be compared.

The dental division is built, complete in structure, and deliberately dark: noindex, out of the sitemap, and marked with visible content required notes. Zero dental credentials exist yet and none were invented. Fabricating professional credentials in a healthcare adjacent field is the one thing a build like this must never do.

The result

• About 200 KiB on a cold first load per page, both fonts included, measured from the files rather than estimated.
• Zero third party requests. No CDN, no font host, no tag manager beyond GA4 itself.
• Every colour pair in the system was computed against WCAG 2.2 contrast rules, not eyeballed. White on the dark ground measures 15.7:1.
• Every old Wix URL has an explicit row: redirected, or consciously retired. That map is the only part of a migration that cannot be recovered after the fact.
• Status today: finished, and waiting on two things that are not ours to sign, an attorney’s review of the legal pages and the client’s own photography and licence details. We do not cut over a domain until both land.

• Static HTML
• PHP 8.5
• Multi division IA
• CSS scroll driven motion
• Wix migration
• GA4 Consent Mode v2

A gym that has not opened yet, with a site that already sounds like it has a standard.

Client

Iron Valor Barbell

Where

Reynoldsburg, Ohio

Sector

Powerlifting and strength training gym

Build

Nine pages, hand written HTML, CSS and JS, PHP 8.4 for the contact form

Status

Complete, waiting on opening day facts and real gym photography

The problem

A new powerlifting gym, a logo, an address, and nothing else. No site, no domain, no phone number yet. The easy version of this site is the one every gym has: condensed athletic type, red on black, and stock photos of somebody else’s rack row. The harder problem was honesty. Half the facts a gym site normally leads with (rates, hours, phone, equipment counts) did not exist yet, and a site that fills those in from imagination is a site that lies on the day it opens.

What we built

Nine pages: home, about, coaching, memberships, merch, contact, privacy, terms, and a real 404 rather than a dead end.

The palette is sampled from the client’s own logo, which measures roughly 70 percent neutral steel and 30 percent warm bronze and contains no red at all. So there is no red anywhere on the site. An earlier direction ran on an invented coral found nowhere in the brand, and it was scrapped for exactly that reason. Type is Clash Display, Satoshi and IBM Plex Mono, all self hosted, and every weight used exists as a real font file rather than a browser synthesised fake. Condensed athletic type was rejected on purpose: it is the default every gym reaches for.

Missing facts are shown as missing, on the page, in the client’s own voice. The membership flight sheet reads POSTS AT OPENING. Opening hours are omitted from the schema rather than guessed. There are no telephone links anywhere, because there is no number yet. The equipment section says the inventory is being certified.

Under that: native CSS scroll driven motion only, images served as AVIF and WebP with JPEG fallbacks at two widths, a PHP contact form with CSRF, honeypot and per IP rate limiting, no database by design, and GA4 with Consent Mode v2 wired complete and dormant until this site’s own Measurement ID replaces the placeholder at launch.

The result

• Nine pages, eight of them in the sitemap, all standards complete as built.
• No red, no condensed type, no stock gym photography, no invented rates. Every one of those was a decision, and each one is visible on the page.
• Every font weight on the site maps to a real font file. Nothing is synthesised.
• Bronze on the page ground measures 4.91:1, and a lighter bronze is used on raised surfaces where the plain bronze drops to 4.47:1. Both numbers were computed.
• Status today: finished, and waiting on opening day facts (domain, phone, hours, rates, founder bios) plus real gym photography. Every photograph currently on the build is a temporary stand in.

• Static HTML
• PHP 8.4
• Brand sampled palette
• Self hosted type
• CSS scroll driven motion
• AVIF and WebP