include-pattern

From Microformats Wiki
Revision as of 20:59, 22 February 2006 by Tantek (talk | contribs) (first draft)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

include pattern

Initially developed as part of resume-brainstorming, it has become clear from actual microformats markup experience with real world sites, that several microformats (e.g. hResume, hReview, hAtom etc.) need a mechanism to include a portion of data from area of a page into another area of a page. This page documents this pattern for re-use in those microformats and any others that need this feature.


Background

In hResume, we needed the ability to include the name from the hCard at the top of the resume for a person into their hCards in the middle of the resume which represented each of their job hCards (job title, organization name, address etc.), and thus developed the hCard reference via object technique.

class name "include"

In order to make this more explicit (helps forward compatibility for parsers), we are adding the class name "include" on the object element to indicate that that object refers to a subtree which should be included in its place by microformat parsers.

object include example

Here is an example of an hCard you could have at the top of a page, shown here also as a verbose hCard for purposes of illustration that the reference may be to a subtree, not just a text node:

<span class="vcard">
 <span class="fn n" id="j">
  <span class="given-name">James</span> <span class="family-name">Levine</span>
 </span>
</span>

Somewhere else on the page, you could have another hCard which would re-use that "fn n" content from the first hCard:

<span class="vcard">
 <object data="#j" class="include" type="text/html"></object>
 <span class="org">SimplyHired</span>
 <span class="title">Microformat Brainstormer</span>
</span>

This method of hCard property indirection via an object element can apply to any/all properties in class-based microformats.

Note 1: the object data attribute MUST be a local ID reference. External references (which would require a consuming application to load an external resource) are currently not supported by this method.

Note 2: type="text/html" is used because that is the most common Content-Type of web pages. When used in pages served as "application/xhtml+xml", then that should also be used for the type atribute on such object includes on those page as well.

Note 3: To avoid unsightly messes in Safari, you should include the following style rule in a style sheet for the page:

object.include { width:0; height:0 }