ericatkinson · January 25, 2011 17:02 · Nov 24, 2010 · Sep 16, 2010 · Sep 16, 2010 · Sep 16, 2010
diff --git a/gistfile1.html b/gistfile1.html
@@ -51,6 +51,14 @@
     <meta name="msapplication-task" content="name=Task 2;action-uri=http://microsoft.com/Page2.html;icon-uri=http://host/icon2.ico"/>
 
 
+    <!-- Facebook and others will use the following data to represent your site
+         when it is shared (<meta>s are strictly for Facebook). 
+         Facebook documentation (includes info on sharing more specific media types): http://developers.facebook.com/docs/share -->
+    <meta property="og:title" content="" />
+    <meta property="og:description" content="" />
+    <meta property="og:image" content="" />
+    <link rel="image_src" href="" />
+
     <!-- Signal to search engines and others "Use this URL for this page!"
          Useful when URLs are dynamically generated. -->
     <link rel="canonical" href="" />
@@ -61,9 +69,7 @@
          http://microformats.org/wiki/rel-shortlink -->
     <link rel="shortlink" href="" />
 
-    <!-- Facebook and others will use this image to represent your site
-         when it is shared. -->
-    <link rel="image_src" href="" />
+
 
     <!-- Sites with search functionality should be strongly considered for a
          browser search plugin.

diff --git a/gistfile1.html b/gistfile1.html
@@ -45,7 +45,7 @@
     <meta name="msapplication-window" content="width=800;height=600"/>
 
     <!-- Define Jump List tasks that will appear when the pinned site's
-         icon gets a right-click. Each "task" goes to its own URL,
+         icon gets a right-click. Each "task" goes to the specified URL,
          and gets its own mini icon (essentially a favicon, a 16x16 .ICO). -->
     <meta name="msapplication-task" content="name=Task 1;action-uri=http://host/Page1.html;icon-uri=http://host/icon1.ico"/>
     <meta name="msapplication-task" content="name=Task 2;action-uri=http://microsoft.com/Page2.html;icon-uri=http://host/icon2.ico"/>

diff --git a/> → gistfile1.html b/> → gistfile1.html
diff --git a/Helpful Things to Keep in Your <head/> → > b/Helpful Things to Keep in Your <head/> → >
@@ -18,7 +18,8 @@
 
 
     <!-- IE9 Pinned Site Settings!
-         Documentation: http://msdn.microsoft.com/en-ca/library/gg131029(VS.85).aspx -->
+         Documentation: http://msdn.microsoft.com/en-ca/library/gg131029(VS.85).aspx
+         See the documentation for JavaScript APIs, as well. -->
 
     <!-- Pinned site name, as Windows sees it - this will be the page title
          by default, unless you include this rule. -->
@@ -28,7 +29,9 @@
     <meta name="msapplication-tooltip" content="A description of what this site does." />
 
     <!-- If the site should go to a specific URL when it is pinned (such as
-         the homepage), enter it here. -->
+         the homepage), enter it here.
+         One idea is to send it to a special URL so you can track # of pinned users,
+         like so: http://www.example.com/index.html?pinned=true -->
     <meta name="msapplication-starturl" content="" />
 
     <!-- IE9 will automatically use the overall color of your site's favicon to

diff --git a/gistfile1.html → Helpful Things to Keep in Your <head/> b/gistfile1.html → Helpful Things to Keep in Your <head/>
@@ -16,6 +16,38 @@
          interfere with certain designs. -->
     <meta http-equiv="imagetoolbar" content="false" />
 
