7.2 What size screens will I be developing for?

The WAP device display varies a lot. Some support graphics, some only text. Just to give you some examples, Mitsubishi's yet unreleased WAP capable phone has a 3 line, 12 character display. Nokia's 7110 has a screen resolution of 96 (width) by 65 (height) pixels. Although images can be slightly larger, the maximum display area for images is 95 (width) by 45 (height) pixels. The pixels on the 7110 are also slightly taller than they are wide. The ratio is aprox. 1.25 times higher than wider. Ie. a square would look like a rectangle 1.25 times taller than wider. The same goes for circles, which would have a slight oval shape.

Ericsson's R320 phone has a similar sized display. The exact measures are 101 (width) by 52 (height). The display fits four text lines, and text is wrapped by default.

The "R380 Design Guideline for WAP Services", and found that display on the Ericsson R380 has a resolution of 360x120 pixels (83x28mm), with 0.23 dot pitch, and the browser area is limited to 310 (width) by 100 (height) pixels, including top margin of 2 pixels, and a left and right margin of 3 pixels each. This gives a 'real' area of 304 by 98 pixels.

To be absolutely sure what the display size is, there is a resolution matrix available in the demos section at DEMO (Select "Resolution matrix"). The deck at that location will let you display three different sized images with one vertical and one horizontal line per ten pixels, and single pixels for every other pixel. From that you should easily be able to see what the actual resolution is. Note that there are three different image sizes, 80x80, 100x100 and 120x120 pixels, because some browsers do not like to load images larger than what they can display.

Because many displays have pixels of rectangle shapes rather than squares, many developers remap their images so that that a square looks like a square, and a circle look like a circle. However, this method is not recommended unless you can be absolutely sure that you know which hardware the user is using. An image that looks perfect on a 7110 will look bad on a R380.

[ Main ]   [ 07 - Making it look fancy ]