Healthcare WordPress WooCommerce Completed · 2022

e-Surgery Healthcare Website Design: WordPress + WooCommerce Medical Platform

How we built a fully responsive healthcare platform combining Gutenberg CMS, WooCommerce e-commerce, and patient-focused UX — without sacrificing speed or accessibility.

Case Study · Healthcare · 2022

WordPress + WooCommerce medical platform built for patients, clinicians, and search engines — all at once.

e-Surgery.com needed a platform that could handle dynamic medical content, regulated e-commerce, and mobile-first UX without asking the clinical team to touch a line of code.

WordPress WooCommerce Gutenberg CMS Mobile-first UX Core Web Vitals
Healthcare Website Design Case Study: e-Surgery.com | Mettevo
Industry
Healthcare · Medical e-commerce (UK)
Website
e-surgery.com
Engagement
Full-scope design & development · 2022
Services
Healthcare website design · WordPress dev · WooCommerce · Mobile UX · SEO
100%
mobile responsive across all devices and screen sizes
3-in-1
CMS + e-commerce + patient information unified on one platform
+40%
faster load speed after performance and Core Web Vitals optimisation

The Challenge

e-Surgery.com is a UK-based regulated online pharmacy and medical information platform. When they came to Mettevo, their existing site was struggling with a problem common to many healthcare brands: how do you build a platform that serves patients browsing health information, customers purchasing medical products, and clinical teams managing content — all at once?

The legacy site was desktop-first, rigid, and slow. The content team had no ability to publish dynamic pages without developer support. The product catalogue sat disconnected from the informational content. And on mobile — where the majority of patients were searching — the experience was broken.

Healthcare website design requires a different level of care than a standard WordPress build. In a YMYL category, every design and architecture decision affects whether a patient trusts the platform enough to complete a consultation or purchase — and whether Google ranks it in the first place.

The Strategy

We rebuilt e-Surgery.com as a WordPress development project with WooCommerce at its core — but the real complexity was in the content architecture, Gutenberg block system, and UX decisions that made a medical platform feel coherent and trustworthy:

  • Full technical audit of legacy site — crawl, indexation, and performance issues documented before a single line of new code was written
  • Custom Gutenberg block library with 12 reusable components covering product cards, condition guides, FAQ accordions, and consultation CTAs — giving the clinical team full editorial control without touching code
  • WooCommerce product taxonomy redesign — structured prescription items, OTC medicines, and healthcare accessories with separate checkout flows appropriate for each product category
  • Mobile-first healthcare UX design — every component designed for small screens first, tested across 20+ device sizes, with progressive enhancement for desktop
  • Page speed and Core Web Vitals optimisation — compressed and lazy-loaded all medical imagery, deferred non-critical scripts, and implemented a CDN for consistent global performance
  • Technical SEO foundation — structured data (MedicalWebPage, Product, FAQPage schemas), clean URL hierarchy, and site architecture built to scale alongside the product catalogue

The Results

The rebuilt e-Surgery.com platform delivered measurable improvements across every dimension — from editorial workflow speed to patient experience to search performance:

Metric
Before
After
Mobile responsiveness
Desktop-first, broken on mobile
100% mobile-first
Content publishing
Required developer for every update
Clinical team fully independent
Page load speed
Unoptimised, inconsistent
+40% faster, CWV compliant
E-commerce capability
Basic product pages only
Full WooCommerce with Rx flows
SEO architecture
No schema, poor URL structure
Full structured data + clean hierarchy
Cross-device experience
Inconsistent, high mobile bounce rate
Consistent UX across all devices

Why this matters

A healthcare website that works long-term is built on three things: a CMS the clinical team can actually use, a mobile experience that doesn't lose patients mid-flow, and a technical foundation that earns Google's trust in a high-scrutiny YMYL category. e-Surgery.com needed all three rebuilt from scratch.

Key takeaway

Medical website design is never just a visual project. The real work is in the architecture — content systems, checkout flows, and performance foundations that hold up under real patient traffic and real search engine scrutiny.

The Gutenberg-first approach gave the clinical team genuine ownership of their platform — they can publish condition guides, update products, and run campaigns without developer support. The WooCommerce integration handles everything from simple OTC purchases through to prescription verification flows.

If you're building or rebuilding a medical practice website, a regulated healthcare e-commerce platform, or a patient-facing information hub, the e-Surgery.com project is a concrete example of what a rigorous, end-to-end approach produces.

Need a healthcare website that works for patients and Google?

If you're building a medical practice website, a regulated e-commerce platform, or a patient-facing information hub, let's talk about what the right architecture looks like for your goals.

Are You Ready To Grow Your Website?

Understanding the ins and outs of website growth, we help ensure that your site grows over time with ever-increasing reach and accessibility. Not only do we employ the latest digital marketing techniques for driving traffic directly to your website, but our strategies also focus on gaining loyalty from those visitors so they come back again and again.
Leave your contacts to get a comprehensive and aggressive digital marketing plan taking your business to new heights.