Five shapes, one practice
The right layout depends on how someone wants to be found. The first three are built on identical, real content (Harebell Counselling, the same reference practice used throughout this site), so the only variable is the shape of the page. The last two are full working demo builds with their own real content rather than a Harebell mockup, and each is a real, working site either way, not just a mockup.
Classic split-hero
Photo-led hero, stacked content bands, card-based credentials. Warm and approachable: closest to what most visitors expect, so it asks the least of a first-time visitor.
Suits: a practitioner who wants a visible face and a familiar, reassuring structure.
Ships as: practice-foundation, as-is.
Editorial
Asymmetric magazine grid, a running sidebar ledger, pull-quotes and rule lines instead of cards. More serif, more whitespace, more "written by a person."
Suits: a practitioner who writes (a blog, articles, a book) and wants the site to read like their own voice.
Ships as: practice-editorial (Amberlight), every page, not just the home page.
Quiet
A single centred column, sequential full-width sections, no cards, no shadows, no photo required. The calmest option by far.
Suits: a practitioner without a headshot yet, or one who wants the site itself to feel like the work: nothing competing for attention.
Ships as: practice-minimal (Fieldstone), every page, not just the home page.
Waypoint mosaic
A mosaic of bordered "waypoint" chips and unevenly-spanned tiles in place of a card grid, a divided list, or a sidebar. Cool pine-and-gorse on stone-grey paper, deliberately not the cream-and-terracotta combination most AI-generated therapy sites reach for.
Suits: a practitioner who wants a structure that reads as considered and specific, not assembled from a template.
Ships as: practice-thornmoor (Thornmoor Counselling), every page. Shown here as the live build itself, not a Harebell mockup.
Bottom-dock navigation
Primary navigation lives in a fixed dock at the bottom of the viewport, present at every breakpoint, not tucked behind a header. A field-guide register: warm stone paper, a contour-line indigo accent, monospace labels for data and index numbers.
Suits: a practitioner who wants navigation to stay within thumb's reach on a phone, not just a hamburger menu.
Ships as: practice-hollowbeck (Hollowbeck Counselling), every page. Shown here as the live build itself, not a Harebell mockup.
The standard, regardless of shape
Layouts A, B and C are lightweight HTML/CSS mockups, for choosing a structure early without running a build. Layouts D and E are the real, deployed sites themselves, since a mockup would only repeat what their own demo already shows. Either way, the structure itself isn't a mockup: all five shapes ship today as real Next.js sites where every page follows the chosen shape, carrying the same standard as the reference build: WCAG 2.2 AA, zero third-party requests, published fees, and the enquiry-form standard described on the Work page. Layout is a decision made once, not a different level of quality.