Performance
62 to 99
Lighthouse mobile lab score
Case study / Viirus Theatre / Summer Season '26
A theatre website rebuilt for speed, accessibility, and everyday use.
Viirus needed a public website that could make repertoire, dates, tickets, accessibility information, languages, and cultural content easier to navigate without making the theatre feel generic.
Proof strip
The measurable gains support the story.
The numbers stay visible, but they no longer dominate the identity of the whole page.
Largest Contentful Paint
8.8s to 2.0s
Faster first meaningful visual load
Total Blocking Time
130ms to 40ms
Less main-thread interruption
Carbon rating
F to B
Website Carbon Calculator
Context
A theatre website behaves like a service layer.
Visitors do not arrive with unlimited attention. They need to understand what is on, when it starts, what language it uses, how accessible it is, and where the ticket path begins. The redesign treats those questions as the core product, not as supporting details around the visual identity.
What changed
- Repertoire, calendar, production, and ticket paths kept close together
- Bilingual content handled as part of the journey
- Clearer page roles for visitors and editors
Performance
Cultural content became lighter without becoming generic.
The site still carries large imagery and theatre atmosphere, but the implementation gives priority to the parts visitors need first. Modern image formats, responsive sizing, caching, and reduced blocking work make the site feel calmer on phones and slower connections.
What changed
- AVIF and WebP image delivery
- Priority treatment for above-the-fold media
- Lower transfer weight for image-heavy pages
Accessibility
Accessibility moved from checklist to interface behavior.
The work connects accessibility to things people can actually use: text size, spacing, contrast, motion, target size, focus styling, readable links, status messages, and keyboard-safe overlays.
What changed
- Reading preferences available in the interface
- Stronger focus and reduced-motion options
- Clearer status states for search and dense calendar interactions
Operations
The publishing system became easier to keep alive.
A theatre website changes constantly. New productions, dates, languages, subtitles, access notes, images, and ticket states all need to stay current. The page structure was shaped so routine updates feel repeatable instead of fragile.
What changed
- Predictable content blocks for productions and events
- Calendar states that distinguish available, selected, sold-out, hovered, and focused shows
- Navigation that keeps search, language, accessibility, and ticket actions in familiar places
Accessibility standard mapping
Features were tied to user impact.
The evidence stays, but it is framed as product behavior: how an interface helps people read, move, understand status, and complete the task.
Feature
Criterion
User impact
Sticky navigation
WCAG 3.2.3
Consistent navigation reduces cognitive load.
Focus rings
WCAG 2.4.7
Keyboard users can always see where focus is.
Text scaling
WCAG 1.4.4
Layouts adapt when text is zoomed up to 200%.
Status messaging
WCAG 4.1.3
Screen readers receive loading and empty-state updates.
Search dialog
WCAG 2.1.2
The overlay can be navigated and dismissed without a keyboard trap.
Read aloud
WCAG 1.1.1
Long-form content has an audio alternative for visitors who benefit from listening.
Next case study
Bring the same product lens to another public service.
HAAM works best where a website has to carry content, operations, accessibility, performance, and trust at the same time.