Web Platform
Focus Point Media
A photography studio's digital storefront, built to convert
The Problem
Focus Point Media is a commercial photography studio in Guelph, Ontario serving two distinct markets: product photography for performance brands and architectural photography for design firms across the GTA and Southern Ontario.
Their previous online presence didn't reflect the quality of their work. Portfolio browsing was clunky, there was no way for prospects to book directly, and the site couldn't be updated without a developer. They needed something that matched the caliber of their photography and actually generated leads.
What We Built
A full marketing platform that doubles as a high-performance lead generation engine. The site serves both market segments with dedicated portfolio experiences, each with category filtering, responsive grids, and a lightbox viewer with smart image preloading.
Content is fully managed through a headless CMS. The client can publish new projects, rearrange portfolio images, update FAQ sections, and edit SEO metadata without touching code. Case studies use a composable block system so complex layouts can be assembled from simple building blocks.
The lead capture flow is a two-step process: a contact form protected by bot protection, followed by an embedded booking widget. Submissions go directly into the CRM and trigger automated email confirmations. The entire pipeline runs without manual intervention.
Key Features
Dual-Market Portfolio System
Separate portfolio experiences for product photography and architectural photography, each with category tabs, responsive grids, and a full lightbox viewer with keyboard navigation.
Intelligent Image Preloading
Custom preloading logic that anticipates which images the user will view next. Hover-triggered on desktop, swipe-triggered on mobile. Reduced perceived gallery load times by roughly 40%.
Composable Story Blocks
A modular content system for case studies and project pages. Title blocks, text sections, image grids, pull quotes, and full-width images that the client can assemble into any layout from the CMS.
Integrated Lead Capture
A two-step form flow: contact details first, then an embedded booking widget. Protected by bot protection and a honeypot field. Leads go straight into the CRM.
CMS-Managed SEO
Every page has editable SEO titles, meta descriptions, and a hidden H1 override field for keyword targeting. Structured data covers 7 schema types including LocalBusiness, FAQPage, and CreativeWork.
Edge Deployment
Deployed to edge servers worldwide. Static assets served from a global CDN, server functions run at the edge. No traditional server infrastructure to manage.
Built With
The Impact
SEO: Rebuilding from a 5.5 to Production-Grade
The original site was a WordPress build running a bloated theme with Visual Composer, RevSlider, and WPBakery. A full site crawl revealed the damage: an SEO score of 5.5 out of 10, 273 URLs totaling 66MB, 6 broken pages, and 18 pages with critical security findings. Every single page had the same empty meta description. Fifteen pages had no H1 heading at all, and another fifteen had skipped heading levels.
For an image-heavy photography site, the performance picture was worse. No WebP or AVIF images anywhere. No Brotli compression on most pages. Font files shipped in every format (EOT, TTF, WOFF, WOFF2, SVG), including 2MB+ SVG font files that no modern browser needs. The page weight made it nearly impossible to rank for competitive search terms.
The rebuild addressed every finding from the crawl report:
Before — WordPress
- Overall quality: 7.0 / 10
- SEO score: 5.5 / 10
- Security: 7.0 / 10
- Accessibility: 5.0 / 10
- 273 URLs crawled, 66MB total weight
- 100% duplicate (empty) meta descriptions
- 15 pages missing H1 headings
- 6 broken 404 pages
- 18 pages with critical security findings
- No WebP or AVIF images
- No IPv6 support
After — Custom Build
- Overall quality: 9.4 / 10
- SEO score: 10.0 / 10
- Security: 10.0 / 10
- Accessibility: 7.6 / 10
- All unique titles and meta descriptions
- Every page has a proper H1 heading
- Zero broken pages, zero skipped heading levels
- 7 structured data schemas
- Full security headers (CSP, HSTS, X-Frame-Options)
- AVIF + WebP via an image CDN with format negotiation
- IPv6 supported, edge-deployed globally
The H1 override pattern was critical for a photography site. The visual heading on the portfolio page says "Our Work" because that is what visitors expect. But the hidden H1 reads "Product Photography for Performance Brands" because that is what Google needs to see. Every page has this dual-heading system, editable from the CMS.
Image delivery was rethought from scratch. An image CDN handles format negotiation (AVIF when supported, WebP as fallback) and dynamic resizing (500px grid thumbnails, 1600px lightbox images, 2400px heroes). The 31-day cache TTL and smart preloading system means returning visitors load galleries almost instantly.
How We Approached It
The core challenge was performance. Photography sites live or die by how fast images load. We built a custom preloading system that anticipates which images the user is about to view, preloading two images ahead on hover (desktop) or three ahead on swipe (mobile). A ref-based tracking set prevents duplicate requests, and the cache resets on category switches.
For content management, we designed 8 document types in the CMS with validation rules, required alt text on every image, and drag-to-reorder on portfolios, FAQs, and process steps. The composable story block system lets the client build rich project pages from simple pieces without ever seeing markup.
Security was baked into the middleware layer. CSP headers with granular directives for each third-party service. HSTS with preload. X-Frame-Options DENY. The full stack runs on edge servers worldwide, eliminating traditional server infrastructure entirely.
SEO was treated as a first-class feature. Every page has CMS-editable metadata, a hidden H1 override for keyword targeting, and structured data. Seven schema types cover LocalBusiness, FAQPage, Service, CreativeWork, and more. A dynamic sitemap pulls slugs from the CMS on build.
Project Status
Live
Focus Point Media is live and actively being used by the client to manage their portfolio and capture leads. The site is edge-deployed globally with a headless CMS powering all content.