This is an archive of an inactive wiki and cannot be modified.

Mobile devices have screens that range from 80 pixel wide to more than 300. The same for the height. This is in the nature of the mobile device as it has to fit different needs. From the user that wants to have a tiny device that fits in every pocket, to the businessman that wants to have a PDA to easily and comfortably access all the information from e-mails to spreadsheets. For these reasons that is no standard size for screens and there will probably never be. Depending on the needs, different users will use different devices. Different uses do not mean that they will never browse the web. This is why we need to make sure that a page is readable in every condition as far as possible.

Due to the most common input devices today in mobile phones, scrolling horizontally is often uncomfortable. On the other side PDA's that feature stylus and a bigger screen often let you do this comfortably. We all agree that is it more comfortable to scroll in a single direction and not both horizontally and vertically, even on a desktop computer.

When you define your CSS and design the general layout you should try to make sure that the text will be able to flow according to the screensize and not according to fixed sizes that you define manually. Defining a fixed size might compel some users to scroll horizontally or not in the most comfortable way according to the local setting (also see CategoryBpScrollingOneDir). Using relative sizes such as percentages will work this around. Avoid pixel measures whenever you can.

An exception for this rule are image size. See CategoryBpImagesSpecifySize for more techniques.

For more help with CSS see UseCSSForSpacing.

Check CategoryBpLargeGraphics to make sure you avoid images or objects too wide.


Contributions to this wiki are governed by the W3C policies for Contribution to W3C' wiki on Mobile Web.