Constructions Havreau
A complete marketing site for a company that doesn't exist.
A concept project: a marketing site for a residential construction and renovation company. Built end to end — identity, content, bilingualism, quote requests, accessibility, performance — to show what I deliver to a local small business.
Why an invented company
The question I get most often is a simple one: “do you have an example of a site you could build for my business?” Answering it with a client's site requires having a client, and a first client requires answering the question. Constructions Havreau breaks that loop.
The company is fictional; none of the work is. The site is built, deployed and verified exactly like a paid engagement: five real pages, a form that genuinely validates, two complete languages, and a demo running on the same infrastructure as this site.
The hard constraint was honesty. A credible marketing site leans on years in business, figures and testimonials — exactly what an invented company cannot have. So the fiction is named at every point where it would be read as proof: sample figures, sample testimonials, sample project. Everything else stayed concrete, because that is what makes the demonstration worth looking at.
What a small-business customer looks at first
Someone looking for a contractor isn't looking for nice photos first — they're looking to rule out the risk of being taken. The page order follows that. Verifiable markers come before the services, the way a job runs comes before the portfolio, and the free site visit is offered wherever a hand might hesitate.
The copy goes into the trade's detail — waterproofing membranes, slope to the drain, dedicated circuits, temporary shoring, continuous insulation. That's deliberate: “solutions tailored to your needs” proves nothing, while naming the hidden steps of a bathroom proves you know the work. On a real engagement, those sentences come out of an interview with the client.
The quote form asks for the city, the project type and a description — not ten fields. It validates as you go, points at the field at fault, and takes a screen reader to the error summary. On the demo it stores and transmits nothing, and says so.
The decisions that can be measured
No photo makes the page jump while it loads: every image reserves its exact space, and cumulative layout shift is zero on every page. Scroll reveals are written in CSS rather than JavaScript, which removes a client component from every page.
The form was first written with a validation library, then rewritten by hand: the schema cost 66 kB of JavaScript for five rules — more than the rest of the site combined. Photos are converted ahead of time into four widths chosen from the real display sizes, which halved the weight of the services page.
Contrast, touch-target size, heading order and the absence of horizontal overflow at 320 px are measured in a real browser, across the eight pages, on every pass. The site is deliberately excluded from all indexing through three independent channels: an invented company must never turn up in a search result.
Screenshots




What's inside
- Full visual identity: palette, typography, mark, component system
- Five pages and six project entries, bilingual, with translated URLs
- A validated quote form, with focus handling and messages tied to their fields
- Zero cumulative layout shift and under 400 kB to render on every page
- Contrast, touch targets and heading order measured in a real browser
- No indexing: a fictional company, flagged on every page
- A dedicated share image per language, for sending the link straight to a prospect
