Phase 1: Core OG Tags

• Add og:title (60–90 chars)
• Add og:description (150–160 chars)
• Add og:image (1200x630px, < 500KB)
• Add og:url (canonical URL)
• Add og:type (website or article)
• Add og:site_name

Phase 2: Twitter Card Tags

• Add twitter:card (summary_large_image)
• Add twitter:title
• Add twitter:description
• Add twitter:image
• Add twitter:creator (@handle)
• Add twitter:site (@handle)

Phase 3: OG Image Design

• Create template (1200x630px)
• Include product name and logo
• Include tagline or page-specific headline
• Use brand colors and fonts
• Test readability at thumbnail size (300x157px)
• Generate image in WebP for performance

Phase 4: Dynamic OG Images (for blog/content pages)

• Setup dynamic OG image generation (next/og or Satori)
• Pass page title as query parameter
• Cache generated images at CDN edge
• Test 10 different page titles

Phase 5: Testing & Validation

• Test on Twitter Card Validator
• Test on Facebook Sharing Debugger
• Test on LinkedIn Post Inspector
• Test on OpenGraph.xyz
• Test by pasting URL into Slack and iMessage
• Verify image dimensions are exactly 1200x630