Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards.Microformats.org [4]
<div class="vcard"> <a class="fn org url" href="http://www.commerce.net/">CommerceNet</a> <div class="adr"> <span class="type">Work</span>: <div class="street-address">169 University Avenue</div> <span class="locality">Palo Alto</span>, <abbr class="region" title="California">CA</abbr> <span class="postal-code">94301</span> <div class="country-name">USA</div> </div> <div class="tel"> <span class="type">Work</span> +1-650-289-4040 </div> <div class="tel"> <span class="type">Fax</span> +1-650-289-4041 </div> <div>Email: <span class="email">info@commerce.net</span> </div> </div>
<?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>hCalendar</title> <meta name="AUTHOR" content="Jose M Vidal"></meta> <meta name="GENERATOR" content="xslides.el, written by J.M. Vidal"></meta> <link rel="next" href="hreview.html" title="hReview"/> <link rel="previous" href="exampleshcard.html" title="Examples: hCard"/> <link rel="author" href="../../index.html" title="Jose M Vidal"/> <link rel="parent" href="index.html" title="Index"/> <link rel="top" href="../index.html" title="Presentation List"/> <link rel="stylesheet" type="text/css" href="../xslides-medwhite.css" title="White" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-medblue.css" title="Blue" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-usc.css" title="USCTheme" media="all" /> <script type="text/javascript" src="../scripts/stylehelper.js"></script> <script type="text/javascript" src="../scripts/jquery.js"></script> <script type="text/javascript" src="../scripts/jquery-ui.js"></script> <link rel="stylesheet" href="../lightbox.css" type="text/css" media="screen"/> </head> <body> <div class="navbar"> <p> <a onclick="javascript:this.href=getURL('exampleshcard.html');return true;" rel="prev" href="exampleshcard.html" accesskey="P" title="Examples: hCard">←</a> <a rel="index" href="index.html" onclick="javascript:this.href=getURL('index.html');return true;" accesskey="I" title="Index Page">^</a> <a rel="next" href="hreview.html" onclick="javascript:this.href=getURL('hreview.html');return true;" accesskey="N" title="hReview">→</a> </p> </div> <div class="talktitle"><p>Microformats</p></div> <h1 class="slide">hCalendar</h1> <div class="slidebody"> <ul> <li>The <a class="remote" href="http://microformats.org/wiki/hcalendar">hCalendar</a> format is based on <a class="remote" href="http://www.ietf.org/rfc/rfc2445.txt">iCalendar</a> and lets us publish events. </li> </ul> <pre> <span class="type"><div class=</span><span class="string">"vevent"</span><span class="type">></span> <span class="keyword"><a class=</span><span class="string">"url"</span><span class="keyword"> href=</span><span class="string">"http://www.web2con.com/"</span><span class="keyword">></span>http://www.web2con.com/<span class="keyword"></a></span> <span class="type"><span class=</span><span class="string">"summary"</span><span class="type">></span>Web 2.0 Conference<span class="type"></span></span>: <span class="type"><abbr class=</span><span class="string">"dtstart"</span><span class="type"> title=</span><span class="string">"2007-10-05"</span><span class="type">></span>October 5<span class="type"></abbr></span>- <span class="type"><abbr class=</span><span class="string">"dtend"</span><span class="type"> title=</span><span class="string">"2007-10-20"</span><span class="type">></span>19<span class="type"></abbr></span>, at the <span class="type"><span class=</span><span class="string">"location"</span><span class="type">></span>Argent Hotel, San Francisco, CA<span class="type"></span></span> <span class="type"></div></span> </pre> </div><hr class="bottom"/> <p class="author"><a href="../../index.html">José M. Vidal</a> <a href=" http://validator.w3.org/check?uri=http://jmvidal.cse.sc.edu/talks/microformats/hcalendar.html">.</a></p> <p class="pagenumber">3 of 9</p> </body> </html>
<?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>hReview</title> <meta name="AUTHOR" content="Jose M Vidal"></meta> <meta name="GENERATOR" content="xslides.el, written by J.M. Vidal"></meta> <link rel="next" href="xfn.html" title="XFN"/> <link rel="previous" href="hcalendar.html" title="hCalendar"/> <link rel="author" href="../../index.html" title="Jose M Vidal"/> <link rel="parent" href="index.html" title="Index"/> <link rel="top" href="../index.html" title="Presentation List"/> <link rel="stylesheet" type="text/css" href="../xslides-medwhite.css" title="White" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-medblue.css" title="Blue" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-usc.css" title="USCTheme" media="all" /> <script type="text/javascript" src="../scripts/stylehelper.js"></script> <script type="text/javascript" src="../scripts/jquery.js"></script> <script type="text/javascript" src="../scripts/jquery-ui.js"></script> <link rel="stylesheet" href="../lightbox.css" type="text/css" media="screen"/> </head> <body> <div class="navbar"> <p> <a onclick="javascript:this.href=getURL('hcalendar.html');return true;" rel="prev" href="hcalendar.html" accesskey="P" title="hCalendar">←</a> <a rel="index" href="index.html" onclick="javascript:this.href=getURL('index.html');return true;" accesskey="I" title="Index Page">^</a> <a rel="next" href="xfn.html" onclick="javascript:this.href=getURL('xfn.html');return true;" accesskey="N" title="XFN">→</a> </p> </div> <div class="talktitle"><p>Microformats</p></div> <h1 class="slide">hReview</h1> <div class="slidebody"> <ul> <li>The <a class="remote" href="http://microformats.org/wiki/hreview">hReview</a> lets you embed product reviews. </li> </ul> <pre> <span class="type"><div class=</span><span class="string">"hreview"</span><span class="type">></span> <span class="type"><span><span class=</span><span class="string">"rating"</span><span class="type">></span>5<span class="type"></span></span> out of 5 stars<span class="type"></span></span> <span class="type"><h4 class=</span><span class="string">"summary"</span><span class="type">></span><span class="html-helper-bold">Crepes on Cole is awesome</span><span class="type"></h4></span> <span class="type"><span class=</span><span class="string">"reviewer vcard"</span><span class="type">></span>Reviewer: <span class="type"><span class=</span><span class="string">"fn"</span><span class="type">></span>Tantek<span class="type"></span></span> - <span class="type"><abbr class=</span><span class="string">"dtreviewed"</span><span class="type"> title=</span><span class="string">"20050418T2300-0700"</span><span class="type">></span>April 18, 2005<span class="type"></abbr></span></span> <span class="type"><div class=</span><span class="string">"description item vcard"</span><span class="type">><p></span> <span class="type"><span class=</span><span class="string">"fn org"</span><span class="type">></span>Crepes on Cole<span class="type"></span></span> is one of the best little creperies in <span class="type"><span class=</span><span class="string">"adr"</span><span class="type">><span class=</span><span class="string">"locality"</span><span class="type">></span>San Francisco<span class="type"></span></span></span>. Excellent food and service. Plenty of tables in a variety of sizes for parties large and small. Window seating makes for excellent people watching to/from the N-Judah which stops right outside. I've had many fun social gatherings here, as well as gotten plenty of work done thanks to neighborhood WiFi. <span class="type"></p></div></span> <span class="type"><p></span>Visit date: <span class="type"><span></span>April 2005<span class="type"></span></p></span> <span class="type"><p></span>Food eaten: <span class="type"><span></span>Florentine crepe<span class="type"></span></p></span> <span class="type"></div></span> <span class="type"><div class=</span><span class="string">"hreview"</span><span class="type">><span class=</span><span class="string">"item"</span><span class="type">></span> <span class="keyword"><a class=</span><span class="string">"url fn"</span><span class="keyword"> href=</span><span class="string">"http://www.amazon.com/exec/obidos/ASIN/B000089CJI/"</span><span class="keyword">></span> <span class="html-helper-significant-tag"><img src=</span><span class="string">"http://images.amazon.com/images/P/B000089CJI.01._SCTHUMBZZZ_.jpg"</span><span class="html-helper-significant-tag"> alt=</span><span class="string">"Album cover photo: The Postal Service: Give Up. "</span><span class="html-helper-significant-tag"> class=</span><span class="string">"photo"</span><span class="html-helper-significant-tag"> /></span> The Postal Service: Give Up<span class="keyword"></a></span><span class="type"></span></span> <span class="type"><div class=</span><span class="string">"description"</span><span class="type">><p></span> "The people thought they were just being rewarded for treating others as they like to be treated, for obeying stop signs and curing diseases, for mailing letters with the address of the sender... Don't wake me, I plan on sleeping in..." <span class="type"></p><p></span> "Nothing Better" is a great track on this album, too... <span class="type"></p></div></span> (<span class="type"><abbr class=</span><span class="string">"rating"</span><span class="type"> title=</span><span class="string">"5"</span><span class="type">></span>*****<span class="type"></abbr></span>) <span class="type"><p class=</span><span class="string">"reviewer vcard"</span><span class="type">></span>Review by <span class="keyword"><a class=</span><span class="string">"url fn"</span><span class="keyword"> href=</span><span class="string">"http://ifindkarma.com/blog/"</span><span class="keyword">></span>Adam Rifkin<span class="keyword"></a></span>, <span class="type"><abbr class=</span><span class="string">"dtreviewed"</span><span class="type"> title=</span><span class="string">"200502"</span><span class="type">></span>February 2005<span class="type"></abbr></span> <span class="type"></p></span> <span class="type"></div></span> </pre> </div><hr class="bottom"/> <p class="author"><a href="../../index.html">José M. Vidal</a> <a href=" http://validator.w3.org/check?uri=http://jmvidal.cse.sc.edu/talks/microformats/hreview.html">.</a></p> <p class="pagenumber">4 of 9</p> </body> </html>
<?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>XFN</title> <meta name="AUTHOR" content="Jose M Vidal"></meta> <meta name="GENERATOR" content="xslides.el, written by J.M. Vidal"></meta> <link rel="next" href="xoxo.html" title="XOXO"/> <link rel="previous" href="hreview.html" title="hReview"/> <link rel="author" href="../../index.html" title="Jose M Vidal"/> <link rel="parent" href="index.html" title="Index"/> <link rel="top" href="../index.html" title="Presentation List"/> <link rel="stylesheet" type="text/css" href="../xslides-medwhite.css" title="White" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-medblue.css" title="Blue" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-usc.css" title="USCTheme" media="all" /> <script type="text/javascript" src="../scripts/stylehelper.js"></script> <script type="text/javascript" src="../scripts/jquery.js"></script> <script type="text/javascript" src="../scripts/jquery-ui.js"></script> <link rel="stylesheet" href="../lightbox.css" type="text/css" media="screen"/> </head> <body> <div class="navbar"> <p> <a onclick="javascript:this.href=getURL('hreview.html');return true;" rel="prev" href="hreview.html" accesskey="P" title="hReview">←</a> <a rel="index" href="index.html" onclick="javascript:this.href=getURL('index.html');return true;" accesskey="I" title="Index Page">^</a> <a rel="next" href="xoxo.html" onclick="javascript:this.href=getURL('xoxo.html');return true;" accesskey="N" title="XOXO">→</a> </p> </div> <div class="talktitle"><p>Microformats</p></div> <h1 class="slide">XFN</h1> <div class="slidebody"> <ul> <li>The <a class="remote" href="http://www.gmpg.org/xfn/">XHTML Friends Network</a> lets you classify and link friends. </li> </ul> <pre> <span class="keyword"><a href=</span><span class="string">"http://jane-blog.example.org/"</span><span class="keyword"> rel=</span><span class="string">"sweetheart date met"</span><span class="keyword">></span><span class="html-helper-link">Jane</span><span class="keyword"></a></span> <span class="keyword"><a href=</span><span class="string">"http://dave-blog.example.org/"</span><span class="keyword"> rel=</span><span class="string">"friend met"</span><span class="keyword">></span><span class="html-helper-link">Dave</span><span class="keyword"></a></span> <span class="keyword"><a href=</span><span class="string">"http://darryl-blog.example.org/"</span><span class="keyword"> rel=</span><span class="string">"friend met"</span><span class="keyword">></span><span class="html-helper-link">Darryl</span><span class="keyword"></a></span> <span class="keyword"><a href=</span><span class="string">"http://www.metafilter.com/"</span><span class="keyword">></span><span class="html-helper-link">MetaFilter</span><span class="keyword"></a></span> <span class="keyword"><a href=</span><span class="string">"http://james-blog.example.com/"</span><span class="keyword"> rel=</span><span class="string">"met"</span><span class="keyword">></span><span class="html-helper-link">James Expert</span><span class="keyword"></a></span> </pre> </div><hr class="bottom"/> <p class="author"><a href="../../index.html">José M. Vidal</a> <a href=" http://validator.w3.org/check?uri=http://jmvidal.cse.sc.edu/talks/microformats/xfn.html">.</a></p> <p class="pagenumber">5 of 9</p> </body> </html>
<?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>XOXO</title> <meta name="AUTHOR" content="Jose M Vidal"></meta> <meta name="GENERATOR" content="xslides.el, written by J.M. Vidal"></meta> <link rel="next" href="microformatsvssemanticweb.html" title="Microformats vs Semantic Web"/> <link rel="previous" href="xfn.html" title="XFN"/> <link rel="author" href="../../index.html" title="Jose M Vidal"/> <link rel="parent" href="index.html" title="Index"/> <link rel="top" href="../index.html" title="Presentation List"/> <link rel="stylesheet" type="text/css" href="../xslides-medwhite.css" title="White" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-medblue.css" title="Blue" media="all" /> <link rel="alternate stylesheet" type="text/css" href="../xslides-usc.css" title="USCTheme" media="all" /> <script type="text/javascript" src="../scripts/stylehelper.js"></script> <script type="text/javascript" src="../scripts/jquery.js"></script> <script type="text/javascript" src="../scripts/jquery-ui.js"></script> <link rel="stylesheet" href="../lightbox.css" type="text/css" media="screen"/> </head> <body> <div class="navbar"> <p> <a onclick="javascript:this.href=getURL('xfn.html');return true;" rel="prev" href="xfn.html" accesskey="P" title="XFN">←</a> <a rel="index" href="index.html" onclick="javascript:this.href=getURL('index.html');return true;" accesskey="I" title="Index Page">^</a> <a rel="next" href="microformatsvssemanticweb.html" onclick="javascript:this.href=getURL('microformatsvssemanticweb.html');return true;" accesskey="N" title="Microformats vs Semantic Web">→</a> </p> </div> <div class="talktitle"><p>Microformats</p></div> <h1 class="slide">XOXO</h1> <div class="slidebody"> <ul> <li>The <a class="remote" href="http://microformats.org/wiki/xoxo">XOXO</a> format lets one embed outlines. </li> </ul> <pre> <span class="type"><ol class='xoxo'></span> <span class="type"><li></span>Subject 1 <span class="type"><ol></span> <span class="type"><li></span>subpoint a<span class="type"></li></span> <span class="type"><li></span>subpoint b<span class="type"></li></span> <span class="type"></ol></span> <span class="type"></li></span> <span class="type"><li></span>Subject 2 <span class="type"><ol compact=</span><span class="string">"compact"</span><span class="type">></span> <span class="type"><li></span>subpoint c<span class="type"></li></span> <span class="type"><li></span>subpoint d<span class="type"></li></span> <span class="type"></ol></span> <span class="type"></li></span> <span class="type"><li></span>Subject 3 <span class="type"><ol></span> <span class="type"><li></span>subpoint e<span class="type"></li></span> <span class="type"></ol></span> <span class="type"></li></span> <span class="type"></ol></span> </pre> </div><hr class="bottom"/> <p class="author"><a href="../../index.html">José M. Vidal</a> <a href=" http://validator.w3.org/check?uri=http://jmvidal.cse.sc.edu/talks/microformats/xoxo.html">.</a></p> <p class="pagenumber">6 of 9</p> </body> </html>
This talk available at http://jmvidal.cse.sc.edu/talks/microformats/
Copyright © 2009 José M. Vidal
.
All rights reserved.
21 April 2008, 04:17PM