Cascading Sarcasm Sheets

CSSI love the organization of the semantic web. Instead of grouping things as they should look, group items as they make sense semantically then change how they look with cascading style sheets. This works great with paragraphs, ordered and unordered lists of different things, and to a lesser part using divs and/or spans for different sections of data. Still, with all this we haven't come up with a real good way of semantically marking up sarcasm, hyperbole, intended puns, unintended puns and more verbal word play that is best delivered via body language and intonation.

What originally got me thinking all this was sarcasm doesn't do well on the internet but people try to use it all the time. Maybe it's just me, and the people I know, but it is often denoted with sarcasm HTML tags (<sarcasm>yeah, sure!</sarcasm>). I had been thinking about this on my own for some time so I decided to discuss this with my mentor at work. He thought about it for a bit and said to me, "That seems inefficient. You should only markup things that aren't sarcastic. How about a serious tag?(<serious>I'll take 2</serious>)" Being pragmatic I thought, really there are both then everything in between. He agreed.

Next we discussed how we needed to do the levels of sarcasm and seriousness in a span of text. You may want to do something special to css that is really sarcastic or deathly serious. My response was that you could just use class attributes to help you mark up your code. The other option is to wrap a sarcasm tag with an emphasis or strong tags to denote regular, mild and strong cases of each.

<sarcasm>I'm sure you're right</sarcasm>
<em><sarcasm>You sure know what you are talking about</sarcasm></em>
<strong><sarcasm>You are a genius!</sarcasm></strong>

Whether using class attributes or extra tags you can use CSS to change all the various combinations and in between states. It all depends upon which order you place them in your style sheet. Sounds like fun, as long as I don't have a deadline.

Now, I haven't had any time to code up a semantic site rife with sarcasm tags but there might be some out there. If you've got a site or know of one that uses sarcasm tags or anything similar then uses some awesome CSS to showcase it, I'd love to see it and share. Let me know all about it in the comments section, down below.