Audit conversion ux
Pre-production audit protocol for static websites — 10 sequential skills covering performance, accessibility, SEO, security, and more
npx -y skills add magallon/website-audit-toolkit --skill audit-conversion-uxAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Conversion UX audit for B2B landing pages and commercial demo sites built with vanilla HTML/CSS/JavaScript on cPanel. Evaluates every element against its contribution to conversion — moving a skeptical B2B decision-maker from awareness to contact intent. Reviews visual hierarchy, primary CTA clarity, trust signals, cognitive load, progressive disclosure, form usability, interactive demo experience, error handling, loading states, and Jobs To Be Done alignment. Run as the sixth audit in the pre-production protocol, after performance, code consistency, accessibility, responsive design, and cross-browser compatibility.
SKILL.md
16.7 KB, as published. Nobody here has run it
Conversion UX Audit
B2B Landing Pages and Commercial Demo Sites
A site that loads fast, is accessible, and works on all browsers still fails if the user does not understand the value proposition, does not trust the product, or cannot find the next step to take. This audit evaluates every element against one question: does this help a skeptical B2B decision-maker move toward contact intent?
The target user is a B2B decision-maker — manager, director, or business owner — evaluating whether the product can solve a real problem in their organization. They have limited time, are naturally skeptical of technology promises, and need to understand the value quickly without feeling pressured.
Conversion Framework
Jobs To Be Done (JTBD)
Evaluate each page section against the job the user is trying to complete. Identify the project's primary JTBD hierarchy before auditing:
| Priority | User | Motivation | Expected Outcome |
|---|---|---|---|
| Primary | Decision-maker | Determine if the product solves their specific problem | Confident enough to request a conversation |
| Secondary | Technical evaluator | Understand how it works and what it integrates with | Can explain the technology to leadership |
| Tertiary | End user | Understand how it would change their daily workflow | Visualize using it without anxiety |
Flag any section that does not serve at least one JTBD. Flag any section that assumes specialized knowledge the target user does not have.
Macro Bets Alignment
Before auditing, identify the project's 2-3 core competitive differentiators (macro bets). Every design decision must visibly reinforce at least one. Common B2B macro bets include accuracy, speed of implementation, measurable ROI, ease of use, security, and integration breadth.
Flag copy that uses vague benefit language ("improve productivity", "be more efficient") without a specific metric or proof point tied to a macro bet.
Severity Levels
| Level | Description | Action |
|---|---|---|
| Critical | Blocks conversion or destroys trust | Fix before launch |
| High | Significantly reduces conversion likelihood | Fix before launch |
| Medium | Suboptimal experience that reduces persuasion | Fix within current sprint |
| Low | Minor opportunity | Fix when convenient |
Section 1 — Visual Hierarchy
1.1 Hero Section — First 5 Seconds
The hero must answer three questions in under 5 seconds: What is this? Who is it for? What should I do next?
What to check:
- Main headline states the specific benefit, not the technology
- Subheadline names the target user or industry
- One primary CTA visible without scrolling
- Supporting visual reinforces the message — not decorative
Headline hierarchy test: Cover the logo and subheadline. Read only the headline. Can someone unfamiliar with the product understand what it does and for whom? If not, the headline fails.
CTA hierarchy test: Where does the eye go after reading the headline? It must go to the primary CTA. If it goes to navigation, secondary links, or decorative elements — the hierarchy is broken.
1.2 Reading Flow
The page must guide the user through a logical persuasion sequence:
- Problem recognition — "This is my situation"
- Solution introduction — "This is how it's solved"
- How it works — "I understand the mechanism"
- Proof — "Others have done this successfully"
- Objection handling — "My concerns are addressed"
- CTA — "I'm ready to take the next step"
Flag sections out of sequence. Flag any jump from solution to CTA without proof — B2B buyers require evidence before acting. Flag pages that show "how it works" before establishing the problem.
1.3 Heading Structure as Persuasion
Each heading must do persuasive work, not just label content: ❌ Label headings — describe but do not persuade "Product features" "How it works" "Clients" ✅ Benefit headings — communicate value "Precise answers in seconds, not hours of searching" "Three steps to transform your documentation into searchable knowledge" "Companies that recovered their investment in under 60 days"
Flag any H2 or H3 that a user could skip without losing value.
1.4 Visual Weight Balance
What to check:
- Primary CTA has highest visual weight on page
- Secondary CTAs visually subordinate to primary
- No more than one element per section at maximum visual weight
- White space used intentionally — compressed sections feel untrustworthy
Flag pages where two elements of equal visual weight compete in the same viewport area.
Section 2 — Trust Signals
B2B buyers require trust before acting. Trust is built through specificity, proof, and professionalism.
2.1 Social Proof
Trust signal hierarchy (strongest to weakest):
- Named client with specific metric
- Named client with attributed quote
- Industry + metric without client name
- Generic metric without attribution
- "Our clients love us" without evidence — no credibility
Specificity test: Replace every claim with its opposite. If the opposite sounds absurd, the claim has no information value. Replace with a specific number. ❌ Vague — no credibility "Our clients save significant time" ✅ Specific — credible "Company X reduced search time from 3 hours to 30 minutes" "Average ROI for first 3 clients: 850% in year one"
What to audit:
- At least one testimonial with name, company, and specific metric
- Case studies include before/after numbers
- Client logos present if available
- Results are specific: time, money, percentage — never "significant"
- Testimonial quotes sound like real people, not marketing copy
2.2 Trust Indicators
What to check:
- Team or founder credibility mentioned
- Implementation timeline stated clearly and specifically
- Pricing transparency — at minimum a range or model
- Data security mentioned — B2B buyers sensitive to confidentiality
- Support channels visible
- Professional visual design — inconsistencies signal product immaturity
Flag any page that asks for contact information before providing evidence of value.
2.3 Objection Handling
Every B2B buyer has predictable objections. The page must address them proactively:
| Common objection | Where to address |
|---|---|
| "Is my data safe?" | Security section or FAQ |
| "How long will this take?" | Timeline in process section |
| "What if it doesn't work for my case?" | Free demo or proof-of-concept offer |
| "Is it worth the investment?" | ROI data or case study with numbers |
| "Can my team actually use this?" | Training and support section |
| "What happens long-term?" | Renewal and continuation options |
Flag objections not addressed anywhere on the page or in FAQ.
Section 3 — Cognitive Load
High cognitive load delays decisions. B2B buyers under time pressure will leave rather than exert the effort.
3.1 Information Density
One key idea per section. Features grouped by benefit, not technical category.
The "so what" test: After every feature statement, ask "so what?" If the answer is not obvious from the copy, the statement is incomplete. ❌ Missing "so what" "Semantic search with 3072-dimension vectors" ✅ Complete — feature + benefit "Semantic search — understands the meaning of your question, not just keywords"
Flag sections with more than 5 features listed without grouping. Flag feature lists without benefit context.
3.2 Decision Points
Minimize options at every decision point:
- Pricing plans: 2-3 maximum
- Navigation items: 5-7 maximum
- Form fields: only what is strictly necessary
Plan differentiation test: Can a user identify which plan is for them in under 10 seconds? Plans must differ by profile ("for growing teams" vs "for established operations"), not just limits.
3.3 Progressive Disclosure
Not all information belongs in the main flow:
| Container | Content type |
|---|---|
| Tooltips | Brief explanations (< 2 sentences) |
| Accordions/FAQ | Questions after initial interest |
| Modals | Detailed case studies, technical specs |
| Dedicated pages | Full documentation, complete pricing |
Flag secondary information competing with primary persuasion content.
3.4 Simplified Forms
Full form field analysis and benchmarks: see
references/conversion-patterns.md
Contact form — only request what is necessary for a first conversation. Benchmark: every field after the first three reduces completion by ~10-15%.
Flag every form field not strictly necessary for making the first conversation useful.
Section 4 — Primary CTA Strategy
4.1 CTA Hierarchy
One primary CTA per page, maximum two secondary CTAs. More creates decision paralysis.
| Level | Visual treatment | Examples |
|---|---|---|
| Primary | Maximum weight, full button | "Schedule a demo", "See how it works" |
| Secondary | Subordinate, outline button | "View case studies", "See pricing" |
| Tertiary | Text link only | "Learn more", "View details" |
4.2 CTA Copy
Button copy describes the outcome, not the action: ❌ Action-focused "Submit" / "Contact" / "Request information" ✅ Outcome-focused "See it in action" / "Schedule a call" / "Calculate my ROI"
Flag any CTA with copy that could apply to any product on any website.
4.3 CTA Placement
What to check:
- Primary CTA visible in hero without scrolling on all screen sizes
- CTA repeated after every major proof section
- Sticky CTA or nav CTA on long pages — user never scrolls back up to convert
- CTA appears after the argument is made, not before
Flag CTAs before the value proposition is complete.
4.4 Friction Reduction Near CTA
Immediately near the primary CTA, address remaining anxiety: "No commitment — just a 30-minute conversation" "Response in under 24 hours" "Your data is 100% private and confidential"
Flag CTAs requesting personal information without a friction reducer nearby.
Section 5 — Interactive Demo Experience
If the project does not include an interactive demo, skip this section and note "Not applicable — no interactive demo" in the audit output.
The demo is the highest-value conversion element. A prospect who completes the demo is significantly more likely to convert.
5.1 Demo Onboarding
5-second test: Show the demo entry to someone unfamiliar. Can they start in 5 seconds without explanation? If not, entry is too complex.
What to check:
- Placeholder text or example shows what to do
- Action to start is a single obvious click
- No multi-step setup before first experience
5.2 Demo Response Quality
What to check:
- Response is specific and relevant to the query
- Source references or evidence visible where applicable
- Response time under 3 seconds or loading state shown
- Response length appropriate — complete but not overwhelming
- No generic responses that could come from any tool
5.3 Demo States
Every state the user might encounter must be designed:
- Initial — before any interaction
- Loading — while waiting (appears within 300ms)
- Success — response received and displayed
- Empty — query produced no relevant results
- Error — API failure or network error
- Rate limit — too many requests
Error state requirements:
- Message in the user's language, not English technical errors
- Human-readable, not API response codes
- Suggests what to do next
- Does not expose technical infrastructure details
5.4 Suggested Queries
What to check:
- Queries are industry/use-case specific, not generic
- Queries demonstrate the most impressive capabilities
- Phrased as a real user would ask
- At least 3 available for variety
Section 6 — Feedback and Interaction States
6.1 Interactive Element States
Note: Visual state definitions (hover, focus, active, disabled) are covered in Audit 06 — Accessibility. This section covers conversion-specific state concerns.
What to check:
- Buttons have a loading state when processing (spinner or text change)
- Form fields have inline validation — not submit-only
- All error messages explain how to fix the problem
- All success states communicate what happens next
6.2 Form Validation
❌ Submit-only — frustrating Fill form → submit → see errors at top → hunt for fields ✅ Inline — efficient
Validate on blur (field loses focus) Error below specific field, not top of form Error explains fix: "Enter a valid email, e.g. [email protected]"
6.3 Success States
After form submission: replace form with confirmation, state the next step, mention timeline.
Flag any form that shows blank form after submission without confirmation. Flag success states that don't mention what happens next.
Section 7 — Page-Level UX Audit
7.1 Navigation
What to check:
- Current page/section indicated
- 5-7 items maximum
- Labels benefit-oriented, not department-oriented
- Logo links to home
- External links:
target="_blank"+rel="noopener noreferrer"
7.2 Scroll Experience
What to check:
- No important content hidden below fold without scroll indication
- Sections have breathing room — compressed sections feel untrustworthy
- Sticky elements don't obscure content
- Scroll animations trigger at appropriate thresholds
7.3 Mobile UX Specifics
What to check:
- Primary CTA visible on mobile without scrolling
- Phone numbers tappable (
href="tel:") - Email addresses tappable (
href="mailto:") - No horizontal scroll anywhere
Section 8 — Copy Quality at the UX Level
Note: Detailed copy audit is in Audit 12 — Copywriting. This covers UX-level copy affecting conversion.
8.1 Scanability
B2B users scan before reading. The scan must communicate enough value to earn a read:
- Headings convey key message without body copy
- First sentence of each paragraph is the most important
- Bold highlights key claims, not random phrases
- Bullet points parallel in structure
- No paragraph longer than 4 lines without visual break
8.2 Technical Language Calibration
| Section | Audience | Language level |
|---|---|---|
| Hero + Benefits | Decision-maker | Plain language, no jargon |
| How it works | Mixed | Technical concepts with plain explanation |
| Technical specs / FAQ | Technical evaluator | Full terminology acceptable |
Flag any technical term in a decision-maker section without plain-language explanation.
Testing Protocol
Full manual test descriptions: see
references/conversion-patterns.md
5-second test — hero clarity: what, for whom, what to do
Thumb test — mobile CTA reachability
Stranger test — watch someone fill the form without guidance
Demo first-use test — watch someone start and complete the demo without explanation
Objection coverage test — list every buyer question, check each is answered on page
Audit Output Format
Conversion UX Audit — [Page/Section Name]
Date: [Date]
Page type: [Landing / Demo / Pricing / Contact]
Primary JTBD: [Decision-maker / Technical evaluator / End user]
Summary
Critical conversion blockers: X
High priority issues: X
Medium priority: X
Low priority: X
Macro bet alignment: [Strong / Moderate / Weak]
Estimated conversion impact: [High / Medium / Low risk]
Critical Conversion Blockers
[Issue title]
Section: [Hero / Benefits / How it works / Proof / CTA / Form / Demo]
JTBD affected: [Which user job is not being served]
Issue: [What is failing and why it reduces conversion]
Fix: [Specific correction]
High Priority
[Same format]
Medium Priority
[Same format]
Low Priority
[Same format]
Recommended Fix Order
CTA hierarchy — single primary action per page
Trust signals — add specific metrics to claims
Objection coverage — address unanswered buyer questions
Form friction — reduce fields, improve error messages
Demo states — all failure states designed
Copy calibration — remove jargon from decision-maker sections
Scan structure — headings that persuade, not label
Full quick-reference checklist: see
references/checklist.md