Performance, felt.
Pages load fast on a 4G iPhone in a clinic carpark. That is the test that matters.
Heavy PNGs. Default Google Fonts loading. No preload. Sluggish on mobile, especially on older devices.
- AVIF + WebP image pipeline at 640, 1024, 1600, 2400 px. 40 to 70 percent smaller than PNG.
- LCP preload on the largest image so it starts before the HTML is parsed.
- Self-hostable fonts for zero third-party requests when needed.
- Hover prefetch on nav links. Clicks feel instant.
- Native view transitions for app-like page changes.
- Explicit width and height on every image. Zero layout shift.
Findable in Google and AI.
Patients now ask ChatGPT and Perplexity. Your site needs to answer in both worlds.
A title and meta description. Maybe one basic JSON-LD block. No Speakable. No llms.txt.
- Schema.org @graph: Physician, MedicalOrganization, Hospital with hours, MedicalProcedure, BreadcrumbList, SpeakableSpecification, WebSite SearchAction.
- llms.txt at the root. The standard that tells AI crawlers how to index you.
- Canonical tags on every page.
- OpenGraph and Twitter Cards per page. Link previews look right in WhatsApp and LinkedIn.
- Sitemap with image extensions. Portraits get indexed.
- Clean URLs.
/about, never/about.html.
Compliant by default.
Real headers. Real consent. Not a checkbox.
HTTPS because the host turned it on. A cookie banner that does nothing. No CSP. No PDPA framework.
- Strict Content Security Policy. Only whitelisted scripts run.
- Full security header stack: HSTS preload, Permissions-Policy, Referrer-Policy, X-Content-Type-Options, COOP.
- security.txt at
/.well-known/security.txtfor responsible disclosure. - PDPA-compliant consent via Google Consent Mode v2. Deny by default. Choice persisted and revocable.
- Self-hosted fonts option. Visitor IPs never touch a third-party CDN.
- Cache policy that fits. One-year immutable for assets, no-cache for HTML.
WCAG 2.2 AA.
Every patient gets the same site, regardless of how they read it.
Alt text if you are lucky. Default focus rings. A mobile menu that traps keyboard users.
- Skip-to-content link on every page.
- Semantic landmarks.
<main>,<nav>witharia-label,aria-currenton active page. - Visible focus rings via
:focus-visible, designed in brand colour. - Keyboard-first mobile menu:
aria-expanded, Escape to close, focus return. - prefers-reduced-motion respected on every animation.
- Descriptive alt text on every image. Not the filename.
Installable, offline-capable.
A site, but also a saveable thing. Patients can add it to their home screen.
A website. Lose signal, blank page.
- Web App Manifest. "Add to Home Screen" on iOS and Android.
- Service worker: cache-first for assets, network-first for HTML, stale-while-revalidate for the rest.
- Branded offline page. No browser dinosaur.
- Print stylesheet. Patients print. The page should not waste ink.
Analytics, done right.
Real numbers, real conversion events, no compliance flags.
GA4 dropped in the head. Or nothing.
- Google Tag Manager. One container, all your pixels.
- Consent Mode v2. Legal in PDPA and GDPR markets.
- Automatic CTA tracking. Phone, email, WhatsApp, vCard, booking.
- Web Vitals telemetry. LCP, INP, CLS, TTFB streamed live.
- vCard "Save Contact" download. Tracked as a high-intent event.
The craft layer.
The reason a Drfol.io site does not look AI-generated.
A Webflow or Wix template. Default fonts, default fade-in, default everything.
- Bespoke typography. Faces selected, kerned, paired for the specialty.
- Intentional easing.
cubic-bezier(0.16, 1, 0.3, 1), notease-in-out. - Native scroll-driven reveals. GPU-accelerated, zero JS overhead.
- View transitions between pages. Native-app feel.
- Real art direction. Texture, gradient, grain.
- Hand-crafted states. Focus, hover, active. Designed, not inherited.