// Code-generation skill for improving conversion performance of Career Hub pages. Use only when changing page templates, CTA structure, trust elements, mobile UX, or other implementation details in the repo.
[HINT] Download the complete skill directory including SKILL.md and all related files
| name | page-cro |
| description | Code-generation skill for improving conversion performance of Career Hub pages. Use only when changing page templates, CTA structure, trust elements, mobile UX, or other implementation details in the repo. |
| metadata | {"family":"marketing","owner":"marketing","last_reviewed":"2026-04-30T00:00:00.000Z","version":"1.0.0"} |
This is a code-generation skill. Use it only when the outcome is a page-level repo change.
Conversion optimization for Indeed Flex Career Hub pages. The conversion goal is app downloads (not signups or purchases). Every page should create a clear, frictionless path from useful content to the Indeed Flex app.
Read nextjs-app/docs/BRAND.md for editorial rules. The Career Hub is NOT a sales channel. CRO here means making genuinely useful content that naturally leads to app downloads through demonstrated value.
Analyze pages in this order (highest impact first):
| Check | Pass Criteria |
|---|---|
| Answer-first paragraph | 40-60 words with a data point in the first paragraph |
| 5-second test | Can a visitor understand what this page offers in 5 seconds? |
| Specificity | Includes dollar amounts, city name, role name (not generic) |
| Benefit framing | Framed around what the reader gets, not what Indeed Flex offers |
| Mobile hero | Key info visible without scrolling on 375px viewport |
Career Hub CTAs drive app downloads. Audit each CTA on the page:
| Check | Pass Criteria |
|---|---|
| Primary CTA visible | "Find Shifts" / "Download App" visible without scrolling |
| Value-first copy | Button says what user gets, not what they do. "Find Bartender Shifts" not "Download App" |
| CTA frequency | At least 2 CTAs: one in hero, one after key content section |
| No CTA overload | Max 3 distinct CTA types per page. More causes decision paralysis |
| Contextual CTAs | CTA copy matches surrounding content: after pay section, "Calculate Your Pay" |
| Mobile CTA | App download CTA is thumb-reachable and prominent on mobile |
CTA Copy Hierarchy (strongest to weakest):
| Component | Placement | Check |
|---|---|---|
AuthorByline | Near the hero, above the fold | Shows author team + review status + date |
DataSourceCitation | After data-heavy sections or at page bottom | Links to BLS, DOL, official sources |
FlexerTestimonials | After key content, before final CTA | Industry-matched testimonials |
| Pay data with sources | Inline with salary figures | "(BLS OEWS 2025)" after every dollar amount |
| "Last updated" date | Visible near the top | Current date (within 6 months) |
Placement rule: Trust signals should appear NEAR CTAs. A CTA without a nearby trust signal converts 30-40% worse.
| Check | Pass Criteria |
|---|---|
| Max 150 words before a heading | Long text blocks cause scroll abandonment |
| Comparison tables | At least one table for data-rich pages (salary, cost of living) |
| Interactive elements | Tools, calculators, or expandable sections on pages > 1000 words |
| FAQ section | Minimum 4 FAQs with schema markup |
| Internal links | 3+ contextual internal links distributed across sections (not clustered) |
| Check | Pass Criteria |
|---|---|
| Touch targets | All buttons/links at least 44x44px |
| No horizontal scroll | Content fits 375px viewport without overflow |
| Tab/filter usability | Industry tabs, filters, dropdowns usable on mobile |
| CTA sticky or repeated | App download CTA accessible without scrolling back to top |
| Card readability | Role/city cards show key info (title, pay) without truncation |
| Automated check | pnpm audit:responsive reports zero CRITICAL findings for the page being audited |
Run pnpm audit:responsive against the local dev server during a CRO audit. The script writes screenshots and a report.json per audited route under reports/audits/responsive/<label>/; treat horizontal overflow and unscrollable tables as blockers, and triage small touch targets affecting primary CTAs.
/career-hub/roles/[slug])/career-hub/cities/[slug])/career-hub/cities/[city]/[role])/career-hub/guides/[slug])/career-hub/tools/[slug])For every CRO check above, apply the relevant behavioral science principle from the marketing-psychology skill. Read .agents/skills/marketing/marketing-psychology/SKILL.md for the full model library.
Quick psychology checks per section:
| CRO Section | Psychology Principle | What to Verify |
|---|---|---|
| Hero / Value Prop | Anchoring, Specificity effect | Is the highest pay figure shown first? Are numbers specific ($19.50 not "about $20")? |
| CTA | Activation energy, Zero-price effect, Hick's Law | Is the first step trivially easy? Is "free" emphasized? Is there only ONE clear CTA per context? |
| Trust Signals | Authority bias, Social proof, Pratfall effect | Expert attribution near CTA? Worker testimonials present? Honest caveats that build trust? |
| Engagement | Reciprocity, IKEA effect, Zeigarnik effect | Does the page give value before asking? Do tools let users build something? Do incomplete results pull users forward? |
| Mobile | Goal-gradient, Default effect | Progress bars on multi-step tools? Smart defaults pre-filled from context? |
Different traffic sources bring visitors with different intent and trust levels. Optimize accordingly:
| Traffic Source | Visitor Mindset | CRO Priority |
|---|---|---|
| Organic search | Seeking specific answer (high intent) | Answer-first hero, immediate value, contextual CTA after value delivered |
| Google AI Overview click-through | Already read a summary, want depth | Lead with data competitors don't have (Indeed Flex proprietary), skip basic definitions |
| Social media (Reddit, TikTok) | Curious but skeptical, low trust | Heavy social proof, worker testimonials, no corporate language |
| Direct / returning | Already knows Indeed Flex, returning for tools or new content | Fast path to tools, personalized suggestions, "what's new" signals |
| Referral (industry blogs, news) | Evaluating Indeed Flex specifically | Comparison-friendly content, authority signals, "why Indeed Flex" differentiation |
Implementation: Use UTM parameters and referrer detection to adjust above-fold content emphasis. At minimum, ensure the page works well for the dominant traffic source (usually organic).
Beyond the basic mobile checks in Section 5:
| Pattern | When to Use | Implementation |
|---|---|---|
| Sticky bottom CTA | Guide articles > 1000 words | Fixed bar at bottom of viewport appears after scrolling past hero CTA. Contains primary CTA + brief value prop. |
| Swipeable role/city cards | Pillar pages with 10+ items | Horizontal scroll carousel with snap points. Show 1.5 cards to hint at more. |
| Collapsible data tables | Tables with 4+ columns | Show 2-3 key columns by default, "Show all columns" expander. Or transform to card layout. |
| Pull-to-reveal | Tool results pages | After calculation, results appear with a smooth expand. Keeps input visible above. |
| Thumb zone optimization | All mobile CTAs | Primary CTAs in bottom 40% of viewport (natural thumb reach). Avoid top-right corner actions. |
| Accordion FAQ | FAQ sections on mobile | Collapsed by default, tap to expand. Shows question text fully, answer hidden until tapped. |
Use these templates when proposing experiments. Each follows: Hypothesis → Metric → Expected Lift.
| Test | Hypothesis | Primary Metric |
|---|---|---|
| Pay range in H1 vs generic H1 | "Including specific pay range ($15-$25/hr) in H1 will increase time-on-page by 15% because it immediately signals value" | Time on page, scroll depth |
| Data-first vs context-first intro | "Leading with the pay statistic before context will reduce bounce rate by 10% because workers want the answer immediately" | Bounce rate |
| Worker photo vs no photo | "Adding a real worker photo to the hero will increase CTA clicks by 8% through social proof" | CTA click rate |
| Test | Hypothesis | Primary Metric |
|---|---|---|
| Value-first vs action-first CTA | "'Find $18+/hr Warehouse Shifts' will outperform 'Download Indeed Flex' by 20% because it focuses on the outcome" | CTA click-through rate |
| Sticky bottom CTA vs inline only | "A sticky bottom CTA on mobile will increase app store visits by 15% by keeping the action always accessible" | App store page visits |
| CTA after section 2 vs after section 4 | "Moving the first in-content CTA earlier will increase clicks by 12% because most mobile users don't scroll past section 3" | CTA click rate, scroll depth |
| Test | Hypothesis | Primary Metric |
|---|---|---|
| BLS citation visible vs footnote | "Showing '(BLS OEWS 2025)' inline vs as a footnote will increase time-on-page by 10% through increased perceived credibility" | Time on page, return visits |
| Testimonial near CTA vs separate section | "Placing a worker testimonial within 200px of the CTA will increase click-through by 12%" | CTA click rate |
For each page audited:
## CRO Audit: [Page URL]
### Score: X/10
### Traffic Source: [primary source for this page]
### Quick Wins (implement now)
- [specific change with expected impact]
- Psychology principle: [which model supports this change]
### High-Impact Changes
- [bigger change with rationale]
- Psychology principle: [which model supports this change]
### Test Ideas
- Hypothesis: "[structured hypothesis]"
- Metric: [what to measure]
- Expected lift: [estimated improvement]
### CTA Copy Alternatives
- Current: "[current text]"
- Alt 1: "[alternative]" (psychology: [principle])
- Alt 2: "[alternative]" (psychology: [principle])
### Mobile-Specific Fixes
- [mobile issue + recommended pattern from Section 9]
### Psychology Gaps
- [missing psychological lever + recommendation]
| Resource | Path |
|---|---|
| Editorial rules | nextjs-app/docs/BRAND.md |
| Conversion goals, CTA hierarchy | nextjs-app/docs/MARKETING_CONTEXT.md |
| Psychology models | .agents/skills/marketing/marketing-psychology/SKILL.md |
| Design system, mobile patterns | .agents/skills/design/frontend-design/SKILL.md |
marketing-psychology — The "why" behind CRO decisions. Use together for every audit.frontend-design — The "how" for implementing design changes. Use when CRO identifies visual/UX fixes.content-review — Quality scoring (CRO is a complementary lens to the 6-dimension scoring)site-growth — SEO health and tool evaluationsite-architecture — Internal linking and navigation structurecopy-editor — Sweep 7 (Zero Risk) aligns with CRO friction reduction