Barber Club A website rebuild in the Cape Winelands

Someone looking for a barber is looking in one town, so each of the eleven shops has a page of its own: its address, its own opening hours, a map and directions. Each page is titled for its town and carries the structured data search engines use to place a shop locally.

• A finder that filters the shops by town, with a count beside each one
• A badge on every shop that works out whether it is open right now, in South African time
• Classic and Premier side by side behind one toggle, with the real published prices
• Group packages given a page of their own

The landing carries a 3D pair of scissors, and it never enters first paint. The 3D code, three.js with React Three Fiber, sits in a chunk of its own, 229 KB gzipped. It loads only on desktop-class devices, only after the page has painted, and it is unmounted again once it scrolls out of view. Phones get a still image in its place. Slow connections and data-saver get no scissors at all, and visitors who ask for reduced motion get the still.

Both figures were measured on the deployed preview on 21 September 2026: the home page ships 268 KB of JavaScript, gzipped, and the 3D chunk is not in it. Every page is prerendered as static HTML.

No star ratings, reviews or barber profiles are shown, or marked up for search engines, until they can be verified. Where a detail about a shop is not confirmed, the page says so in place rather than guessing.

• A skip link, visible focus on every control, and a lightbox that holds focus and hands it back
• A pinned scroll sequence that is not rendered at all for visitors who ask for reduced motion
• Brass text that holds at least 5.25:1 against the dark ground