+
+    <!-- IE9 Pinned Site Settings!
+         Documentation: http://msdn.microsoft.com/en-ca/library/gg131029(VS.85).aspx -->
+
+    <!-- Pinned site name, as Windows sees it - this will be the page title
+         by default, unless you include this rule. -->
+    <meta name="application-name" content="Sample Title" />
+
+    <!-- Pinned shortcuts also get a tooltip - this is it. -->
+    <meta name="msapplication-tooltip" content="A description of what this site does." />
+
+    <!-- If the site should go to a specific URL when it is pinned (such as
+         the homepage), enter it here. -->
+    <meta name="msapplication-starturl" content="" />
+
+    <!-- IE9 will automatically use the overall color of your site's favicon to
+         shade its browser buttons.  UNLESS you give it another color here.
+         Only use named colors ("red") or hex colors ("#f00"). -->
+    <meta name="msapplication-navbutton-color" content=""/>
+
+    <!-- If the site should open at a certain window size once
+         pinned, you can specify the dimensions here.
+         It only supports static pixel dimensions. 800x600 minimum. -->
+    <meta name="msapplication-window" content="width=800;height=600"/>
+
+    <!-- Define Jump List tasks that will appear when the pinned site's
+         icon gets a right-click. Each "task" goes to its own URL,
+         and gets its own mini icon (essentially a favicon, a 16x16 .ICO). -->
+    <meta name="msapplication-task" content="name=Task 1;action-uri=http://host/Page1.html;icon-uri=http://host/icon1.ico"/>
+    <meta name="msapplication-task" content="name=Task 2;action-uri=http://microsoft.com/Page2.html;icon-uri=http://host/icon2.ico"/>
+
+
     <!-- Signal to search engines and others "Use this URL for this page!"
          Useful when URLs are dynamically generated. -->
     <link rel="canonical" href="" />
@@ -56,4 +88,4 @@
          Notifies of inefficient selectors and other ego-breaking things. -->
     <script src="js/jquery.lint.js"></script>
 
-    </body>
+  </body>
diff --git a/HTML5 - Helpful things to keep in your <head/> b/HTML5 - Helpful things to keep in your <head/>
@@ -1,42 +0,0 @@
-<!DOCTYPE html> <!-- Helpful things to keep in your <head/> // Brian Blakely, 360i -->
-	<head>
-		<!-- According to Heather Champ, former community manager at flickr,
-		     you should not allow search engines to index your "Contact Us"
-		     or "Complaints" page if you value your sanity. This is an HTML-
-		     centric way of achieving that. -->
-		<meta name="robots" content="noindex" />
-
-		<!-- Suppress IE6's pop-up-on-mouseover toolbar for images, that can
-		     interfere with certain designs. -->
-		<meta http-equiv="imagetoolbar" content="false" />
-
-		<!-- Signal to search engines and others "Use this URL for this page!"
-		     Useful when URLs are dynamically generated. -->
-		<link rel="canonical" href="" />
-
-		<!-- Signal to the world "This is the shortURL for this page!"
-		     Poorly supported at this time.
-
-		     http://microformats.org/wiki/rel-shortlink -->
-		<link rel="shortlink" href="" />
-
-		<!-- Facebook and others will use this image to represent your site
-		     when it is shared. -->
-		<link rel="image_src" href="" />
-
-		<!-- Sites with search functionality should be strongly considered for a
-		     browser search plugin.
-
-		     How to make a browser search plugin: 
-		     http://www.google.com/search?ie=UTF-8&q=how+to+make+browser+search+plugin -->
-		<link rel="search" title="" type="application/opensearchdescription+xml" href="" />
-
-		<!-- Let's help Mother Nature and link to a local copy of jQuery
-		     until our project is ready for launch. -->
-		<!--script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script-->
-		<script src="js/jquery-1.4.2.js"></script>
-
-		<!-- jQuery Lint for the performance-tweaking stages of your project.
-		     Notifies of inefficient selectors and other ego-breaking things. -->
-		<script src="js/jquery.lint.js"></script>
-	</head>

