Print Friendly

I just spent time giving birth to an Old Dominion University Computer Science web site at http://www.cs.odu.edu/~sjone.  It’s just one page now, with some course information, and some links back to this site.  I know, not very interesting.  Under the covers, though, is a testbed for the Semantic Web.  So far, I’ve got Dublin Core and Friend of a Friend (FOAF) implemented for that one page.  In the future, I intend to bring the lessons learned there over to this site.  Eventually, the two will begin to look more alike in both style and function.

Perhaps Web Science and Digital Libraries is really my thing. I spend an awful lot of time blogging about my own web sites.

Validation of the Creative Commons Markup

I also discovered that the Creative Commons license markup wouldn’t validate with the W3C validator. This was because my page was initially specified as XHTML, but the Creative Commons license link contains additional RDF metadata used by search engines and other software. A blog post suggested just removing the metadata, but I didn’t want to do that because I knew that metadata had been placed there by Creative Commons for a reason. That metadata is part of the RDFa standard, which is a way of embedding metadata into normal HTML and XHMTL.

It turns out that once you put that Creative Commons markup into your XHTML, it becomes XHTML + RDFa, which is a completely different document type. I felt good that I’d figured this out, and changed the page to use this instead.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">

Now it validates fine as XHTML + RDFa.

Nifty floating image trick

You may wonder how I got the image to stay on the left and in the same spot, even though the visitor can scroll the page.  It is based on the following CSS, shamelessly stolen from the W3C themselves.

body {
    background-image: url(http://www.cs.odu.edu/~sjone/images/oducs-lpx.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-attachment: fixed;
   /* more CSS here */
}

That’s it. It’s quite elegant, and I spent more time making the image with Inkscape than I did actually writing the CSS to tell it to stay put.

Useful Links

I discovered the following useful sources for bringing that site to life: