Step 5: Clean up the code in your pages

Now it's time take a close look at all of the pages on your website. Browse through your site using your mobile device emulator, and keep an eye out for any embedded or inline styles that are causing display problems on the small screen. You may need to modify your external style sheets to accommodate these styles.

Tip: If you have the Opera browser, use the View menu > Small Screen option to test your pages as well.

Drupal users: The Openwave emulator can also be used online, so you can use it to preview your work while you're upgrading your site. If you have a mobile device, also take a look at your site using your device.

If you're using tables to lay out any of the content of your pages, such as a chart of electronic resources or a web-based form, you'll probably need to recast the content so that you can eliminate the table elements.

If you code by hand and would like to create a form without using a table, take a look at Recipe 7.14 in CSS Cookbook, 2nd Edition, by Christopher Schmitt. (This link will open in a new browser window.)