Now, I'm fairly new at some of these techniques (less than six months) and did a fair amount of research before wading in too deep. One of the phrases that I kept bumping into was the idea of 'mobile first'. I learned the hard way just how limiting this view can be if you take it too far.
As with any large change to my websites I thought a lot about the exact issues that a responsive overhaul would address. One weakness that all of my sites currently suffer from is mobile usability. It's not just the design that inhibits mobile users… the site architecture and layout is not friendly to limited devices. Limiting the number and size of transfers needed to load a page and reviewing navigation layout needed to be done. However, even if I optimized the front end and cleaned up the loading process it would only speed up an unusable website. A responsive design would keep my sites usable across different screen sizes.
The way I had written the CSS followed the mobile first ideal. That is, my site was designed for a small screen. Media queries then acted like if statements that overrode the initial styles if the screen size was big enough. Since IE7 and IE8 can't read media queries they only interpreted the mobile styles and never got to the desktop styles.
The blatantly obvious fix was to tweak the mobile first idea. I flipped my stylesheet over, defining the desktop styles first with the media queries holding the mobile adjustments. IE7 and IE8 loved this and rendered the desktop version just fine. The vast majority of the mobile devices that hit my site can interpret media queries, allowing them to render the site correctly as well. There are a few mobile devices out there that will render the desktop site, not understanding the mobile end, but the historical analytics made this look like a non-issue.
While mobile first is a good idea and forced me to think of bandwidth and usability I had taken the concept too far in this use case. The hacks and fixes out there that allow older browsers to understand media queries still hurt mobile usability more than the help it by adding extra downloading, developing and rendering time. Mobile first is a great idea, but when it comes to CSS structure, I'm going to be be a bit more cognicent of the audience from now on.