Nativ ui
Documentation

Landing Page

Complete landing page template structure.

Page Structure

┌─────────────────────────────────────┐
│            Navigation               │
├─────────────────────────────────────┤
│                                     │
│              Hero                   │
│                                     │
├─────────────────────────────────────┤
│          Logo Cloud                 │
├─────────────────────────────────────┤
│                                     │
│            Features                 │
│                                     │
├─────────────────────────────────────┤
│                                     │
│          Testimonials               │
│                                     │
├─────────────────────────────────────┤
│            Pricing                  │
├─────────────────────────────────────┤
│              FAQ                    │
├─────────────────────────────────────┤
│              CTA                    │
├─────────────────────────────────────┤
│            Footer                   │
└─────────────────────────────────────┘

Section Order

  1. Navigation - Sticky header with logo and links
  2. Hero - Value proposition + CTA
  3. Logo Cloud - Social proof from known brands
  4. Features - 3-6 key benefits
  5. How It Works - Simple 3-step process (optional)
  6. Testimonials - Customer quotes
  7. Pricing - Clear pricing tiers
  8. FAQ - Answer common objections
  9. CTA - Final conversion push
  10. Footer - Links and legal

Best Practices

  1. Single focus - One primary CTA throughout
  2. Above the fold - Key message visible immediately
  3. Social proof - Logos, testimonials, stats
  4. Fast loading - Optimize images, minimal JS
  5. Mobile-first - Design for small screens first