Website UX/UI Audit
A UX/UI audit is a structured analysis of an interface revealing mismatches between current user behavior and design intent. Result is not a list of "what's ugly" but specific problems with priorities and remediation recommendations. The difference between audit and redesign: audit answers "why it doesn't work," not "how to make it pretty."
What's Included in Audit
Audit covers several layers that shouldn't be mixed:
Heuristic Analysis — checking interface against principles (Nielsen's 10 heuristics, WCAG 2.1, platform guidelines). Done expertly without users. Reveals structural problems: inconsistent terminology, missing feedback, hierarchy violations.
Data Analysis — quantitative metrics: bounce rates per section, heatmaps (Hotjar, Microsoft Clarity), session recordings, GA4 conversion funnels. Data shows where the problem is, not why.
Technical UX — load speed (Core Web Vitals: LCP, CLS, INP), render stability, behavior on different devices and browsers, form correctness.
Accessibility — WCAG 2.1 A and AA compliance. Automated scanning via axe-core, Lighthouse, WAVE; manual keyboard navigation and screen reader checks (NVDA + Firefox, VoiceOver + Safari).
Audit Process by Stages
Stage 1: Context Gathering (1–2 days)
Before analysis, get:
- GA4 / analytics platform access for last 3–6 months
- session recordings (min 50–100 for key scenarios)
- Customer Support data: top inquiries about navigation or functionality
- business goals of pages/sections in audit scope
- competitive landscape (2–3 sites used as reference)
Without this, audit becomes subjective comments.
Stage 2: Automated Technical Analysis
# Lighthouse CI for multiple pages
npx lighthouse-ci autorun --collect.url="https://example.com" \
--collect.url="https://example.com/catalog" \
--collect.numberOfRuns=3
# axe-core via CLI
npx axe https://example.com --save axe-results.json
Tools:
- Lighthouse — Core Web Vitals, accessibility score, best practices
- axe DevTools / axe-core — WCAG violations with exact element selectors
- WebPageTest — waterfall analysis, filmstrip render
- Chrome DevTools Coverage — unused CSS/JS
Stage 3: Expert Analysis
Each key user scenario is checked. For example, for e-commerce:
- first visit → product search → add to cart → checkout
- returning user → favorites → repeat order
- mobile scenario (touch navigation, tap target sizes)
Each problem documented per template:
| Field | Description |
|---|---|
| Location | URL + element (XPath or CSS selector) |
| Description | what happens |
| Expected | what should happen |
| Heuristic | violated principle |
| Severity | 1 (critical) – 4 (cosmetic) |
| Recommendation | specific change |
Stage 4: Heatmap and Session Recording Analysis
Look for patterns:
- rage clicks — repeated clicks on unresponsive element
- u-turn — user enters page and immediately back
- dead scrolling — scrolling without interaction
- form abandonment — which field users abandon from
In Hotjar: configure via filters: rage_clicks > 2 or exit_page = /checkout.
Stage 5: Report Formation
Structure:
- Executive summary — 3–5 critical problems with most impact
- Detailed problem list, grouped by severity and sections
- Priority matrix: Impact × Effort
- Specific recommendations with visuals (screenshots + annotations, not mockups)
- Metrics for verification after implementation
Typical Findings
Most sites' audits find predictable problem classes:
Navigation and Orientation
- no breadcrumbs on deep pages
- no current section indicator in menu
- search hidden or returns irrelevant results
Forms
- validation only on submit (not inline on blur)
- unclear error messages ("Field required" vs "Enter email as [email protected]")
- autocomplete attribute not configured
Mobile
- tap targets smaller than 44×44px (Apple HIG) / 48×48dp (Material)
- horizontal scroll from fixed widths
- modals not adapted for virtual keyboard
Perceived Performance
- missing skeleton loaders on async load
- no optimistic UI on form submit
- CLS from images without width/height or aspect-ratio
Audit Deliverables
- PDF/Notion report with annotated screenshots
- Jira/Linear task table with ready descriptions and priorities
- Optional: video walkthrough of critical problems (10–15 min, for team)
Timeline
Landing page or business card site audit (5–10 pages) — 3–4 days. Corporate site or e-commerce (20–50 page templates) — 7–12 working days. If scope includes user testing with live participants — separate estimate +5 days.