off

From Microformats Wiki
Revision as of 16:23, 19 August 2007 by AnthonyRomano (talk | contribs)
Jump to navigation Jump to search

OFF - OpenFriendFormat 0.1

OFF (OpenFriendFormat) is an extension of the XFN (XHTML Friends Network) microformat

Draft Specification

Authors

Editors

Copyright

Public Domain Contribution Requirement. Since the author(s) released this work into the public domain, in order to maintain this work's public domain status, all contributors to this page agree to release their contributions to this page to the public domain as well. Contributors may indicate their agreement by adding the public domain release template to their user page per the Voluntary Public Domain Declarations instructions. Unreleased contributions may be reverted/removed.

Patents

This specification is subject to a royalty free patent policy, e.g. per the W3C Patent Policy, and IETF RFC3667 & RFC3668.

Abstract

OFF allows for the standardization and transparency of the user experience between importation and exportation of contacts from various social networks. OFF allows for social networks to implement a standardized way of exporting their contacts and discovering new relationships between new and existing users. It also allows for sites to generate documents detailing the relationship between people on differet social networks

Format

OFF consists of an unordered list with embedded XFN (XHTML Friends Network) links. It also allows for embedded avatars inside the list items as well. Any valid XFN links are also valid in OFF.

Structure Module

 body, head, html, title

List Module

 ul, li

Hypertext Module

 a

Image Module

 img

Properties on Elements

Required Properties

All ul elements should have a class "OFF" to allow for styling of the microformat. Furthermore, all ul's should have an id that is in the format group# and counts up starting at 0 (i.e. group0, group1, group2).

Adding an OpenID

To add an OpenID add an XFN link inside an li element and give the li element a class name of openid

Adding an Avatar

To add an avatar for a user put an img tag with a source to the avatar and a class name of avatar

Examples

Single Instance Example

<ul class='OFF' id='group0'>
<li><a href='http://twitter.com/dominatus' rel='me'><img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'>dominatus</a></li>
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://twitter.com/nodono01' rel='contact'>nodono01</a></li>
</ul>

Aggregation Example with One Group

<ul class='OFF' id='group0'>
<li><a href='http://twitter.com/dominatus' rel='me'><img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'>dominatus</a></li>
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://twitter.com/nodono01' rel='contact'>nodono01</a></li>
<li><a href='http://del.icio.us/dominatus' rel='me'>dominatus</a></li>
<li><a href='http://del.icio.us/ashafer' rel='contact'>ashafer</a></li>
<li><a href='http://del.icio.us/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://digg.com/users/dominatus/profile' rel='me'><img class='avatar' src='http://digg.com/userimages/d/o/m/dominatus/large1335.png'>dominatus</a></li>
<li><a href='http://digg.com/users/bonzodurer3/profile' rel='contact'>bonzodurer3</a></li>
<li><a href='http://digg.com/users/dmar875/profile' rel='contact'>dmar875</a></li>
<li><a href='http://myspace.com/dominatusx' rel='me'><img class='avatar' src='http://a420.ac-images.myspacecdn.com/01474/91/46/1474656419_m.jpg'>dominatusx</a></li>
<li><a href='http://www.myspace.com/16867710' rel='contact'>rhiannon </a></li>
<li><a href='http://www.myspace.com/134345434' rel='contact'>Dana</a></li>
</ul>

Aggregation Example with Multiple Groups

<ul class='OFF' id='group0'>
<li><a href='http://twitter.com/dominatus' rel='me'><img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'>dominatus</a></li>
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://twitter.com/nodono01' rel='contact'>nodono01</a></li>
<li><a href='http://del.icio.us/dominatus' rel='me'>dominatus</a></li>
<li><a href='http://del.icio.us/ashafer' rel='contact'>ashafer</a></li>
<li><a href='http://del.icio.us/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://digg.com/users/dominatus/profile' rel='me'><img class='avatar' src='http://digg.com/userimages/d/o/m/dominatus/large1335.png'>dominatus</a></li>
<li><a href='http://digg.com/users/minamhere/profile' rel='contact'>minamhere</a></li>
<li><a href='http://digg.com/users/dmar875/profile' rel='contact'>dmar875</a></li>
</ul>
<ul class='contacts' id='group1'>
<li><a href='http://myspace.com/dominatusx' rel='me'><img class='avatar' src='http://a420.ac-images.myspacecdn.com/01474/91/46/1474656419_m.jpg'>dominatusx</a></li>
<li><a href='http://www.myspace.com/16867710' rel='contact'>rhiannon </a></li>
<li><a href='http://www.myspace.com/134345434' rel='contact'>Dana</a></li>
</ul>
<ul class='contacts' id='group2'>
<li><a href='http://www.last.fm/user/dominatus' rel='me'><img class='avatar' src='http://cdn.last.fm/avatar_thumbnails/81ceb02ea44c7208617e4c0fb5362c1f.jpg'>dominatus</a></li>
<li><a href='http://www.last.fm/user/scottso' rel='contact'>scottso</a></li>
</ul>

Example with OpenID

<ul class='OFF' id='group0'>
<li class='openid'><a href='http://dominatus.myopenid.com' rel='me'>Anthony Romano</a></li>
<li><a href='http://twitter.com/dominatus' rel='me'><img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'>dominatus</a></li>
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li>
<li><a href='http://twitter.com/nodono01' rel='contact'>nodono01</a></li>
</ul>

References