My Head is Feeling Stuffy

Written by James McDonald

February 20, 2014

Many different interests on the web want their own Web Metadata Protocols and Schemas to allow web site operators to present data to them so they can easily place it on their pages whether it’s social networks, search engines, browsers, mobile devices there are protocols and schemas that you can embed to have a specific icon, some text or an image appear on their platforms.

Aparently Facebook uses the Open Graph Protocol http://ogp.me/ this allows you to specify the content that will be seen in the Facebook social graph. So you have to embed custom meta tags into your HTML head.

<html prefix="og: http://ogp.me/ns#">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock" />
<meta property="og:type" content="video.movie" />
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
...
</head>
...
</html>

Google likes you to embed http://Schema.org markup so it can place the sometimes seemingly random text on your webpages into the right search categories.

<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>

iPhone wants it’s own custom meta tags in the head of your HTML so you can bookmark the site with a nice icon:

 <link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://example.com/icon_button.png" />

Internet Explorer wants custom input into the head too:

<!--[if (gt IE 9)|!(IE)]>--> <html class="w3" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#"> <!--[endif]-->

<!--[if lte IE 6]>    <html class="ieAny ie6" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#">     <![endif]-->
<!--[if IE 7]>    <html class="ieAny ie7" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#">     <![endif]-->
<!--[if IE 8]>    <html class="ieAny ie8" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#">     <![endif]-->
<!--[if IE 9]>    <html class="ieAny ie9" lang="en" xml:lang="en" dir="ltr" prefix="og: http://ogp.me/ns#">     <![endif]-->

 

 

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

You May Also Like…

How to Research a CPU Upgrade

How to Research a CPU Upgrade

Upgrade Time! Doing a lot of VMWare Workstation virtualization to create labs for self-study and training. Finding...