I’m pleased to unveil a little project I’ve been working on for a few weeks now: whichElement.com. WhichElement.com is a reference site for answering the question “Which elements should I use to mark up this HTML semantically?” I’ve been joined in this effort by my coworker, Ray Camden. We’re pleased to put this out there, and eager to see what you can do with it.

The Story Behind It

I was (and still am) incredibly impressed by HTML5 Please.  I think it’s a fantastically on-target site. It showcases its technology and hits on a specific need and fills it brilliantly. I wanted to do something in the same vein without just copying it.  Around the time that I was feeling this, I got into an argument on semantics with someone. Specifically they were asking questions about when they should use article versus
div. Basically I explained what I knew of the spec for article. I gave some analysis, and made a recommendation.

When I was done with the argument I had an idea for a site:  A reference that would help people choose for themselves which tags to use semantically without being authoritarian.  I also wanted to set the tone that there isn’t one right answer to these things – that “semantically correct” isn’t a binary thing, but a position on a continuum.

The Technology Behind It

Another important thing for us in doing this was choice of technology. We placed a couple of constraints on the project:

  • We wanted to be open to other people contributing and offer a few channels for that.
  • No content management or wiki software
  • All code and content would be in HTML/JavaScript/CSS; no server-side technology

To achieve this we made a few choices.  To go open and collaborative without having a wiki, we went with github. Not the usual answer for a content site, but I think we can make it work.  The choice of no server-side tech (other than a vanilla web server) came about so as to not discourage contributions from anyone.  PHP, Ruby, ColdFusion, some JVM language, Python – whatever your back end, you have to know HTML/JavaScript/CSS. So let’s not skew one way, when most of the contributions can be made very simply with the front-end stack.

Working in those constraints wasn’t always easy. Ray got tired of copying and pasting template code around despite my incredibly stupid protestations that “No, it will be okay; we can work that way.” So he came up with a cool way to handle that with some JavaScript and .htaccess magic. I had to come up with a way to provide search without having any sort of server-side tech. We’re not sure if other people will be cool contributing under these constraints, but obviously I hope so.

Get Involved

We’re open to contributions.  We do all of the publishing through an automated build process that looks at the github repository for the project. So git is the path to getting on production.  We’re open to forks and pull requests.  We’re also open to contributions through email.  Basically if you want to contribute, drop us a line, we’ll figure out how to work with you to get you in.


2 thoughts on “WhichElement.com

  1. Nifty, I’ll check it out. In my case, most often the choice between a div and a span tag comes from the assumptions made by the tools I’m using, so anything that canonicalizes these assumptions is a Good Thing.


Leave a Reply to Jitendra Vyas Cancel reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s