off: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
mNo edit summary |
||
| Line 49: | Line 49: | ||
=== Adding an Avatar === | === 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'' | To add an avatar for a user put an img tag with a source to the avatar and a class name of ''avatar'' inside the li element after the XFN. | ||
== Examples == | == Examples == | ||
| Line 56: | Line 56: | ||
<pre><nowiki><ul class='OFF' id='group0'> | <pre><nowiki><ul class='OFF' id='group0'> | ||
<li><a href='http://twitter.com/dominatus' rel='me | <li><a href='http://twitter.com/dominatus' rel='me'>dominatus</a></li> | ||
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</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://twitter.com/nodono01' rel='contact'>nodono01</a></li> | ||
| Line 65: | Line 65: | ||
<pre><nowiki><ul class='OFF' id='group0'> | <pre><nowiki><ul class='OFF' id='group0'> | ||
<li><a href='http://twitter.com/dominatus' rel='me | <li><a href='http://twitter.com/dominatus' rel='me'>dominatus</a></li> | ||
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</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://twitter.com/nodono01' rel='contact'>nodono01</a></li> | ||
| Line 71: | Line 71: | ||
<li><a href='http://del.icio.us/ashafer' rel='contact'>ashafer</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://del.icio.us/minamhere' rel='contact'>minamhere</a></li> | ||
<li><a href='http://digg.com/users/dominatus/profile' rel='me | <li><a href='http://digg.com/users/dominatus/profile' rel='me'>dominatus</a></li> | ||
<li><a href='http://digg.com/users/bonzodurer3/profile' rel='contact'>bonzodurer3</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://digg.com/users/dmar875/profile' rel='contact'>dmar875</a></li> | ||
<li><a href='http://myspace.com/dominatusx' rel='me | <li><a href='http://myspace.com/dominatusx' rel='me'>dominatusx</a></li> | ||
<li><a href='http://www.myspace.com/16867710' rel='contact'>rhiannon </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> | <li><a href='http://www.myspace.com/134345434' rel='contact'>Dana</a></li> | ||
| Line 83: | Line 83: | ||
<pre><nowiki><ul class='OFF' id='group0'> | <pre><nowiki><ul class='OFF' id='group0'> | ||
<li><a href='http://twitter.com/dominatus' rel='me | <li><a href='http://twitter.com/dominatus' rel='me'>dominatus</a></li> | ||
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</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://twitter.com/nodono01' rel='contact'>nodono01</a></li> | ||
| Line 89: | Line 89: | ||
<li><a href='http://del.icio.us/ashafer' rel='contact'>ashafer</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://del.icio.us/minamhere' rel='contact'>minamhere</a></li> | ||
<li><a href='http://digg.com/users/dominatus/profile' rel='me | <li><a href='http://digg.com/users/dominatus/profile' rel='me'>dominatus</a></li> | ||
<li><a href='http://digg.com/users/minamhere/profile' rel='contact'>minamhere</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> | <li><a href='http://digg.com/users/dmar875/profile' rel='contact'>dmar875</a></li> | ||
</ul> | </ul> | ||
<ul class='contacts' id='group1'> | <ul class='contacts' id='group1'> | ||
<li><a href='http://myspace.com/dominatusx' rel='me | <li><a href='http://myspace.com/dominatusx' rel='me'>dominatusx</a></li> | ||
<li><a href='http://www.myspace.com/16867710' rel='contact'>rhiannon </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> | <li><a href='http://www.myspace.com/134345434' rel='contact'>Dana</a></li> | ||
</ul> | </ul> | ||
<ul class='contacts' id='group2'> | <ul class='contacts' id='group2'> | ||
<li><a href='http://www.last.fm/user/dominatus' rel='me | <li><a href='http://www.last.fm/user/dominatus' rel='me'>dominatus</a></li> | ||
<li><a href='http://www.last.fm/user/scottso' rel='contact'>scottso</a></li> | <li><a href='http://www.last.fm/user/scottso' rel='contact'>scottso</a></li> | ||
</ul> | </ul> | ||
| Line 110: | Line 110: | ||
<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/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/minamhere' rel='contact'>minamhere</a></li> | ||
</ul> | </ul> | ||
</nowiki></pre> | </nowiki></pre> | ||
=== Example with Avatar === | |||
<pre><nowiki><ul class='OFF' id='group0'> | |||
<li> | |||
<a href='http://twitter.com/dominatus' rel='me'>dominatus</a> | |||
<img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'> | |||
</li> | |||
<li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li> | |||
</ul> | |||
</nowiki></pre> | |||
== Implementations == | |||
This section is '''informative'''. | |||
* [http://tabber.org Tabber] has [http://tabber.org/offtest.php written a aggregate generator test site] | |||
== References == | == References == | ||
Revision as of 16:35, 19 August 2007
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.
body, head, html, title
ul, li
a
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 inside the li element after the XFN.
Examples
Single Instance Example
<ul class='OFF' id='group0'> <li><a href='http://twitter.com/dominatus' rel='me'>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'>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'>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'>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'>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'>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'>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'>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> </ul>
Example with Avatar
<ul class='OFF' id='group0'> <li> <a href='http://twitter.com/dominatus' rel='me'>dominatus</a> <img class='avatar' src='http://assets3.twitter.com/images/default_profile_image_normal.gif?1187395531'> </li> <li><a href='http://twitter.com/minamhere' rel='contact'>minamhere</a></li> </ul>
Implementations
This section is informative.