Technorati Contact page

• Technorati Contact hCard markup
• hCard to vCard converter
• Link to convert hCards to vCards
• Seamless import into a typical Address Book

hCard markup example

                           http://tantek.com/
                           Tantek 
                            Çelik

                     Chief Technologist
                      http://technorati.com/
   Technorati

hCard markup example

<div              > 
 <a                  href="http://tantek.com/">
  <span                   >Tantek</span> 
  <span                    >Çelik</span>
 </a>
 <span              >Chief Technologist</span>
 <a             href="http://technorati.com/">
   Technorati</a>
</div>

hCard markup example

<div class="vcard"> 
 <a class="url fn n" href="http://tantek.com/">
  <span class="given-name">Tantek</span> 
  <span class="family-name">Çelik</span>
 </a>
 <span class="title">Chief Technologist</span>
 <a class="org" href="http://technorati.com/">
   Technorati</a>
</div>

hCard markup example

<div class="vcard">
 <a class="url fn n" href="http://tantek.com/">
  <span class="given-name">Tantek</span> 
  <span class="family-name">Çelik</span>
 </a>
 <span class="title">Chief Technologist</span>
 <a class="org" href="http://technorati.com/">
   Technorati</a>
</div>

What are Microformats?

• Microformats enable the publishing and sharing of higher fidelity information on the Web.
• Building blocks that enable users to own, control, move, and share their data on the Web.
• Small bits of (X)HTML that identify richer data types like people and events in your webpages.
• The fastest and simplest way to provide an API for your website.

Microformat: linked license

• Analogy: link to a stylesheet with rel="stylesheet"
• Thus: link to a license with rel="license"

Example: rel-license

         http://creativecommons.org/licenses/by/2.5/
         Some rights reserved. CC by-2.5.

Example: rel-license

<a 
   href="http://creativecommons.org/licenses/by/2.5/">
         Some rights reserved. CC by-2.5.
</a>

Example: rel-license

<a rel="license"
   href="http://creativecommons.org/licenses/by/2.5/">
         Some rights reserved. CC by-2.5.
</a>

Example: rel-license

<a rel="license"
   href="http://creativecommons.org/licenses/by/2.5/">
         Some rights reserved. CC by-2.5.
</a>

rel-license support

• Creative Commons (cc) license chooser
• Yahoo! (cc) search
• Google "Usage Rights" search

Microformats Principles

• solve a specific problem

• The trick.... is to make sure that each limited mechanical part of the Web, each application, is within itself composed of simple parts that will never get too powerful.

• —Tim Berners-Lee, Weaving The Web

Microformats Principles

• solve a specific problem
• simple as possible
  • evolutionary improvements
• humans first, machines second
  • presentable and parsable
  • adapt to current behaviors
• reuse from widely adopted standards
  • semantic (X)HTML, schemas from interoperable RFCs

• ...if I had insisted everyone use HTTP, this would also have been against the principle of minimal constraint. ... the Web would come as a set of ideas that could be adopted individually in combination with existing or future parts.

• ibid.

Microformats Principles

• solve a specific problem
• simple as possible
  • evolutionary improvements
• humans first, machines second
  • presentable and parsable
  • adapt to current behaviors
• reuse from widely adopted standards
  • semantic (X)HTML, schemas from interoperable RFCs
• modularity / embeddability
• decentralized development, content, services
  • explicitly encourage "spirit of the Web"

Recently released...

• May 2006: Technorati Microformats Search preview
  • search for contacts,
  • events,
  • reviews
• Pingerati.net microformat updates distributor
• June 2006: Yahoo! Local
  • Over 15 million local business listings with hCards
  • ... local events with hCalendar
  • ... reviews of businesses etc. with hReview
• Edgeio 465,000+ hListings
• BlogSkins 340,000+ user profiles with hCard
• August 2006: 5M+ Flickr photos with geo

Microformats Community

• IRC
  • irc.freenode.net #microformats
    • great place to lurk and learn
• Email
  • join microformats-discuss mailing list
  • public archives
• Blog
  • tag posts with "microformats" tag
• Wiki
  • if you find errors, please fix them, like Wikipedia
  • add examples, help research, brainstorm, etc.
  • help translate!

Microformat Exercise for the Reader

• Create your own hCard
  • Use the hCard creator
  • or use hCard authoring tips to markup your contact info
• Publish it on your site in your about/contact page
• Add a link to it in hCard New Examples
• Ping Pingerati.net with your about/contact page

Colophon

• XHTML
• CSS
• S5 v1.1xoxo
• XOXO
• hCard
• hCalendar
• rel="license"
• Some rights reserved. CC by-2.5

Thanks!

• http://microformats.org/

• http://tantek.com/presentations/2006/09/microformats-intro/

Extra stuff