Open Graph tags are HTML meta tags used to control how your webpage appears when it is shared on social media platforms like Facebook, WhatsApp, LinkedIn, and others.
What are Open Graph Tags
Open Graph tags provide structured information about your webpage, such as title, description, image, and URL. This helps social media platforms display rich previews when a link is shared.
Why Open Graph Tags are Important
They improve the appearance of shared links.
They increase click-through rates on social media.
They help your content look professional and attractive when shared.
og:title Tag
The og:title tag defines the title that will appear in the social media preview.
Example
<meta property=”og:title” content=”Learn HTML Training Program”>
og:description Tag
The og:description tag provides a short description of the page content.
Example
<meta property=”og:description” content=”Complete HTML course from beginner to advanced level.”>
og:image Tag
The og:image tag defines the image that will be shown in the preview.
Example
<meta property=”og:image” content=”https://example.com/image.jpg”>
og:url Tag
The og:url tag defines the exact URL of the webpage.
Example
<meta property=”og:url” content=”https://example.com/page”>
Where Open Graph Tags are Used
They are placed inside the <head> section of an HTML page. Social media platforms automatically read these tags when a link is shared.
Best Practices
Use high-quality images for previews.
Keep titles and descriptions short and clear.
Use correct and updated URLs.
Make sure every important page has Open Graph tags.
Summary
Open Graph tags control how your webpage looks when shared on social media. They improve visibility, engagement, and presentation of your content online.