{
  "version": "https://jsonfeed.org/version/1.1",
  "title": "chem-bla-ics",
  "description": "Chemblaics (pronounced chem-bla-ics) is the science that uses open science and computers to solve problems in chemistry, biochemistry and related fields.",
  "home_page_url": "https://chem-bla-ics.linkedchemistry.info/",
  "feed_url": "https://chem-bla-ics.linkedchemistry.info/2010/08/10/xhtmlrdfa-chemical-examples.json",
  "icon": "https://chem-bla-ics.linkedchemistry.info/assets/images/chem-bla-ics_logo.png",
  "language": "en",
  "authors": [
    {
      "name": "Egon Willighagen",
      "url": "https://orcid.org/0000-0001-7542-0286",
      "_orcid": "0000-0001-7542-0286"
    }
  ],
  "items": [

    {
      "id": "https://doi.org/10.59350/kkvt7-zpm64",
      "url": "https://chem-bla-ics.linkedchemistry.info/2010/08/10/xhtmlrdfa-chemical-examples.html",
      "title": "XHTML+RDFa: chemical examples",
      "content_html": "<p>Steffen <a href=\"https://chem-bla-ics.linkedchemistry.info/2010/08/09/xhtmlrdfa-template.html?showComment=1281418346085#c5562162287116420044\">asked <i class=\"fa-solid fa-recycle fa-xs\"></i></a>\nme if I could also provide a few examples on how to actually put RDF triples in the HTML, as the\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2010/08/09/xhtmlrdfa-template.html\">template <i class=\"fa-solid fa-recycle fa-xs\"></i></a> I gave yesterday is a mere empty canvas to draw the\ntriples on. There are actually <a href=\"https://chem-bla-ics.linkedchemistry.info/tag/rdfa\">various examples <i class=\"fa-solid fa-recycle fa-xs\"></i></a>\nin my blog, which I will summarize here.</p>\n\n<p>Before I start, I like to put some emphasize on the following <a href=\"http://www.w3.org/TR/xhtml-rdfa-primer/\">RDFa</a> pattern. An RDF\nresource that serves as subject is always mapped to a HTML element. This can be a div element, but also other elements, as we\nwill see in the example.</p>\n\n<h3 id=\"a-molecule-smiles\">A molecule SMILES</h3>\n\n<p>The <a href=\"https://chem-bla-ics.linkedchemistry.info/2006/12/10/including-smiles-cml-and-inchi-in.html\">oldest RDFa example <i class=\"fa-solid fa-recycle fa-xs\"></i></a> in my blog is from</p>\n<ol>\n  <li>That was almost two years before the final <a href=\"http://www.w3.org/TR/2008/REC-rdfa-syntax-20081014\">Recommendation</a>, and\nis not quite accurate anymore. But here’s the correct version:</li>\n</ol>\n\n<script src=\"https://gist.github.com/517826.js?file=gistfile1.html\">\n</script>\n\n<p>This example shows how to embed the SMILES string CCO semantically. This example shows that the outer most span element is\nused to define the subject of the <a href=\"http://www.w3.org/TR/rdf-concepts/#section-triples\">RDF triple</a>, using the @about\nattribute to define the <a href=\"http://www.w3.org/TR/rdf-concepts/#section-URI-Vocabulary\">URI of the resource</a>: <em>#ethanol</em>.\nNote that this URI is relative to the URI of the HTML page in which it is embedded. Later we will see an example with a full URI.</p>\n\n<h3 id=\"but-i-dont-want-to-hack-html\">But I don’t want to hack HTML!</h3>\n\n<p>Yeah, fair point. Just make a point with your publisher when you submit a new paper. It is the duty of the publisher and\nyour software vendor to do this right. In 2008 I wrote a small <a href=\"https://wiki.mozilla.org/Labs/Ubiquity\">Ubiquity</a> script\nto automagically\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2008/09/01/ubiquity-fun-entering-semantic-markup.html\">convert an InChI into semantified HTML content <i class=\"fa-solid fa-recycle fa-xs\"></i></a>.\nBut I am not sure this script still works. If interesting, let me know, and I will revive the Firefox thingy.</p>\n\n<h3 id=\"and-why-would-i-want-to-do-it-anyway\">And why would I want to do it anyway??</h3>\n\n<p>Because software can more easily understand what you mean. This is why Google is now pushing\n<a href=\"http://googlewebmastercentral.blogspot.com/2009/05/introducing-rich-snippets.html\">rich snippets</a>.\n<a href=\"http://cb.openmolecules.net/\">Chemical blogspace</a> understands them too, allowing you to see\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2007/05/05/cb-comments-for-inchis.html\">blog posts about molecules on other webpages <i class=\"fa-solid fa-recycle fa-xs\"></i></a>.\nWith a simple bit of JavaScript you can link from your webpages, you can\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2007/01/02/chemistry-in-html-javascript-from.html\">enrich your HTML sites with semantic chemistry <i class=\"fa-solid fa-recycle fa-xs\"></i></a> yourself.\n<a href=\"http://www.bioclipse.net/\">Bioclipse</a> also has no problem with extracting\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2010/01/28/semantic-web-features-in-bioclipse-22.html\">the RDF from HTML <i class=\"fa-solid fa-recycle fa-xs\"></i></a>.\nEven <a href=\"https://chem-bla-ics.linkedchemistry.info/2010/07/19/scripts-logs-as-htmlrdfa-mix-free-text.html\">Firefox can understand it <i class=\"fa-solid fa-recycle fa-xs\"></i></a>.\nReally, there is no end to it.</p>\n\n<p>Of course, why you should do this comes basically down to Molecular Chemometrics Principle #2, but I have not written that\non up yet (see also <a href=\"http://chem-bla-ics.blogspot.com/2010/08/molecular-chemometrics-principles-1.html\">McPrinciple #1</a>).</p>\n\n<h3 id=\"reporting-problems-with-molecular-representations\">Reporting problems with molecular representations</h3>\n\n<p>More recently, I reported about using RDFa in human readable log file for computations I am doing (see\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2010/07/19/scripts-logs-as-htmlrdfa-mix-free-text.html\">Scripts logs as HTML+RDFa: mix free text reporting with CSV <i class=\"fa-solid fa-recycle fa-xs\"></i></a>). \nThat code looks like:</p>\n\n<script src=\"https://gist.github.com/517889.js?file=gistfile1.html\"></script>\n\n<p>This example uses a <em>div</em> element to host the subject resource. Again, the resource URI is relative to the URI of\nthe document, e.g. <a href=\"http://rdf.farmbio.uu.se/uppmax-cdk/results.html\">this one</a>. We can also note a new attribute,\n<em>@typeof</em>, which is here used to define the <a href=\"http://www.w3.org/TR/rdf-schema/#ch_type\">rdf:type</a> of the <em>#200234</em> resource.</p>\n\n<p>This code snippet does not define the <em>um</em> namespace, which was done elsewhere in the HTML. Moreover, this\ncode snippet does not actually reuse existing ontologies, which is highly recommended. The\n<a href=\"https://chem-bla-ics.linkedchemistry.info/2010/06/26/it-is-my-great-pleasure-to-present-full.html\">upcoming RDF symposium in Boston <i class=\"fa-solid fa-recycle fa-xs\"></i></a>\nwill tell you all about chemical ontologies in the RDF world (see <a href=\"http://egonw.github.com/acsrdf2010/\">this detailed program</a>,\nwhich itself is HTML+RDFa!). But, if you would just overlook the ad hoc namespaces used, you might appreciate the\nnesting: besides the compound (<em>#200234</em>), a second resource is defined (#error0). In total, this example contains six triples.</p>\n\n<p>Meanwhile, the output simply looks like:</p>\n\n<div about=\"#200234\" typeof=\"um:Compound\">CID <span property=\"um:cid\" datatype=\"xsd:integer\">200234</span>: <span rel=\"um:hasProblem\"><span about=\"#error0\" typeof=\"um:Problem\"><span property=\"um:hasElement\">Ti</span><span property=\"um:hasIndex\" datatype=\"xsd:integer\">1</span></span></span></div>\n\n<h3 id=\"a-molecule-table\">A molecule table</h3>\n\n<p>This third, and for now last, example shows several other features. This HTML snippet show a one entry\nmolecule table, very much like those molecular spreadsheets in Excel, but than right here in your webbrowser.\n(Can you imagine what happens if we mash this up with\n<a href=\"https://doi.org/10.59350/3basz-t0n97 :\">JavaScript molecular viewers <i class=\"fa-solid fa-recycle fa-xs\"></i></a></p>\n\n<script src=\"https://gist.github.com/517927.js?file=gistfile1.html\"></script>\n\n<p>First of all, the <a href=\"http://chem-bla-ics.blogspot.com/search?q=rdf.openmolecules.net\">rdf.openmolecules.net</a> project\nis used to construct an absolute URI for the molecule. The table then gives some properties of the molecule:\nits name (using <a href=\"http://dublincore.org/\">Dublin Core</a>, though perhaps <a href=\"http://www.w3.org/TR/rdf-schema/#ch_label\">rdfs:label</a>\nis better), the boiling point (nicely encoded as <em>t0</em> in <a href=\"https://doi.org/10.1021/ja01193a005\">this 1947 paper</a>),\ntwo cheminformatics descriptors, and the SMILES, using the same approach as the first example in this post.</p>\n\n<p>The output of this table looks like:</p>\n\n<table xmlns=\"http://www.w3.org/1999/xhtml\" xmlns:cc=\"http://github.com/egonw/cheminformatics.classics/1/#\" xmlns:dc=\"http://purl.org/dc/terms/\" xmlns:chem=\"http://www.blueobelisk.org/chemistryblogs/\">\n  <tbody><tr typeof=\"cc:molecule\" about=\"http://rdf.openmolecules.net/?InChI=1/C4H10/c1-3-4-2/h3-4H2,1-2H3\">\n    <td><span property=\"dc:title\">n-Butane</span></td>\n    <td><span property=\"cc:t0\">-0.5</span></td>\n    <td><span property=\"cc:w0\">10</span></td>\n    <td><span property=\"cc:p0\">1</span></td>\n    <td><span property=\"chem:smiles\">CCCC</span></td>\n  </tr>\n  </tbody>\n</table>\n\n<p>I will shortly blog about the source of the above code snippet, but you are invited to go ahead and checkout\n<a href=\"http://github.com/egonw\">my GitHub activity</a> (<a href=\"http://github.com/egonw.atom\">RSS</a>).</p>\n\n<p>Steffen, I think these examples should get you pretty far, but please let me know if you have further questions!</p>\n\n<h4>References</h4>\n<div class=\"csl-bib-body\">\n    <div class=\"csl-entry\">Apodaca, R. (2010). Building ChemWriter 2 - JavaScript All the Way Down. In <i>Front Matter</i>. Front Matter. https://doi.org/10.59350/3basz-t0n97 <a href=\"https://doi.org/10.59350/3basz-t0n97\">CrossRef</a> <a href=\"https://qlever.scholia.wiki/doi/10.59350/3basz-t0n97\">Scholia</a></div>\n    <div class=\"csl-entry\">Wiener, H. (1947). Structural Determination of Paraffin Boiling Points. <i>Journal of the American Chemical Society</i>, <i>69</i>(1), 17–20. https://doi.org/10.1021/ja01193a005 <a href=\"https://doi.org/10.1021/ja01193a005\">CrossRef</a> <a href=\"https://qlever.scholia.wiki/doi/10.1021/ja01193a005\">Scholia</a></div>\n  </div>",
      "summary": "Steffen asked me if I could also provide a few examples on how to actually put RDF triples in the HTML, as the template I gave yesterday is a mere empty canvas to draw the triples on. There are actually various examples in my blog, which I will summarize here.",
      
      "date_published": "2010-08-10T00:00:00+00:00",
      "date_modified": "2026-09-27T00:00:00+00:00",
      "tags": ["html","rdf","rdfa"],
      "_references": [
        
          
          
            { "url": "https://doi.org/10.59350/3basz-t0n97", "doi": "10.59350/3basz-t0n97"
             }
            ,
          
        
          
          
            { "url": "https://doi.org/10.1021/ja01193a005", "doi": "10.1021/ja01193a005"
             }
            
          
        ],
      
      
      
      
      
      
        "authors": [ { "name": "Egon Willighagen", "url": "https://orcid.org/0000-0001-7542-0286" } ]
      
    }

  ]
}
