Some phones won’t display a page with more than 10KB of data on a page (the outputted html – minus images and externally linked files like CSS files). Others don’t understand CSS padding/margins no matter what you do (cough… Blackberrys… cough). While others display everything perfectly.

The key to mobile site development is testing, testing, testing. Get the top mobile devices that are used to visit your site and build the code around those to start. (And yes, the carrier does make a difference as well as the specific model numbers.) Then refine things for other popular handsets.

Another key to mobile site development is you can’t just shrink down your site to show everything on the mobile web page. It’s all about tailoring what content (images, text, etc.) that your mobile audience will see. An editorial eye is needed.

As far as mobile site design, make sure the logo/images/layout of the site take into consideration the standard phone display sizes (which can be found in Sitepoint’s “Designing for the Mobile Web” article).

The frequent use of “if the device supports it” is a big sticking point for me. This means we are going to have to have an exhaustive list of devices and their capabilities, and serve different content to each. This is an absolute killer for small companies and small websites. There is no way that I am going to learn how to distinguish between device clients that support external stylesheets, those that support internal stylesheets only, those that don’t support any stylesheets, and then send each of them a different version of the page.

At 36KB, this page (before any comments are added) is several times larger than should be served to mobile users – that means we are not going to get away with hiding content in handheld.css, we are going to have to serve different content. Yes, that may work for big sites, but for most sites it just isn’t realistic.