"The meta tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable." - http://w3schools.com

These meta tags were popular in the late 90's but have been limited since then. Some developers will stick with them while others have abandoned them. I still use them as a default. Google still has support for Description (See below), Title, Robots, Googlebot, Google-Site-Verification, Content-Type and Viewport. Some obsolete code is worth using unless it contains a security issue.

"The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook." - http://ogp.me/

There are several types of og:type. There is website, article, music and videos. Each og:type has unique meta tags that support each type. This site is set as an article and has additional properties that support the article type such as article:published_time and article:author.

Try the Facebook for Developers Sharing Debugger
Try the LinkedIn Post Inspector
Try the Pinterest Rich Pins Validator

The results are exactly what I was expecting. The image, title and description are great. Meta tag Description is limited to 200 characters while Open Graph description allows 300. Any issues with your code will be discovered while using the debugger. Use the validator each time you make an update.

This preview will be generated when the URL is typed into Facebook's create post form. Simply remove the url after the preview has been generated and type in your text. Users will click the post and will go to the defined webpage for more information.

   

View Open Graph Posts & Examples

"With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website. Simply add a few lines of markup to your webpage, and users who Tweet links to your content will have a 'Card' added to the Tweet that's visible to their followers." - http://Twitter.com

There are four types of cards. Summary Card, Summary Card with Large Image, App and Player Cards.

Try the Twitter Card Validator

The results are exactly what I was expecting. The image, title and description are great again. Twitter allows the url to be with the text of the post but won't show it. It will be replaced with the card information. There is no need to add the url then delete it like Facebook or the other Open Graph sites that generate a preview.

View Twitter Posts & Examples

"Schema.org is a collaborative, community activity with a mission to create, maintain, and promote schemas for structured data on the Internet, on web pages, in email messages, and beyond. The core vocabulary currently consists of 598 Types, 862 Properties, and 114 Enumeration values." - http://Schema.org

That's right, 598 Types, 862 Properties, and 114 Enumeration values. Some are used by millions while others are under 100. My site uses 4 schemas. Webpage, Website, Organization and Person. Adding more schema's does not guarantee a better placement, or placement at all. The same rule applies with meta tags. Keep them simple and relevant.

Try the Schema Validator by Google

The first image is a desktop version while the second graphic is a mobile search using Google.com while searching my name. The basic meta tag information is currely being used as Google will use other information on the page such as images, markup snippets and meta data to display results. My domain has been active since 2010 and has been crawled by Google since then. My Schema's are relatively new and will take time for search engines to implement.

"Schema Markup needs to be present in order for rich results to appear. Google determines when it will show the rich results, having schema markup does not guarantee they will appear. First, check to see if Google has crawled the site (which you can see in the Google Search Console structured data report) and then be patient. It can take a week or several weeks." - SearchEngineWatch.com

Watch the Big Four in action.

Meta Tags, Open Graph, Twitter Cards and Schema.org are great tools to utilize to give your site an extra boost. However, these options won't help much unless you search and share your URL often. Don't forget to use the validation tools after you make updates or changes to your meta tags as the new information will be updated on their side too.

We have covered so far...
CH 2: Meta Tags
CH 2: Open Graph
CH 2: Twitter Cards
CH 2: Schema.org

Questions, comments, want to point out errors or just want to say Hi? Please fill out the contact form below.

3/1/2019 - Chapter 1 - Hello World! - Website Upgrade
3/5/2019 - Chapter 2 - The Big 4
3/10/2019 - Chapter 3 - Mobile and Browser Support
3/12/2019 - Chapter 4 - Old School
3/16/2019 - Chapter 5 - Posting and Searching
3/22/2019 - Chapter 6 - Images and Analytics
3/24/2019 - Chapter 7 - Retrospective I
4/13/2019 - Free Basic Website Meta Tag Generator