CINXE.COM

<!DOCTYPE html> <html class="client-nojs" lang="en" dir="ltr"> <head> <meta charset="UTF-8"/> <title>Web Integration/RDFaExample - Creative Commons</title> <script>document.documentElement.className = document.documentElement.className.replace( /(^|\s)client-nojs(\s|$)/, "$1client-js$2" );</script> <script>(window.RLQ=window.RLQ||[]).push(function(){mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Web_Integration/RDFaExample","wgTitle":"Web Integration/RDFaExample","wgCurRevisionId":42078,"wgRevisionId":42078,"wgArticleId":8663,"wgIsArticle":true,"wgIsRedirect":false,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgPageContentModel":"wikitext","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Web_Integration/RDFaExample","wgRelevantArticleId":8663,"wgRequestId":"92f56eb974cc5ac307a7e1f4","wgIsProbablyEditable":false,"wgRelevantPageIsProbablyEditable":false,"wgRestrictionEdit":[],"wgRestrictionMove":[]});mw.loader.state({"site.styles":"ready","noscript":"ready","user.styles":"ready","user":"ready","user.options":"loading","user.tokens":"loading","mediawiki.legacy.shared":"ready","mediawiki.legacy.commonPrint":"ready","mediawiki.sectionAnchor":"ready","mediawiki.skinning.interface":"ready","skins.vector.styles":"ready"});mw.loader.implement("user.options@0bhc5ha",function($,jQuery,require,module){mw.user.options.set([]);});mw.loader.implement("user.tokens@0jp5kr8",function ( $, jQuery, require, module ) { mw.user.tokens.set({"editToken":"+\\","patrolToken":"+\\","watchToken":"+\\","csrfToken":"+\\"});/*@nomin*/ });mw.loader.load(["site","mediawiki.page.startup","mediawiki.user","mediawiki.hidpi","mediawiki.page.ready","mediawiki.searchSuggest","skins.vector.js"]);});</script> <link rel="stylesheet" href="/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cmediawiki.sectionAnchor%7Cmediawiki.skinning.interface%7Cskins.vector.styles&only=styles&skin=vector"/> <script async="" src="/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=vector"></script> <meta name="ResourceLoaderDynamicStyles" content=""/> <link rel="stylesheet" href="/load.php?debug=false&lang=en&modules=site.styles&only=styles&skin=vector"/> <meta name="generator" content="MediaWiki 1.30.0"/> <link rel="shortcut icon" href="/favicon.ico"/> <link rel="search" type="application/opensearchdescription+xml" href="/opensearch_desc.php" title="Creative Commons (en)"/> <link rel="EditURI" type="application/rsd+xml" href="https://wiki.creativecommons.org/api.php?action=rsd"/> <link rel="license" href="https://creativecommons.org/licenses/by/4.0/"/> <link rel="alternate" type="application/atom+xml" title="Creative Commons Atom feed" href="/index.php?title=Special:RecentChanges&feed=atom"/>  </head> <body class="mediawiki ltr sitedir-ltr mw-hide-empty-elt ns-0 ns-subject page-Web_Integration_RDFaExample rootpage-Web_Integration_RDFaExample skin-vector action-view"> <div id="mw-page-base" class="noprint"></div> <div id="mw-head-base" class="noprint"></div> <div id="content" class="mw-body" role="main"> <a id="top"></a> <div class="mw-indicators mw-body-content"> </div> <h1 id="firstHeading" class="firstHeading" lang="en">Web Integration/RDFaExample</h1> <div id="bodyContent" class="mw-body-content"> <div id="siteSub" class="noprint">From Creative Commons</div> <div id="contentSub"></div> <div id="jump-to-nav" class="mw-jump"> Jump to: <a href="#mw-head">navigation</a>, <a href="#p-search">search</a> </div> <div id="mw-content-text" lang="en" dir="ltr" class="mw-content-ltr"><div class="mw-parser-output"><p><a href="/wiki/File:RDFa-Explanation.png" class="image" title="Read more about how CC uses RDFa and ccREL to signal to machines that a work is CC licensed."><img alt="Read more about how CC uses RDFa and ccREL to signal to machines that a work is CC licensed." src="/images/thumb/b/b3/RDFa-Explanation.png/500px-RDFa-Explanation.png" width="500" height="338" class="thumbborder" srcset="/images/thumb/b/b3/RDFa-Explanation.png/750px-RDFa-Explanation.png 1.5x, /images/b/b3/RDFa-Explanation.png 2x" /></a></p> <p><br /> Using <a href="/wiki/RDFa" title="RDFa">RDFa</a> and <a href="/wiki/CcREL" class="mw-redirect" title="CcREL">ccREL</a> to add metadata about your Creative Commons licensed works will enable machines (search engines, web browsers, etc) to learn more about your work. To learn more, see <a href="/wiki/RDFa" title="RDFa">RDFa</a> and <a href="/wiki/CcREL" class="mw-redirect" title="CcREL">ccREL</a>.</p> <p>The advantages of doing this include being indexed by new search capabilities, such as from Yahoo! or Google, to limit image results to only images licensed under a specific CC license.</p> <p>Another advantage of using this metadata is that when someone clicks on the license text/button on your site and is brought to the CC license deed, the <a href="/wiki/Metadata_Scraper" title="Metadata Scraper">Metadata Scraper</a> will parse the original page and display added personalized info to the deed. See in the below image that the name of the author is shown along with copyable text to attribute the work:</p> <p><a href="/wiki/File:Metadata_scrapper_example.png" class="image"><img alt="Metadata scrapper example.png" src="/images/4/46/Metadata_scrapper_example.png" width="500" height="424" /></a></p> <p>The copyable text is:</p> <dl> <dd> <div xmlns:cc="http://creativecommons.org/ns#" about="http://grossmeier.net/"><a rel="cc:attributionURL" property="cc:attributionName" href="<a rel="nofollow" class="external free" href="http://grossmeier.net">http://grossmeier.net</a>">Greg Grossmeier</a> / <a rel="license" href="<a rel="nofollow" class="external free" href="http://creativecommons.org/licenses/by-sa/3.0/">http://creativecommons.org/licenses/by-sa/3.0/</a>">CC BY-SA 3.0</a></div> </dd> </dl> <p>This produces text that looks to the viewer as simply "Greg Grossmeier / CC BY-SA 3.0" where the name is linked to the original work (<a rel="nofollow" class="external free" href="http://grossmeier.net">http://grossmeier.net</a>) and the license name is linked to the actual license (<a rel="nofollow" class="external free" href="http://creativecommons.org/licenses/by-sa/3.0/">http://creativecommons.org/licenses/by-sa/3.0/</a>). The added metadata also tells machines what those links mean and who the author is.</p> <p>The html code that was on the original site to enable this feature is (line breaks added for readability):</p> <pre> <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/80x15.png" /></a> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://grossmeier.net" property="cc:attributionName" rel="cc:attributionURL">Greg Grossmeier</a> <br /> <rdf:RDF xmlns="http://web.resource.org/cc/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <Work rdf:about=""> <dc:type rdf:resource="http://purl.org/dc/dcmitype/Text" /> <license rdf:resource="http://creativecommons.org/licenses/by-sa/3.0/" /> </Work> <License rdf:about="http://creativecommons.org/licenses/by-sa/2.0/"> <permits rdf:resource="http://web.resource.org/cc/Reproduction" /> <permits rdf:resource="http://web.resource.org/cc/Distribution" /> <requires rdf:resource="http://web.resource.org/cc/Notice" /> <requires rdf:resource="http://web.resource.org/cc/Attribution" /> <permits rdf:resource="http://web.resource.org/cc/DerivativeWorks" /> <requires rdf:resource="http://web.resource.org/cc/ShareAlike" /> </License> </rdf:RDF> </pre> <p><br /></p> <h2><span class="mw-headline" id="See_Also">See Also</span></h2> <dl> <dd><b><a href="/wiki/Web_Integration/CopyableExample" title="Web Integration/CopyableExample">Web_Integration/CopyableExample</a></b></dd> <dd><b>Back to the <a href="/wiki/Web_Integration/HowTo" title="Web Integration/HowTo">HowTo</a>.</b></dd> <dd><b>Back to <a href="/wiki/Web_Integration" title="Web Integration">Web Integration</a>.</b></dd> <dd><b>Back to <a href="/wiki/Developers" title="Developers">Developers</a>.</b></dd> </dl>   </div>  </div> <div class="printfooter"> Retrieved from "<a dir="ltr" href="https://wiki.creativecommons.org/index.php?title=Web_Integration/RDFaExample&oldid=42078">https://wiki.creativecommons.org/index.php?title=Web_Integration/RDFaExample&oldid=42078</a>" </div> <div id="catlinks" class="catlinks catlinks-allhidden" data-mw="interface"></div> <div class="visualClear"></div> </div> </div> <div id="mw-navigation"> <h2>Navigation menu</h2> <div id="mw-head"> <div id="p-personal" role="navigation" class="" aria-labelledby="p-personal-label"> <h3 id="p-personal-label">Personal tools</h3> <ul> <li id="pt-login"><a href="/index.php?title=Special:UserLogin&returnto=Web+Integration%2FRDFaExample" title="You are encouraged to log in; however, it is not mandatory [o]" accesskey="o">Log in</a></li> </ul> </div> <div id="left-navigation"> <div id="p-namespaces" role="navigation" class="vectorTabs" aria-labelledby="p-namespaces-label"> <h3 id="p-namespaces-label">Namespaces</h3> <ul> <li id="ca-nstab-main" class="selected"><span><a href="/wiki/Web_Integration/RDFaExample" title="View the content page [c]" accesskey="c">Page</a></span></li> <li id="ca-talk" class="new"><span><a href="/index.php?title=Talk:Web_Integration/RDFaExample&action=edit&redlink=1" rel="discussion" title="Discussion about the content page [t]" accesskey="t">Discussion</a></span></li> </ul> </div> <div id="p-variants" role="navigation" class="vectorMenu emptyPortlet" aria-labelledby="p-variants-label"> <h3 id="p-variants-label"> <span>Variants</span> </h3> <div class="menu"> <ul> </ul> </div> </div> </div> <div id="right-navigation"> <div id="p-views" role="navigation" class="vectorTabs" aria-labelledby="p-views-label"> <h3 id="p-views-label">Views</h3> <ul> <li id="ca-view" class="selected"><span><a href="/wiki/Web_Integration/RDFaExample">Read</a></span></li> <li id="ca-viewsource"><span><a href="/index.php?title=Web_Integration/RDFaExample&action=edit" title="This page is protected.
You can view its source [e]" accesskey="e">View source</a></span></li> <li id="ca-history" class="collapsible"><span><a href="/index.php?title=Web_Integration/RDFaExample&action=history" title="Past revisions of this page [h]" accesskey="h">View history</a></span></li> </ul> </div> <div id="p-cactions" role="navigation" class="vectorMenu emptyPortlet" aria-labelledby="p-cactions-label"> <h3 id="p-cactions-label"><span>More</span></h3> <div class="menu"> <ul> </ul> </div> </div> <div id="p-search" role="search"> <h3> <label for="searchInput">Search</label> </h3> <form action="/index.php" id="searchform"> <div id="simpleSearch"> <input type="search" name="search" placeholder="Search Creative Commons" title="Search Creative Commons [f]" accesskey="f" id="searchInput"/><input type="hidden" value="Special:Search" name="title"/><input type="submit" name="fulltext" value="Search" title="Search the pages for this text" id="mw-searchButton" class="searchButton mw-fallbackSearchButton"/><input type="submit" name="go" value="Go" title="Go to a page with this exact name if it exists" id="searchButton" class="searchButton"/> </div> </form> </div> </div> </div> <div id="mw-panel"> <div id="p-logo" role="banner"><a class="mw-wiki-logo" href="/wiki/Main_Page" title="Visit the main page"></a></div> <div class="portal" role="navigation" id='p-default_links' aria-labelledby='p-default_links-label'> <h3 id='p-default_links-label'>default links</h3> <div class="body"> <ul> <li id="n-About"><a href="/wiki/CCWiki:About">About</a></li><li id="n-FAQ"><a href="/wiki/Frequently_Asked_Questions">FAQ</a></li><li id="n-Developers"><a href="/wiki/Developer">Developers</a></li> </ul> </div> </div> <div class="portal" role="navigation" id='p-wiki_navigation' aria-labelledby='p-wiki_navigation-label'> <h3 id='p-wiki_navigation-label'>wiki navigation</h3> <div class="body"> <ul> <li id="n-mainpage"><a href="/wiki/Main_Page" title="Visit the main page [z]" accesskey="z">Main Page</a></li><li id="n-portal"><a href="/wiki/CCWiki:Community_portal" title="About the project, what you can do, where to find things">Community portal</a></li><li id="n-recentchanges"><a href="/wiki/Special:RecentChanges" title="A list of recent changes in the wiki [r]" accesskey="r">Recent changes</a></li><li id="n-randompage"><a href="/wiki/Special:Random" title="Load a random page [x]" accesskey="x">Random page</a></li><li id="n-help"><a href="https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Contents" title="The place to find out">Help</a></li> </ul> </div> </div> <div class="portal" role="navigation" id='p-tb' aria-labelledby='p-tb-label'> <h3 id='p-tb-label'>Tools</h3> <div class="body"> <ul> <li id="t-whatlinkshere"><a href="/wiki/Special:WhatLinksHere/Web_Integration/RDFaExample" title="A list of all wiki pages that link here [j]" accesskey="j">What links here</a></li><li id="t-recentchangeslinked"><a href="/wiki/Special:RecentChangesLinked/Web_Integration/RDFaExample" rel="nofollow" title="Recent changes in pages linked from this page [k]" accesskey="k">Related changes</a></li><li id="t-specialpages"><a href="/wiki/Special:SpecialPages" title="A list of all special pages [q]" accesskey="q">Special pages</a></li><li id="t-print"><a href="/index.php?title=Web_Integration/RDFaExample&printable=yes" rel="alternate" title="Printable version of this page [p]" accesskey="p">Printable version</a></li><li id="t-permalink"><a href="/index.php?title=Web_Integration/RDFaExample&oldid=42078" title="Permanent link to this revision of the page">Permanent link</a></li><li id="t-info"><a href="/index.php?title=Web_Integration/RDFaExample&action=info" title="More information about this page">Page information</a></li> </ul> </div> </div> </div> </div> <div id="footer" role="contentinfo"> <ul id="footer-info"> <li id="footer-info-lastmod"> This page was last edited on 25 September 2010, at 19:45.</li> <li id="footer-info-copyright">This wiki is licensed to the public under a <a class="external" rel="nofollow" href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0</a> license.<br/> Your use of this wiki is governed by the <a href="/CcWiki:Terms_of_Use">Terms of Use</a>. </li> </ul> <ul id="footer-places"> <li id="footer-places-privacy"><a href="/wiki/CCWiki:Privacy_policy" title="CCWiki:Privacy policy">Privacy policy</a></li> <li id="footer-places-about"><a href="/wiki/CCWiki:About" class="mw-redirect" title="CCWiki:About">About Creative Commons</a></li> <li id="footer-places-disclaimer"><a href="/wiki/CCWiki:General_disclaimer" class="mw-redirect" title="CCWiki:General disclaimer">Disclaimers</a></li> </ul> <ul id="footer-icons" class="noprint"> <li id="footer-copyrightico"> <a href="https://creativecommons.org/licenses/by/4.0/"><img src="https://licensebuttons.net/l/by/4.0/88x31.png" alt="Creative Commons Attribution 4.0" width="88" height="31"/></a> </li> <li id="footer-poweredbyico"> <a href="//www.mediawiki.org/"><img src="/resources/assets/poweredby_mediawiki_88x31.png" alt="Powered by MediaWiki" srcset="/resources/assets/poweredby_mediawiki_132x47.png 1.5x, /resources/assets/poweredby_mediawiki_176x62.png 2x" width="88" height="31"/></a> </li> </ul> <div style="clear:both"></div> </div> <script>(window.RLQ=window.RLQ||[]).push(function(){mw.config.set({"wgPageParseReport":{"limitreport":{"cputime":"0.024","walltime":"0.029","ppvisitednodes":{"value":13,"limit":1000000},"ppgeneratednodes":{"value":30,"limit":1000000},"postexpandincludesize":{"value":0,"limit":2097152},"templateargumentsize":{"value":0,"limit":2097152},"expansiondepth":{"value":2,"limit":40},"expensivefunctioncount":{"value":0,"limit":100},"timingprofile":["100.00% 0.000 1 -total"]},"cachereport":{"timestamp":"20240522214431","ttl":1209600,"transientcontent":false}}});});</script><script>(window.RLQ=window.RLQ||[]).push(function(){mw.config.set({"wgBackendResponseTime":96});});</script> </body>  </html>