There's a new sample site in the portfolio today — a full demo build for a fictional metalworking/locksmithing business, "Schlosserei Langenfeld-Mark." What's actually worth writing about isn't the site itself, though; it's what got deleted before it was allowed to go live.
How it started
The first draft of this demo wasn't fictional at all. It started as real research — an actual metalworking business (a real address, real phone numbers, an owner's real name and photo, real Google Street View captures, a real finished-work photo pulled off a Google Maps listing) gathered entirely from public directories, a partner company's reference page, and Google Maps itself. None of it was private data, and none of it was obtained through anything other than normal public search — but all of it was real, identifiable information about a real person and a real business who never asked to be turned into a portfolio demo.
That's fine as research. It's not fine as something published under my own domain with that person's actual name and phone number sitting in the page source. So before this went anywhere public, the whole thing got taken apart and rebuilt fictional.
What got deleted
Everything that could point back to the real business, gone — not blurred, not renamed-but-still-findable, actually removed:
- The real street address, landline, fax number, and mobile number.
- The real owner's name and his actual portrait photograph.
- Every real Street View capture of the workshop — the wide exterior shot, the gate-level entrance shot, the sign close-up, and a second angle pulled from the Google Maps listing itself.
- The one real finished-work photo (a stainless-steel-and-glass balcony railing) that had been sourced from that Google Maps listing.
- The real GPS coordinates.
- The entire research dossier behind all of it — the
information/folder with its sourced notes and every raw source photo, plus the planning documents (BRIEF.md,PLAN.md,CONTENT_INVENTORY.md,PHOTO_INVENTORY.md,OPEN_QUESTIONS.md) that referenced the real business by name throughout.
If you grep the shipped folder for the real business's name, street, or phone numbers, you won't find them. That was the actual bar, not "looks anonymized."
What replaced it
Every one of those had to be replaced with something that still makes the site feel like a complete, real business — just a fictional one:
- A fully fictional company, owner, and address: "Schlosserei Langenfeld-Mark GmbH," Geschäftsführer Jonas Langenfeld, a made-up street in a made-up town.
- Fictional-but-plausible legal details on the Impressum — Handelsregister number, VAT ID, Handwerkskammer entry, trade qualification — internally consistent, none of it real.
- One real photograph left on the whole site: an AI-generated, public-domain face (a StyleGAN2 image from Wikimedia Commons) standing in as the "owner portrait" — a person who doesn't exist, licensed explicitly for this, credited in
CREDITS.md. - Every other "project photo" slot replaced with a hand-drawn SVG illustration instead of a real photograph — balconies, staircases, gates, delivery scenes, all original line art, not stock photography.
- The map pin on the contact page now deliberately points at a church in Honolulu — not a plausible-looking fake German address that someone might mistake for real, but an obviously-wrong placeholder.
- The canonical domain everywhere is
schlosserei-langenfeld-mark.example— the reserved.exampleTLD that's guaranteed not to resolve to anything.
Marking it honestly as a demo, not just hoping people notice
A banner reading "Beispiel-Website — frei erfundenes Muster zu Demonstrationszwecken" sits at the top of every single page, plus a matching notice in the footer. Every page carries <meta name="robots" content="noindex">, and /sample-sites/ is disallowed in robots.txt sitewide — this isn't meant to rank in search or get indexed as a real business, ever.
And where something is genuinely still open rather than faked-complete, it's marked [TBD] instead of quietly papered over — the EU-Streitschlichtung readiness line on the Impressum, and the contact form's backend (it's a real, working form markup with action="#", since a static demo has nowhere to actually send it).
Getting it to actually work under its real URL
The one piece of this that was my own work rather than the anonymization pass: the site had been built assuming it would live at a domain's root, so every internal link and asset reference used a root-relative path — href="/assets/css/style.css", href="/leistungen/", and so on. That's the right call for a real deployment, but it meant the site broke the moment it actually landed one level down, at /sample-sites/Schlosserei-anonym/ — the browser went looking for /assets/... at the domain root and found nothing.
Fixed by rewriting every href, src, and srcset across all eleven pages into a path relative to that page's own depth — ./assets/... at the root, ../assets/... one folder down, ../../assets/... two folders down inside /leistungen/balkone/ and its siblings. Then verified it properly: stood up a local server rooted at this site's actual folder structure, hit every page and every asset at the real /sample-sites/Schlosserei-anonym/... path, and confirmed every single one comes back 200 — CSS, icons, fonts, the responsive portrait srcset, all of it.
What's still genuinely a real feature under all that fiction
Underneath the fictional name, the build itself is not a throwaway — it kept everything worth keeping from the original:
- A two-style switcher ("Stil 1 / Stil 2") on every page, both driven by the same CSS custom properties so no component's markup differs between them — just a
localStorage-backed toggle. - Zero JavaScript dependency for anything that matters: the nav degrades to a plain always-visible list, the mobile bar is CSS-only, and the style switcher just stays on Stil 1 without JS.
- Every page validated clean through the W3C Nu validator, and every text/background color pairing checked against the actual WCAG relative-luminance formula, not eyeballed.
- Self-hosted fonts with no runtime request to Google Fonts.
None of that needed to survive the anonymization pass. It did, because scrubbing out the real business's information was the whole point of the exercise — not an excuse to cut corners on everything else.
Have a look at the finished demo — and if you're weighing whether your own business's site should exist, I'd like to hear about it.