Open Graph và Twitter Cards kiểm soát preview khi share link trên social media — share preview đẹp → nhiều click → nhiều traffic → nhiều backlinks → ranking tăng gián tiếp.
Open Graph (OG): meta tags chuẩn Facebook để kiểm soát preview trên Facebook, LinkedIn, Zalo, Telegram. Tags quan trọng: og:title, og:description, og:image (1200x630px recommended), og:url, og:type.
Twitter Cards: tương tự OG nhưng cho Twitter/X — twitter:card ('summary_large_image' phổ biến nhất), twitter:title, twitter:description, twitter:image.
Trong Next.js App Router: dùng metadata export hoặc generateMetadata() — Next.js tự generate OG và Twitter meta tags. Dynamic OG images: dùng opengraph-image.tsx (hoặc @vercel/og) để generate image động chứa title, author, date.
Open Graph and Twitter Cards control how links preview on social media — a compelling share preview drives more clicks, more traffic, more backlinks, and indirectly higher rankings.
Open Graph (OG): Facebook's standard meta tags for controlling link previews on Facebook, LinkedIn, Zalo, Telegram. Key tags: og:title, og:description, og:image (1200x630px recommended), og:url, og:type.
Twitter Cards: similar to OG but specific to Twitter/X — twitter:card ('summary_large_image' is most common), twitter:title, twitter:description, twitter:image.
In Next.js App Router: use metadata export or generateMetadata() — Next.js automatically generates OG and Twitter meta tags. Dynamic OG images: use opengraph-image.tsx (or @vercel/og) to generate dynamic images that include the title, author, and date.