Pirate Barber
LiveA single-page web-design and local-SEO build for a Cache Valley client
Built by Caden Sorenson · Launched April 2026
The project
Pirate Barber is a client in the Cache Valley area of Utah. When the project started, the business existed as an Instagram handle and nothing else. The brief was the core job of a local small-business site: make it obvious what the business is, when it’s open, and how to reach it, fast and mobile-first, with clean structured data so it can rank for nearby searches.
The build
A single page, built on Astro and Tailwind. The 2026 rebuild moved it off the original three hand-written files and expanded it past the first three sections, but the shape of the work stayed the same. Get the business data into one place, then let it drive both the page and the schema.
Key technical decisions:
- Single source of truth for business data. One data structure holds the details, and both the visible markup and the JSON-LD render from it. The page and the structured data can’t drift apart, and there is exactly one place to edit.
- Zero JavaScript bundles. The nav and the FAQ are native
detailselements, so both open and close with no script, and the page is fully usable with JavaScript off. What’s left is two small inline snippets, one to close the menu on Escape or an outside tap and one to highlight today’s row in the hours table. - Structured data for local search. A BarberShop schema block with real hours, a priced offer catalog, and the towns served, built from the same data as the visible page.
- Native, accessible interactions. Handing the open state, keyboard handling, and accessibility semantics to
details/summaryreplaced the hand-written mobile-nav JavaScript the first version shipped.
Design
The identity is the barber pole, unrolled. A striped helix in red, bone, and dark teal runs the full width above the nav and along the bottom of the footer, climbing slowly on a loop and holding still for anyone who asks for reduced motion. Everything else stays flat and quiet so that one element carries the theme.
The palette is a deep teal-navy (#0c1b22) rather than the near-black of the first version, with warm bone text (#f0eadd), brass for anything actionable (#c9922e), and the pole’s red (#c4392c) held back as a flash. Type is Big Shoulders Display, a tall condensed poster face, over IBM Plex Sans, with IBM Plex Mono handling the small caps labels and figures like a ledger.
Build log: how I built it with Claude, and what the rebuild changed.
Frequently Asked Questions
- Yes. Pirate Barber is an example of Vient's client work. Vient builds fast, custom websites for small businesses around Cache Valley, Utah, including Logan, Smithfield, and the surrounding towns. The contact page is the fastest way to start a project.
- As a single-page Astro site styled with Tailwind, shipping zero JavaScript bundles. The mobile menu and the FAQ accordion are native details and summary elements, so the page works with JavaScript switched off entirely. The design tokens live in one Tailwind theme block: a #0c1b22 teal-navy base, brass #c9922e, and a #c4392c red used only in the animated barber-pole stripe.
Does Vient build websites for small businesses in Cache Valley?
How was the website built?
More about Pirate Barber
- Behind the buildBuilding a Single-Page Client Site, Mostly by Prompting ClaudeA local client had an Instagram and no website. I gave Claude the right prompt, all the real details, and a styling direction, and it built the three files. The hard part was getting the content, not the code.
- From the blogBuilding a Local-SEO Site for an Age-Restricted Shop, in Code This TimeI tried an AI website builder on one client site and ended up rebuilding it in code. So this one I built in Astro with Claude from the first commit. Here's what it takes to build a clean local-SEO site for an age-restricted retailer.
- From the blogBuilding a Client Site in Three Files, No FrameworkA long-running local business had gone four decades without a website. Here's how I built one from scratch in three files of vanilla HTML, CSS, and JS, then redesigned it around how the business actually works.
- From the blogDoes a small business in Cache Valley actually need SEO?An honest look at whether local SEO is worth it for a small business in Logan or Cache Valley, Utah, what it costs, what actually moves rankings, and a checkup you can run yourself.
Related projects
- Related projectDiamond Pest ProA web design case study: how Vient built a fast, custom Astro 5 static site for a multi-location home-service client, with a dedicated page for every branch and every service, LocalBusiness and FAQPage schema, and an ongoing local-SEO engagement.
- Related projectDill the MenaceA web design case study: how Vient built a fast, custom Astro 5 site for a Cache Valley client, with a single source of truth for business data, local and FAQ schema, a lazy-loaded audio embed, and a static deploy.
- Related projectCub River KratomA web design case study: how Vient built a fast, custom Astro 5 website for a Cache Valley retail client, with a single source of truth for business data, local and FAQ schema, programmatic nearby-city landing pages, and a static deploy.