0Pricing
HTML Academy · Lesson

OpenGraph og:title og:description og:image

Control how your page appears when shared on social networks.

What is OpenGraph?

OpenGraph is a metadata protocol introduced by Facebook so that any page can describe how it should look when shared on a social platform. Tags live in the <head> as <meta property="og:..." content="..."> pairs and are scraped by every major social network.

Core Tags

The four required-in-practice tags are og:title, og:description, og:image and og:url. Missing any of them produces an unattractive share card or, worse, a card with no preview at all that users tend to skip.

<meta property="og:title" content="Learn HTML">
<meta property="og:description" content="From DOCTYPE to Web Components.">
<meta property="og:image" content="https://example.com/og.png">
<meta property="og:url" content="https://example.com/learn">

All lessons in this course

  1. OpenGraph og:title og:description og:image
  2. Twitter Card Meta Tags
  3. JSON-LD Structured Data Basics
  4. Hreflang for International Pages
← Back to HTML Academy