Scream or Dance 2026

All media, on the wrong kind of server.

The starting point was two 38 MB MP4s committed to the public folder and 27 MB of PNGs shipped as-is, unusable on a phone on festival-crowd mobile data. And the site is media-heavy by design: a video hero, 24 archive photos, four video embeds, custom display type.

I proposed Vercel; the client kept their shared Apache hosting. The site had to be first-class there anyway. The event date, 31 October 2026, is fixed, ticket phases change during the sale, and sales themselves run through a third-party vendor, so the site's job is to present the tiers and hand off cleanly.

The quieter requirement: non-developers update ticket prices and phases mid-sale, so everything content-shaped had to live in data objects, not markup.

A delivery layer the host doesn't provide.

• A
  A responsive Image component over CDN transforms

  One component wraps Cloudflare image transforms: a srcset built from six candidate widths, AVIF and WebP negotiation, required intrinsic dimensions so nothing shifts layout, lazy loading with a priority escape hatch, and no upscaling past an image's real width. Eleven components render through it.

• B
  An asset diet

  47 PNGs converted to WebP took the image payload from 27 MB to 6.8 MB, a 75% cut, measured from git blob sizes. 77 MB of hero video moved off the static host to the CDN, behind a background-video component that mounts landscape and portrait instances, so phones get a portrait-cropped file instead of a widescreen one.

• C
  A modern static host, rebuilt on Apache

  One command builds and zips the site, and an .htaccess reproduces the platform behavior: single-page-app rewrite fallback, immutable one-year caching for hashed assets, no-cache on the HTML entry, gzip and an HTTPS redirect. The trade-off is a manual zip upload instead of git deploys.

• D
  Everything content-shaped is data

  The nine ticket cards and the four-edition Journey archive are data objects. Since launch, a non-developer has changed prices and phases by editing data only (no markup touched). Adding the 2026 edition to the archive will be a data change too.

• E
  Design tokens and motion discipline

  The brand palette, glow shadows and font stacks live in a Tailwind theme block, with ten self-hosted woff2 faces set to swap. Sparkle keyframes switch off under reduced-motion preferences, and the year switcher is an accessible tablist with an animated underline and cross-fading panels.

Small, considering how much it moves.

• Ready when the copy lands. An FAQ accordion with full ARIA wiring is built and waiting, currently disabled until the client supplies copy.
• Details that read as design. A scroll-aware blurred header, a countdown in tabular figures with a timezone-fixed target, and privacy-friendly lazy YouTube embeds in the archive.
• Bundle. 457 KB of JavaScript and 46 KB of CSS uncompressed, small for a motion-heavy site.

Live through the sale, edited without a developer.

The site is live during the ticket sale, and price and phase changes have been made by a non-developer, touching data only. A client on legacy shared hosting got modern static-host behavior anyway: single-page-app fallback, immutable caching, gzip and HTTPS.

The visual design is the web designer's; the build, the delivery layer, the motion implementation and the accessibility wiring are the work shown here. The festival runs 31 October – 1 November 2026.