When you are using CSS, you can create separate style sheets for different media types. This is one of the best ways to build printer friendly Web pages – you just assign a different style sheet for the "print" media type.
But How Do You Test the Style Sheet?
Sure, if you have a cell phone, you can test the style sheet by going to your page on the phone. But it's nice to be able to build up the basic styles before you publish the page and the style sheet live. That way you can be sure that it won't be seen by anyone until it's done or nearly done. Plus, if you don't have a cell phone or handheld device readily available, it can be difficult to test.
Change the Media Type to "screen" for Testing
When you're building a media type CSS document, you should set the media type on the pages you're testing to "screen" or "all". That way, when you come to the page in your Web browser you'll see what it will look like in that other media. Then you can make adjustments quickly and in an offline environment.
@import url("handhelds.css") screen;
When you've got the page working as you'd like it to, switch the media type back to the device it's for and publish.
@import url("handhelds.css") handheld;
Testing on the Screen Saves Paper
Don't just use this technique for testing handheld, tv, and projection styles. Use it for your print style sheets too. That way you won't be wasting paper while you're testing that your print style sheets work well.
Posted in: Web Design and Applications