# xFolk Microformat

### Roger Costello

Click arrow key () to navigate to next page

# xFolk

- Earlier we saw the elemental Microformat rel-tag.
- Rel-tag is used to tag the Web page, i.e., the content.
- Conversely, xFolk is used to tag the link. More precisely, it is used to tag the resource identified by the link.
  - Analogy: you are navigating the Web using your browser, and you get to a Web site that you like, so you bookmark (tag) the Web page identified by the link.
- xFolk is a Microformat for facilitating decentralized tagging.

# Associating Tags with Links

- Example: modify this HTML text to associate at least one tag with each link:

1. <body>
2. <h1>Trompe L'oeil</h1>
3. <p>Trompe L'oeil is artwork (painting) that is so realistic that it is difficult to distinguish
4. between reality and illusion.</p>
5. <p>Here is a Web site that has some amazing Trompe L'oeil artwork:
6. <a href="http://www.trompe-l-oeil-art.com/trompe.html">Trompe L'oeil by Art Effects</a></p>
7. </body>

- View example01 (no xFolk) in a browser.

# Associating Tags with Links

- Here is the modified HTML text:

1. <body>
2. <h1>Trompe L'oeil</h1>
3. <div class="xfolkentry">
4. <p class="description">
5. Trompe L'oeil is artwork (painting) that is so realistic that it is difficult to distinguish
6. between reality and illusion.
7. </p>
8. <p>
9. Here is a Web site that has some amazing
10. <span><a rel="tag" href="http://en.wikipedia.org/wiki/Trompe_L%27oeil">Trompe L'oeil</a></span>
11. <span><a rel="tag" href="http://en.wikipedia.org/wiki/Art">art</a></span>work:
12. <a class="taggedentry" href="http://www.trompe-l-oeil-art.com/trompe.html">Trompe L'oeil by Art Effects</a>
13. </p>
14. <div>
15. </body>

- View example01 (with xFolk) in a browser.

# Explanation of Example

- The Web page has a link to the Web page: Trompe L'oeil by Art Effects
- We want to tag that Web page
- Using the rel-tag Microformat we provide two tags: Trompe L'oeil and art
- Using the xFolk "description" property we indicate that the description in the <p> element is a description of the Web site being pointed to
- xfolkentry is the root classname. It ties together the link, the tags, and the description

# xFolk Properties

- description (a description of the thing being pointed at by the link)
- taggedentry (the link being tagged; more precisely, the link to the resource being tagged)
- tag (the rel-tag Microformat is used to tag the link)
- xfolkentry (root classname; wraps the above properties; binds together the link, description of the link, and tag(s) of the link)

# xFolk Profile

- http://microformats.org/wiki/xfolk-profile

# de.lirio.us uses xFolk

- Check out the de.lirio.us Web site. It uses xFolk for all its links.
- http://de.lirio.us/ (Select View Page Source to see the use of xFolk)

# Homepage

- Homepage