Web Design for the Desktop and Other Devices

By Janine Warner, David LaFontaine, and Lee Andron from iPhone and iPad Web Design For Dummies

Many web designers focus on the cutting edge (or, as some would say, bleeding edge) of web design today. When you focus on creating designs for Safari on the Apple iOS, you can take advantage of the latest in HTML5 and CSS 3 and all that this new, multimedia, interactive environment has to offer.

But don’t forget that some people who view your web pages may still be using older web browsers on more antiquated devices, such as computers running Internet Explorer 7 on Windows XP.

If you employ the best practices, you can create great-looking designs for the iPhone and iPad without compromising the experience of your less advanced users. Here are a few things to keep in mind if you want to make sure that your pages look good to the broadest possible audience:

Use multiple styles targeted to each device: Design styles that are specific to the iPad and iPhone, and be sure to include a set of styles that work well on a desktop computer.
Create one version of your site that works well on a computer monitor set to a resolution of 1024 x 768. You should create a page design that’s about 960 to 980 pixels wide.
Make sure your design works well even if the cool new CSS 3 design features don’t display. Things such as drop shadows and rounded corners may not display on some desktop computers. Test your pages in an older browser to make sure they look "good enough” and that they’re still at least readable and navigable on older web browsers.