Re: Retrofitting Responsive Design on an Existing Website

[CrocoDillon]

Those websites probably are designed for some minimum screen width, like 960px. Take every CSS that’s making it fixed like that and put it in a MQ with min-width 960px (or whatever), you’re done for everything bigger then that. Resize the browser to mobile size and start making tweaks to make it look good, you’re done for mobile. Then resize your browser from mobile size up and see where you need MQ breakpoints to make it look good for everything between mobile and big screens. That’s basically mobile-first, but reversed :P

Problem with mobile-first is browsers that don’t support MQs get the mobile ‘version’, you can of course target IE8 and less with conditional comments (like html5boilerplate does, same CSS file but prepend rules with `.lt-ie9`) and give them the 960px layout.