DEV Community

loading...

What is Open Graph Protocol and how to create Twitter Cards?

Gabriel Lazcano
・1 min read

Link to original article with code snippets (recommended): https://gabriellazcano.com/blog/what-is-open-graph-protocol-and-how-to-create-twitter-cards/

Have you ever seen Twitter links that have a preview to the content? Those links are using Open Graph Protocol. This is something that I literally found out today, as I was asking a fellow blogger Flavio Copes, recommended btw. Apparently is a very common practice but it doesn’t get used so often by new web developers and can make your content stand out.

What is Open Graph Protocol?

Open Graph is an internet protocol that was originally created by Facebook to standardize the use of metadata within a webpage to represent the content of a page.

Within it, you can provide details as simple as the title of a page or as specific as the duration of a video. These pieces all fit together to form a representation of each individual page of the internet.

Why to use it?

As I said before it makes your content stand out, which is obviously what we want on the internet. Not using a content rich link can make us lose potential traffic we could have had.

Discussion (0)