Layout of WAP Screens
Cards and Applications | Header Titles | Content Lines/Area | Tool Bars | Softkeys
Below we present an overview of the layout and structure of WAP applications.
Cards and Applications
The basic screen for WAP applications is called a card. The screen layout for a card should contain from top to bottom:
- A header title
- Content lines
- An (optional) tool bar
Figure 1: Layout of WAP screens
A WAP application may consist of several cards, may be combined in one deck, which should be linked together in a treelike or a linear structure (see Navigation).
Make one of the cards the "home" card where users enter the application and where users can return to from any card within an application.
Header Titles
The title of a card should be descriptive so that users easily understand the purpose of the card or the WAP application. It has to be defined statically.
The header text should be determined by the item previously selected by the user.
Figure 2: Example for a header title with lines for emphasis
Content Lines/Area
The content lines of a card typically contain
- Text
- Fields for entering values
- Links for navigation
- Images, etc.
The number of content lines should be no more than 3-4 per screen, i.e. they should fit on one screen. Scrolling is possible on the phones, but often inconvenient.
Figure 3: Example for content lines
Note: The different number of lines visible on the various phones make it very hard for the developer to determine a good place for input fields.
Tool Bars
The optional tool bar is always placed on the last line and includes 1-3 options. It typically contains options for:
- Navigation (e.g. back) and confirmation (e.g. OK) on the left side
- The options key menu which provides the functionality for a card and may contain local as well as global functions or links on the right side
- Also some devices have a third tool bar entry in the center, e.g. general phone functions
The toolbar items can be activated by using the corresponding softkeys.
Figure 4: Example for a toolbar
Note: The appearance and usage of the toolbar is device dependent, e.g. navigation!
Softkeys
The phone might have a number of physical buttons - so-called softkeys - that work as navigational (e.g. scrolling) and selection (e.g. activate a hyperlink) tools for the user. The buttons are directly connected to act on WML screens elements.
