Design Guidelines; Fixed-Width Objects; Images - Avaya 4600 Series Administrator's Manual

Design Guidelines

This section presents guidelines for developing a good model that effectively presents Web
pages for 4630 IP Telephone Web Browser viewing. The biggest challenge in designing pages
for this browser is the limited amount of space available for viewing the pages. The 4630 IP
Telephone screen is a 1/4-VGA display. Part of that screen is lost to the browser by the 4630 IP
Telephone's main controls. Page layout must be effective and efficient, to avoid causing more
lost space through additional screen controls like scrollbars. Font sizing can make or break a
page's usability. You must find a balance between fitting as much text as is possible, and
allowing users to read the text without straining their eyes.

Fixed-Width Objects

One of a Web browser's primary functions is to present text wrapped at the browser window's
right border. When dealing with internationalization, text would wrap at the left border. The
browser always attempts to avoid adding a horizontal scrollbar. However, if you use fixed-width
objects, like tables and pre-formatted (<pre> tag) text, wrapping becomes secondary to
presenting the data exactly as HTML dictates.
Web browsers do not resize themselves larger when you add scrollbars. Thus, if there are more
lines of text than can fit in the browser window's height, a vertical scrollbar is added. This now
takes up some of the width of the browser, and less text displays on a single line. If text is wider
than the browser's width, a horizontal scrollbar is added. This now takes up some of the
browser's height, and fewer lines of text are displayed.
Given the small size of the browser, it is highly desirable to avoid causing scrollbars to appear.
Unless the amount of text shown in a page is kept to a bare minimum, avoiding a vertical
scrollbar is unlikely. However, avoiding fixed-width objects, or ensuring that the size of
fixed-width is kept small, gains some viewable space. If scrolling is a requirement, vertical
scrolling is usually better perceived by users than horizontal scrolling.

Images

Using images in a Web page is always a concern. For example, a page with many images can
slow up downloading. While this is still a concern in the telephone, an image's size has a much
greater effect. Browser and telephone memory is limited. Each image can use a sizable amount
of memory, overwhelming the browser. Use an image only if it is essential to a page.
Images also fall into the realm of fixed-width objects. Check all images to verify that they do not
cause a horizontal scrollbar to be added. Scale down a browser image by setting the width and
height attributes of the <img> tag. Or instead, scale the images when setting up the Web site.
Scaling images during Web site setup avoids forcing the browser to deal with the sizing. Using
the width and height attributes scales the image after it is downloaded by the browser. Scaling
Design Guidelines
Issue 8 July 2008 171