feat(web): dynamic OG + Twitter card images via next/og
app/opengraph-image.tsx (new):
- next/og ImageResponse, 1200x630 PNG
- Dark #0a0a0a background + cyan #00d4ff brand wordmark + headline
+ install command pill + terminal cursor
- Google Fonts loadGoogleFont helper for Geist 400/700 +
Geist Mono 500 (runtime fetch, Cloudflare Workers compatible)
- Cache-Control: public, immutable, max-age=31536000
app/twitter-image.tsx (new):
- Same shape as OG with Twitter-card alt text
- Inherits twitter:card=summary_large_image from layout
app/layout.tsx:
- metadata.alternates.languages: explicit canonical URLs for en/ko/
ja/zh so search engines pick up hreflang
- metadata.openGraph.alternateLocale: ko_KR, ja_JP, zh_CN
- Drop manual openGraph.images / twitter.images: file-based metadata
convention now auto-emits og:image:width, og:image:height,
og:image:type, twitter:image:width, twitter:image:height
- metadata.robots: max-image-preview=large, max-snippet=-1
(richer SERP previews)
Verified: curl /opengraph-image returns 200, content-type image/png,
1200x630 PNG body. All 4 hreflang links present in <head>.
YeonGyu-Kim
623af75962
