<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Web 3.0, 6 Bladed Razors, 7 Minute Abs &#187; microformat</title>
	<atom:link href="http://www.zachleat.com/web/tag/microformat/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.zachleat.com/web</link>
	<description></description>
	<lastBuildDate>Fri, 30 Jul 2010 01:59:11 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Writing a Front End Engineer&#8217;s Resume (or CV)</title>
		<link>http://www.zachleat.com/web/2008/09/04/resume/</link>
		<comments>http://www.zachleat.com/web/2008/09/04/resume/#comments</comments>
		<pubDate>Fri, 05 Sep 2008 04:58:10 +0000</pubDate>
		<dc:creator>Zach Leatherman</dc:creator>
				<category><![CDATA[Branding]]></category>
		<category><![CDATA[microformat]]></category>
		<category><![CDATA[resume]]></category>

		<guid isPermaLink="false">http://www.zachleat.com/web/?p=144</guid>
		<description><![CDATA[In the United States, we usually call this document a resume, but it would appear that the international term is actually CV. There are differences, but the tips used here can be applied to both. Everyone is trying to sell something nowadays, and the most important product you can sell is yourself. My high school [...]]]></description>
			<content:encoded><![CDATA[<p><em>In the United States, we usually call this document a resume, but it would appear that the international term is actually CV.  There are differences, but the tips used here can be applied to both.</em></p>
<p>Everyone is trying to sell something nowadays, and the most important product you can sell is yourself.   My high school counselor used to tell all of her students that same advice, and unfortunately most of them became hookers. But if you&#8217;re not into prostitution, by now you&#8217;ve probably realized why so many people have said that blogs are <a href="http://www.darowski.com/tracesofinspiration/2007/03/06/the-blog-is-the-new-resume/">the</a> <a href="http://bokardo.com/archives/the-blog-is-the-new-resume/">new</a> <a href="http://greengaloshes.cc/2007/04/the-blog-as-the-new-resume/">resume</a>.  It&#8217;s true &#8211; I&#8217;ve had a few pretty meaty hooks dangled in front of my fish brain since I started this web site, and a lot of large companies are using blogs as a means of finding new talent.</p>
<p>But a blog will only get you in the front door, many employers still want to see a real resume prior to entry into the screening process.  So, why not kick your resume up a notch?  Let&#8217;s iron its pages, shave its hairy regions, and spray some web-based musk on that bad boy.</p>
<p><strong>Tips for Putting your Resume on the Web</strong></p>
<ol>
<li>Don&#8217;t use anything that generates code (that means no DreamWeaver or heaven forbid, Microsoft Word).  You want your &#8220;view source&#8221; to look like a marine&#8217;s hair cut: everything should be indented uniformly.</li>
<li>Sprinkle some microformats in there!  There is even a specific <a href="http://microformats.org/wiki/hresume">hresume</a> microformat.  Some other good microformats to use are: <a href="http://microformats.org/wiki/hcard">hcard</a> (like a personal business card, but can also be used to describe an organization as well), <a href="http://microformats.org/wiki/hcalendar">hcalendar</a> (for any dates, or date ranges: like when you were employed), <a href="http://gmpg.org/xfn/">XFN</a> (to describe relationships between people, think references), <a href="http://microformats.org/wiki/adr">adr</a> (for addresses).
<p>Of course, the good part about microformats it that there is overlap between them.  hcard uses adr and hcalendar, and hresume uses hcard, etc.</p>
<p>Some social web sites have already provided some microformats that you can use as a starting point: <a href="http://www.linkedin.com/pub/7/b8a/237">Linked-in has an hresume</a> for every profile, and <a href="http://twitter.com/zachleat">twitter has a hcard</a> that you can pilfer.</li>
<li>Add a favicon.  As the <a href="http://developer.yahoo.com/performance/rules.html#favicon">Yahoo Performance team suggests</a>, the browser is still going to request one, even if one isn&#8217;t in the markup, so you might as well have one.</li>
<li>Pick your DOCTYPE carefully.  Make sure it&#8217;s not one of the &#8220;loose&#8221; ones, for obvious prostitution-based reasons described above &#8212; the stricter the better.  Whatever DOCTYPE you decide to use, make sure your markup validates properly.  No mistakes here.  I chose to serve my document using HTML 4.01 Strict as text/html with UTF-8 encoding.</li>
<li>Your handwritten CSS should validate as well.  If you have some library code that misses the mark in a few places, I think that&#8217;s okay.  Remember: <em>a good coder codes, a great coder re-uses.</em></li>
<li>Make sure it looks good when your future employer prints out 500 copies to pass around the company as an example of the best resume he&#8217;s ever laid his eyes on.  Add a media=&#8221;print&#8221; stylesheet to beautify the print layout.</li>
<li>Make sure it all validates, loads fast, and doesn&#8217;t have any broken links.  I like to use YSlow to test my page weight and see my ranking.</li>
</ol>
<p>Bombs away!  Those are the tips I followed to create <a href="http://www.zachleat.com/resume/">my web-based resume</a>.  It has a YSlow score of 89, is 17.2K in size with 5 HTTP requests, and validates as <a href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.zachleat.com%2Fresume%2F">HTML 4.01 Strict</a>, and my non-library CSS is valid <a href="http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.zachleat.com%2Fresume">CSS 2.1</a> (I&#8217;m also using YUI CSS for layout, which doesn&#8217;t validate).</p>
<p>Once you&#8217;re finished, hresume even has a <a href="http://microformats.org/wiki/hresume-examples-in-wild">public wiki page</a> where they let you post your resume.  Have fun, or get rich trying!</p>
<p><b>Update</b>: grammar nazi cullination.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.zachleat.com/web/2008/09/04/resume/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Double Whammy: OpenID and Microformats</title>
		<link>http://www.zachleat.com/web/2008/05/23/double-whammy-openid-and-microformats/</link>
		<comments>http://www.zachleat.com/web/2008/05/23/double-whammy-openid-and-microformats/#comments</comments>
		<pubDate>Fri, 23 May 2008 06:13:01 +0000</pubDate>
		<dc:creator>Zach Leatherman</dc:creator>
				<category><![CDATA[Application Design]]></category>
		<category><![CDATA[Interface Design]]></category>
		<category><![CDATA[Flickr]]></category>
		<category><![CDATA[hCard]]></category>
		<category><![CDATA[microformat]]></category>
		<category><![CDATA[OpenID]]></category>
		<category><![CDATA[Technorati]]></category>
		<category><![CDATA[Twitter]]></category>

		<guid isPermaLink="false">http://www.zachleat.com/web/?p=141</guid>
		<description><![CDATA[<a href="http://www.ownyouridentity.com/2008/04/30/get-satisfactions-nice-import-profile-feature/">Own your Identity had a great post today</a> detailing a great feature on the signup form of the <a href="http://getsatisfaction.com/people/new">Get Satisfaction</a> site.

They rely on the fact that sites like Twitter and Flickr publish an <a href="http://microformats.org/wiki/hcard">hCard microformat</a> for all of their users publicly on their website.]]></description>
			<content:encoded><![CDATA[<h3>Microformategery</h3>
<p><a href="http://www.ownyouridentity.com/2008/04/30/get-satisfactions-nice-import-profile-feature/">Own your Identity had a great post today</a> detailing a great feature on the signup form of the <a href="http://getsatisfaction.com/people/new">Get Satisfaction</a> site.</p>
<p>They rely on the fact that sites like Twitter and Flickr publish an <a href="http://microformats.org/wiki/hcard">hCard microformat</a> for all of their users publicly on their website.  If you go to <a href="http://twitter.com/zachleat/">my twitter page</a> and view the source, you&#8217;ll find the following code available to anyone (without authentication):</p>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">&lt;address&gt;
   &lt;ul class=&quot;about vcard entry-author&quot;&gt;
      &lt;li&gt;&lt;span class=&quot;label&quot;&gt;Name&lt;/span&gt; &lt;span class=&quot;fn&quot;&gt;Zach Leatherman&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class=&quot;label&quot;&gt;Location&lt;/span&gt; &lt;span class=&quot;adr&quot;&gt;Omaha, NE USA&lt;/span&gt;&lt;/li&gt;
      &lt;li&gt;&lt;span class=&quot;label&quot;&gt;Web&lt;/span&gt; &lt;a href=&quot;http://www.zachleat.com/&quot; class=&quot;url&quot; rel=&quot;me&quot;&gt;http://www.zachle...&lt;/a&gt;&lt;/li&gt;
      &lt;li id=&quot;bio&quot;&gt;&lt;span class=&quot;label&quot;&gt;Bio&lt;/span&gt; &lt;span class=&quot;bio&quot;&gt;UI Programmer, JavaScript Enthusiast, Soccer Hooligan&lt;/span&gt;&lt;/li&gt;
   &lt;/ul&gt;
&lt;/address&gt;</pre></div></div>

<p>The premise here is that hCard tells you how to parse this markup to get usable information.  The <code>adr</code> CSS class tells you what my address is.  The <code>fn</code> CSS class tells you what my name is, and so on.  So, Get Satisfaction goes and spiders this page behind the scenes and autopopulates your profile with what it can find.  Pretty sweet.</p>
<p>Now, they don&#8217;t limit you to the services they provide, which are: Flickr, Technorati, Twitter, Upcoming, and last.fm.  They provide an Other category for any hCard enabled URL (your personal homepage or perhaps an <a href="http://microformats.org/wiki/hresume">hResume</a> you have posted on the web).</p>
<h3>Integrate with OpenID</h3>
<p>However, why not take it to the next level?  Why not integrate this microformat functionality WITH an openid login system?  You&#8217;d be able to kill two birds (not a twitter joke) with one stone in some cases, since both Twitter and Technorati are also OpenID producers (re-echo: We need more consumers).</p>
<p>So, not only do you get the benefits of having OpenID authentication on your website, but you&#8217;d be able to prepopulate a certain amount of profile data with an hCard parser.  And the best part is, if you already have a <a href="http://remysharp.com/2008/04/24/stop-using-openid-why-how/">nice clean user interface</a> set up to handle different OpenID producers, there wouldn&#8217;t be any additional clutter on the interface to get this benefit.  It&#8217;d be transparent to the user when it works, and fall back to a normal empty profile form when it doesn&#8217;t.</p>
<p>What I&#8217;d like to see, is more sites that are OpenID producers, also serve hCard microformats as well.  If we can get all the major producers on board, we&#8217;d have a nice tidy little system going.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.zachleat.com/web/2008/05/23/double-whammy-openid-and-microformats/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
