Pocket-Sized Design: Taking Your Website to the Small Screen

[Janak Parekh]

<div class='os_post_top_link'><a href='http://www.alistapart.com/articles/pocket/' target='_blank'>http://www.alistapart.com/articles/pocket/</a><br /><br /></div>Here's a nicely-written, thorough article explaining to you webmasters how to design your webpages so that they reformat well on small PDA and Smartphone screens.<br /><br /><i>"Among the many websites that are out there, few are standards-compliant. Among those few, only a handful sport style sheets adjusted to the needs of handheld devices. Of those which do offer styling for handhelds, not all will fit the smallest, lowest-resolution screens without presenting the user with the ultimate handheld horror: namely, horizontal scrolling."</i><br /><br />While the article generally refers to Opera, it has a number of general tips that should apply well to other constrained browsing platforms, like PIE. As always, make sure to test it if you can. :)

[MikeUnwired]

If everyone was required to get a VGA PPC and equip it with SE_VGA running in landscape mode, it would make it easier to develop web sites for that small screen.

[foebea]

I had honestly forgotten this was a problem.

Reensoft PIE Plus is the second app i install on a blank ipaq (fitaly is first) so I have never had to horizontal scroll or anything. Images are risized, but can be viewed full size if desired. Text is reformatted to fit.

I think if Microsoft integrated Reensoft style functionality in PIE there would be no problem at all. You cant expect webdevelopers to create sheets for every possible viewer on every platform. Better in my opinion is to design a site which can cleanly be converted for use client side.

[Wiggster]

If everyone was required to get a VGA PPC and equip it with SE_VGA running in landscape mode, it would make it easier to develop web sites for that small screen.

If everyone was required to buy a new computer whenever anything went wrong with an old one, it would be easier for computer manufacturers to give tech support.

Note that the easiest solution is rarely the best.

[gregmills]

I think the point of the article is when proper standards based design is used then restructuring the content for multiple devices is a much simplified process. It's just adding a few extra considerations for designers who need their content to display well on mobile devices.

How many more sites would have a version optimized for smaller screens if it were simply a matter of a browser detect script and a new style sheet? In fact if the content was structured with non-presentational markup you could probably just turn the style sheet off for alternative browsers and it would still work great.

I'm almost done with Zeldman's book "designing with web standards" and I've begun transitioning to XML for content and CSS for style in my own design projects (previously my code was ghastly mix of presentational HTML and CSS style). I've been doing web design for about 12 years so it's a completely different way of thinking about markup for me but so far I like it.


(I sourced an article on the homepage and became an "PPC Intellectual" in the same day! WooHoo! The next thing you know I'll be subscribing or something)