CRO Manifesto
Differentiate Actions With Proper Visual Hierarchy
context
Having two actions with equal visual weight can confuse users and create decision fatigue. Without clear prioritization, users may struggle to identify the most important next step.
Why?
Providing proper visual distinction between actions ensures users can quickly identify the primary action and secondary options. This improves navigation clarity and reduces hesitation.
Content
- Your homepage conversion rate is below 2.5% and users aren't clicking your primary CTA
- Analytics show high bounce rates (above 70%) with users spending less than 30 seconds on your homepage
- You have multiple buttons or links competing for attention without clear visual priority
- Your store gets 1,000+ monthly visitors and you're using Shopify, Shopify Plus, or custom theme
- Heatmap data shows scattered clicks across multiple actions instead of focused engagement
Create clear visual hierarchy by establishing primary and secondary action styles across your homepage.
- Define Primary Button Style: Set your main CTA button to minimum 48px height with high-contrast colors. Use your brand's primary color with white text for maximum visibility.
- Create Secondary Button Style: Make secondary actions 20-30% smaller with outline/ghost styling. Use transparent background with colored border matching your primary button.
- Shopify Implementation: Navigate to Online Store > Themes > Customize. Update button classes in your theme's CSS or use the built-in button styling options. Target classes like
.btn-primaryand.btn-secondary. - Apply Consistent Spacing: Add 24-32px margin between competing actions. On mobile, stack buttons vertically with 16px spacing.
- Test Contrast Ratios: Ensure primary buttons meet WCAG 4.5:1 contrast ratio for accessibility and visibility.
Timeline: 2-4 hours for implementation and testing across devices.
- Primary CTA Click-Through Rate: Expect 15-25% improvement in clicks on your main homepage action
- Homepage Conversion Rate: Look for 0.3-0.8% absolute increase within 2-3 weeks
- Time to Action: Measure reduced time between page load and first meaningful click using Google Analytics events
- Bounce Rate Reduction: Target 5-10% decrease in single-page sessions from homepage traffic
- AVOID: Making all buttons the same size and color intensity, creating equal visual weight. BEST PRACTICE: Use size, color saturation, and spacing to create clear hierarchy.
- AVOID: Placing too many CTAs above the fold competing for attention. BEST PRACTICE: Limit to one primary action and maximum two secondary actions in hero section.
- AVOID: Using low-contrast colors that blend into your background. BEST PRACTICE: Test button visibility by squinting or using grayscale preview.
- AVOID: Forgetting mobile hierarchy where space is limited. BEST PRACTICE: Stack buttons vertically on mobile with clear size differentiation.
Get A Free Website Audit.
We’ll identify what’s leaking revenue on your site and show you how to fix it. The free audit includes:
Live Website Walkthrough
Technical Analysis
Conversion Checklist
Key Section Redesigns
Industry & ICP Research
Implementation Plan
Work with the #1 Team That gets you predictable results.
Strategy
DESIGN
COPYWRITING
DEVELOPMENT
Free Audit & Redesign
Get a Free Audit
See the difference for yourself. We’ll identify what’s leaking revenue on your site and show you how to fix it.
Free Forever
130+ Optimizations
Section Redesigns
CRO Strategy Call
Talk to Glued
This isn’t a sales call. It’s a hands-on teardown session where we walk through exactly what’s holding your site back and what fixing it would mean for your revenue.
No Sales Pitch
ROI Projections
Free CRO Strategy