Question

I’m about to start designing my site that I coded in php. It’s a rather complex site…

Obviously, I want to make it suitable for all browsers and devices.

Should I code the CSS using fixed pixels for normal computer dimensions and when I’m done with that make another stylesheet for other devices such as iphone and ipad?

Or should I attempt to make an adaptive site that works with all resolutions? In this case, should I look into CSS frameworks? Any recommendations?

Answer 1

As usual, it depends. If you think your site is going to be accessed by many devices then you probably want to look at responsive design: http://johnpolacek.github.com/scrolldeck.js/decks/responsive/ and http://www.alistapart.com/articles/responsive-web-design/ for more details.

The recommended approach is to take a ‘mobile first’ approach to the styling, so it works well with little markup for mobile devices and then progressively enhance for other devices with larger resolutions.

You may want to use frameworks or hand-code it – that’s something of a personal choice.

If you have significantly different needs for different devices, you may want to create entirely different sites for mobile, similar to the current BBC news for instance, although it’s worth noting that many sites including BBC are moving to responsive techniques, so this is a trend that is being adopted more and more.

It’s also worth considering which browsers your audience will be using. As you reach back into older IE versions especially you’ll need to look at javascript techniques such as the respond.js library to allow media queries to work.