Open Graph Tags: Get Perfect Social Media Previews

Why Open Graph Tags Matter

Open Graph tags control how your content appears when shared on social media platforms like Facebook, LinkedIn, and Twitter. Without proper Open Graph tags, social platforms will auto-generate previews from your page content, often producing ugly, truncated, or irrelevant previews that fail to attract clicks.

Essential OG Tags

og:title: The title that appears in the social media preview. Keep it under 60 characters. og:description: The description text shown below the title. Keep it under 160 characters. og:image: The image displayed in the preview. Use 1200x630px for best results. og:url: The canonical URL of the page. og:type: The content type: article, website, product, etc.

Image Specifications

Use 1200x630px for the best results across all platforms. This resolution ensures your image displays correctly on Facebook, LinkedIn, Twitter, and Pinterest. Keep file sizes under 1MB for fast loading. Use JPG for photographs and PNG for graphics with text or transparency.

Twitter Card Tags

In addition to Open Graph tags, Twitter uses its own meta tags for enhanced previews. Use twitter:card set to "summary_large_image" for the best visual presentation. Include twitter:site for your Twitter handle and twitter:creator for the author's handle.

Testing and Validation

Use Facebook's Sharing Debugger and Twitter's Card Validator to test your Open Graph tags before publishing. These tools show you exactly how your content will appear when shared and flag any missing or incorrect tags.