Old Habits Die: Conditional Comments
Challenging your current development style and practises can be hard. You spend days and weeks learning, discovering and eventually settling on The Right Thing To Do™ (or, at least, the thing that suits you best), but before you know it things have changed and it's time to renew.
You know the ones, varieties include downlevel revealed and hidden. They're basically HTML comments that are interpreted by specific versions of internet explorer so you can provide a version of IE, from IE 4 to IE 10, some specific code. I imagine these were initially totally ignored for years, until smart people started realising that if you wanted to target a specific version if Internet Explorer, the smartest and safest method rather than relying on CSS targeting hacks was to include an IE Specific stylesheet:
<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="css/ie6.css" mce_href="css/ie6.css" />< ![endif]-->
Shiny. And for years that was The Right Thing To Do™.
Why they suck
They don't! They're awesome! Well, kinda. There is the overhead of having to maintain multiple stylesheets, which can be a real pain on larger projects since you'll likely need a stylesheet for IE 6, IE 7, IE 8 and sometimes even IE 9. It also means having to separate the IE-specific styles from the standards-compliant styles, so it's a testing nightmare since you never really know when you update the main stylesheet which rules have IE-specific versions. And since those old versions are slowly losing their market share, there really is less incentive to keep doing things the old, annoying ways. There are also a few minor gripes, like additional HTTP requests in the head etc that probably don't matter that much, but displease my OCD personality.
Beyond Conditional Comments
So what's next? Paul Irish and the HTML 5 Boilerplate team back in 2008 started to use conditional comments to simply add a class to the html element:
<!--[if lt IE 7]> <html class="ie6"> <![endif]--> <!--[if IE 7]> <html class="ie7"> <![endif]--> <!--[if IE 8]> <html class="ie8"> <![endif]--> <!--[if gt IE 8]><!--> <html> <!--<![endif]-->
And, lo, did the internet rejoice. It's been refined since, of course, but the basics are still all there.
The point at which you start asking "Why am I still doing this?"
Until recently, I'd been using conditional comments because at some point 100 years ag (internet time) I'd researched the crap out of it and decided that was the best thing. But as they say, old habits end up biting you in the gift horse and mixing metaphors. It took a while for me to come around to the idea that something that I'd been so meticulous, and let's face it a little pious about, might be obsolete.
I've used the html-class version to deploy IE styles and I'll not be looking back. Challenging your own mental preconceptions can be so helpful in moving forward—too bad it's such a pain to do. Now I'm wondering what's next for me? I've already joined the CSS-framework bandwagon for some projects and I tacked Scalable Vector Graphics (SVG to the cool kids) for this website to see how it could be integrated into many of the sites I build... Maybe SASS? Or landscape architecture—I hear you get to go outside while it's still light and get dirt under your fingernails.
So what old habits do you have that it's time to break?