// 01
No framework, on purpose
Static HTML + Tailwind + a few hundred lines of vanilla JS. The marginal cost of each new program page is one HTML file and one entry in the nav — not a build pipeline.
AvailableTaking new engagements · Q2 2026
All workCase study · 02 · Sports facility
Train year-round.Play at your best.
Mark and Dawn Santone were opening Short Porch — an elite indoor baseball facility in Collingwood, Ontario — and needed a site that read as serious athletics from the first scroll. We built a fast, static, six-program academy site that loads in under a second and looks like college sports.
- Client
- Short Porch Baseball Academy
- Industry
- Sports · Training facility
- Year
- 2025
- Region
- Collingwood · Ontario · Canada
- 06
- Training programs
- <1s
- LCP target
- Indoor
- Year-round facility
- Static
- Stack — zero JS bloat
A glimpse of what we shipped
Live · shortporchbaseball.com
shortporchbaseball.com
⟳SPShort PorchBaseball Academy
BookTrain Year-Round.Play at Your Best.
Baseball training for dedicated athletes. Unlock your potential, master the fundamentals, and dominate the diamond.
View programsBook a lesson
✺ Our Programs06 disciplines · All ages
Program
Hitting Clinic
Swing mechanics, timing and plate approach.
Program
Pitching Clinic
Velocity, control and pitch repertoire.
Program
Defensive Skills
Footwork, glove work and throwing accuracy.
Collingwood · Ontario
The challenge
Open a brand-new facility and have it read like an institution from day one.
Short Porch was a brand-new operation with no Google footprint, no reviews, no community recognition. Mark and Dawn needed the website to do work that usually takes years of word-of-mouth — establish credibility for serious parents and players who'd compare them to existing academies. The brief was direct: load instantly on patchy arena Wi-Fi, look unmistakably like elite athletics, and let people figure out 'which program is for my kid' in under thirty seconds.
Our solution
A static academy site, engineered like a varsity playbook.
Eight HTML pages — Home, six program detail pages, Our Story, Contact, FAQ — served as static assets behind a CDN. No framework runtime, no client-side router, no hydration cost. The visual identity uses college-sports cues: Graduate as the display typeface (think NCAA banners), navy + crimson + cream + tan as the palette, all-uppercase headlines, and section banners that feel like scoreboards. Tailwind for layout, custom CSS for the branded utilities, and a small JS file that loads the shared header/footer to keep markup DRY across pages.
Key decisions · 06
Built like an institution, weighs almost nothing.
// 02
College-sports visual identity
Graduate for display, Work Sans for body, Courier Prime for accents. Navy + crimson + cream + tan — the palette of varsity programs that have been around forever, applied to a brand that's brand new.
// 03
Program-first information architecture
The home page funnels you to one of six programs in two scrolls. Each program has its own dedicated page with photos, age range and what's covered. Parents know what they need before they call.
// 04
Wireframe document for the client
Before code, a Pandoc-generated DOCX wireframe with every page mocked. Mark and Dawn approved on PDF before we touched HTML — zero re-work mid-build.
// 05
Instagram-aware content surface
The 'Our Story' page hosts a hero video clip and routes traffic to @shortporchbaseball — where Mark and Dawn already post their best material. The site doesn't compete with their socials; it boosts them.
// 06
Built-in placeholder workflow
Photography was lagging behind the launch deadline. We wrote a small Node script that generates branded placeholder images on demand, so the site shipped with consistent visuals while real photos were being staged.
Impact
Open day, online, indexed.
- Live
Site shipped on schedule
shortporchbaseball.com live before opening day. No staging issues, no broken links, no day-one bug list.
- 06
Programs bookable from day one
Hitting · Pitching · Defensive Skills · Catcher's Clinic · Youth Fundamentals · Private Lessons — each with a dedicated page and a direct contact path.
- <1s
LCP on a cold mobile network
Static delivery + edge caching makes the site load before a typical SPA has finished hydrating. Critical for parents searching from a bleacher.
- EN
Local SEO from launch
Schema.org markup, Open Graph, sitemap + canonical URLs. Indexed within days, ranking for 'indoor baseball Collingwood' and program-specific queries.
Tech stack
Static, fast, easy to keep alive.
- HTML5
- Tailwind CSS
- Vanilla JS
- Graduate
- Work Sans
- Courier Prime
- Playwright (capture)
- Sharp (placeholders)
- Pandoc (wireframes)
- Open Graph
- Schema.org
- CDN edge cache
Related services