This is an archive of an inactive wiki and cannot be modified.

hGRDDL is a proposal to use a GRDDL-like approach to transform HTML+microformat to HTML+RDFa. This page describes an example of hGRDDL.

HTML+microformat

Consider an HTML page with an hCard. The example used here is a combination of examples from microformats.org.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://www.w3.org/2006/03/hcard">
</head>
<body>

<address class="vcard"> 
 <img src="myphoto.jpg" class="photo" alt="my photo" />
 <a class="url fn" href="http://example.org/people/Jane/">Jane Smith</a>.
 <a class="email" href="mailto:jane@example.org">email</a>

 <div class="adr">
   <div class="street-address">665 3rd St.</div>
   <div class="extended-address">Suite 207</div>
   <span class="locality">San Francisco</span>,
   <span class="region">CA</span>
   <span class="postal-code">94107</span>
   <div class="country-name">U.S.A.</div>
 </div>

</address>

</body>
</html>

hGRDDL

An hGRDDL-RDFa-aware agent should be able to:

The hGRDDL transform for hCard specifically does the following:

Resulting HTML+RDFa

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>

<address class="vcard"
   xmlns:vcard="http://www.w3.org/2001/vcard-rdf/3.0#"
   xmlns:foaf="http://xmlns.com/foaf/0.1/"
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   rel="dc:creator"> 
 <img src="myphoto.jpg" class="photo" alt="my photo" 
      rel="vcard:photograph" />
 <a class="url fn" href="http://example.org/people/Jane/"
    rel="foaf:homepage" property="vcard:fn">Jane Smith</a>.
 <a class="email" href="mailto:jane@example.org"
    rel="vcard:email">email</a>

 <div class="adr" rel="vcard:adr">
   <div class="street-address" property="vcard:street-address">665 3rd St.</div>
   <div class="extended-address" property="vcard:extended-address">Suite 207</div>
   <span class="locality" property="vcard:locality">San Francisco</span>,
   <span class="region" property="vcard:region">CA</span>
   <span class="postal-code" property="vcard:postcal-code">94107</span>
   <div class="country-name" property="vcard:country-name">U.S.A.</div>
 </div>

</address>

</body>
</html>

Getting it Running

Get the hGRDDL-enabled, RDFa-based, N3 extractor bookmarklet: bookmarklets

Visit the hcard example: Sample HTML+hcard file

Click on the N3 extractor.

You can also try the RDFa highlighter.


CategoryRDFa