Screen Size
As an i-mode developer, the handset's screen is your canvas. If you're also a desktop Web developer, you know that the issue of screen size is something that you have to take into consideration when developing PC Web applications. You want to present the information to users in a way that it works best with the size of their screen. For the desktop Web, you either design a screen that will work well in all browser windows sizes, or else opt for the arduous task of trying to detect the window size with client-side scripting.
Handset screens for i-mode range quite a bit in size, as you can see in Table 1 that shows a sample of screen sizes of popular DoCoMo i-mode handsets at the time this article was written. Screen size has an impact on both the amount of text per line and per screen, and also the size of images.
Table 1 - NTT DoCoMo i-mode Handset Screen Dimensions *
i-mode handset model |
Screen width Xheight (pixels) |
Characters per lineXlines per screen |
Characters per screen |
F503i |
120X130 |
20X10 |
200 |
P503i |
120X130 |
24X10 |
240 |
N503i |
118X128 |
20X10 |
200 |
SO503i |
120X113 |
16X7 |
112 |
D503i |
132X126 |
16X7 |
112 |
P503iS |
120X130 |
24X10 |
240 |
D210i |
96X120 |
16X7 |
112 |
F201i |
96 X 113 |
16 X 8 |
128 |
N210i |
118X113 |
20X8 |
160 |
For your i-mode site, you have two choices to deal with the differences in screen sizes:
Build a generic site that can be viewed on any handset screen.
Customize your content based upon the screen size of the user.
If you decide to customize your i-mode content for each user's screen size, you will be happy to know that screen sizes in i-mode handsets can be detected much more easily than in the desktop world. When the i-mode handset connects with your Web server, it sends a user agent string that indicated the model of the handset. With a little bit of server-side scripting, you can tailor the text or image contents for the screen dimensions of the user's handset.