Category Archives: CSS

http://www.w3.org/Style/CSS/

Dynamic Tabs for Metadata

I generate and store quite a lot of metadata with my photos, as can be gathered from my faceted photo index. Until now, I have simply displayed most of it beneath each photo on its page, but I wanted to make the interesting parts stand out more, while still providing access to the rest.

CSS and JavaScript to the rescue.

Simon Willison created a small script for toggling sections of page, easytoggle and debugging in Safari, which was subsequently improved to also handle Safari. That seemed like a great way to approach the problem — making it possible to structure the information, while still leaving it accessible to all.

However, there were (of course) a few quirks with that implementation, so I added a few lines of code to make it possible to not display the menu tabs when JavaScript isn’t enabled, and to make the inactive tabs dim until selected: easytoggle3.js

To designate a section as the tab section (to make it not show up without javascript), identify it with #toggle, and add a CSS instruction to make it not display: display: none. The rest of the script works just as the original, where links with class="toggle" are used to identify the parts that should be togglable.

Redesign, Retrospective and Resolutions

At some point this fall, I promised myself I’d refactor my web pages, to give them all a similar look, while making it easy to update that look in the future, and drive most of the content with RDF — after all, web pages are resources.

I’m not quite done with all the corners, most notably my homepage, but at least now the weblog and the photo albums share a common stylesheet, with everything in place for tweaking the rest, including a Planet Morten feed!

For the coming year, I intend to continue my switch of focus from producing RDF to consuming it. I have started out by generating a faceted interface for my photos (which could use an additional interface like libby’s calendar view), and with Leigh Dodds releasing Slug: A Simple Semantic Web Crawler, I’m reminded to get back to work with my scutter, Scutter Strategies and the Scutter Vocabulary. Also, Bob DuCharme has created rdfdata.org, which means that it’s now easier than ever to find data to play around with. Integral to most of this is me getting around to writing/porting the RDQL/SPARQL rewriting code to the Redland/MySQL storage backend.

To see what it’s like, I also intend to start a “real” (Danish) weblog, one that is updated on an (almost) daily basis, I think it’ll be good for me to get into the habit of writing more often than now, where most of the stuff I do sits quietly behind the scenes, waiting for that elusive moment when there’s time to refactor and document it properly. In short: Moving to a state of mind where (seemingly!) perfect is an option, not a requirement — a state I’m finding it hard to get to, but also a state from which I have learned a lot from others in the Open Source community.

So much to do, so little time, but I think it’s important to showcase how RDF can actually be used, not just produced, all the while making interesting stuff simpler.