diff --git a/gistfile1.html b/gistfile1.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html> 
+
+<!-- Helpful things to keep in your <head/> 
+  // Brian Blakely, 360i 
+  // http://twitter.com/brianblakely/  
+-->
+  <head>
+
+    <!-- According to Heather Champ, former community manager at flickr,
+         you should not allow search engines to index your "Contact Us"
+         or "Complaints" page if you value your sanity. This is an HTML-
+         centric way of achieving that. -->
+    <meta name="robots" content="noindex" />
+
+    <!-- Suppress IE6's pop-up-on-mouseover toolbar for images, that can
+         interfere with certain designs. -->
+    <meta http-equiv="imagetoolbar" content="false" />
+
+    <!-- Signal to search engines and others "Use this URL for this page!"
+         Useful when URLs are dynamically generated. -->
+    <link rel="canonical" href="" />
+
+    <!-- Signal to the world "This is the shortURL for this page!"
+         Poorly supported at this time.
+       
+         http://microformats.org/wiki/rel-shortlink -->
+    <link rel="shortlink" href="" />
+
+    <!-- Facebook and others will use this image to represent your site
+         when it is shared. -->
+    <link rel="image_src" href="" />
+
+    <!-- Sites with search functionality should be strongly considered for a
+         browser search plugin.
+       
+         How to make a browser search plugin: 
+         http://www.google.com/search?ie=UTF-8&q=how+to+make+browser+search+plugin -->
+    <link rel="search" title="" type="application/opensearchdescription+xml" href="" />
+
+  </head>
+
+  <body>
+
+
+
+    <!--  ... -->
+
+
+
+    <!-- Let's help Mother Nature and link to a local copy of jQuery
+         until our project is ready for launch. -->
+    <!--script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script-->
+    <script src="js/jquery-1.4.2.js"></script>
+
+    <!-- jQuery Lint for the performance-tweaking stages of your project.
+         Notifies of inefficient selectors and other ego-breaking things. -->
+    <script src="js/jquery.lint.js"></script>
+
+    </body>
diff --git a/HTML5 - Helpful things to keep in your <head/> b/HTML5 - Helpful things to keep in your <head/>
@@ -0,0 +1,42 @@
+<!DOCTYPE html> <!-- Helpful things to keep in your <head/> // Brian Blakely, 360i -->
+	<head>
+		<!-- According to Heather Champ, former community manager at flickr,
+		     you should not allow search engines to index your "Contact Us"
+		     or "Complaints" page if you value your sanity. This is an HTML-
+		     centric way of achieving that. -->
+		<meta name="robots" content="noindex" />
+
+		<!-- Suppress IE6's pop-up-on-mouseover toolbar for images, that can
+		     interfere with certain designs. -->
+		<meta http-equiv="imagetoolbar" content="false" />
+
+		<!-- Signal to search engines and others "Use this URL for this page!"
+		     Useful when URLs are dynamically generated. -->
+		<link rel="canonical" href="" />
+
+		<!-- Signal to the world "This is the shortURL for this page!"
+		     Poorly supported at this time.
+
+		     http://microformats.org/wiki/rel-shortlink -->
+		<link rel="shortlink" href="" />
+
+		<!-- Facebook and others will use this image to represent your site
+		     when it is shared. -->
+		<link rel="image_src" href="" />
+
+		<!-- Sites with search functionality should be strongly considered for a
+		     browser search plugin.
+
+		     How to make a browser search plugin: 
+		     http://www.google.com/search?ie=UTF-8&q=how+to+make+browser+search+plugin -->
+		<link rel="search" title="" type="application/opensearchdescription+xml" href="" />
+
+		<!-- Let's help Mother Nature and link to a local copy of jQuery
+		     until our project is ready for launch. -->
+		<!--script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script-->
+		<script src="js/jquery-1.4.2.js"></script>
+
+		<!-- jQuery Lint for the performance-tweaking stages of your project.
+		     Notifies of inefficient selectors and other ego-breaking things. -->
+		<script src="js/jquery.lint.js"></script>
+	</head>