Research and Advances
Architecture and Hardware

Web Content Adaptation For Mobile Handheld Devices

Creative technologies can help overcome the limitations of mobile handheld devices while maximizing their strengths.
  1. Introduction
  2. Selective Content Delivery
  3. Adaptive Content Presentation
  4. Adaptation of Multimedia Content
  5. References
  6. Author
  7. Figures

We have witnessed the explosive growth of mobile handheld devices such as cell phones and personal digital assistants (PDAs) in recent years. Many wireless applications have been developed for those devices, including daily news update, classified advertising, tourist guide, wireless Web portals, and m-commerce applications. The ability to communicate from virtually anywhere and the convergence of Web and wireless technologies offer an unprecedented level of flexibility and convenience, particularly for ubiquitous information access through mobile devices. However, the unique features of wireless networks (for example, low bandwidth and unreliability) and mobile devices (for example, small screen size, and low memory and processing capability), as well as the mobility of users, present challenges for taking advantage of the convenience of mobile devices for information access. For example, most Web content is designed and optimized for desktop and broadband clients. Web content is poorly suited for mobile devices [11]; users who carry those devices around may need different information under different contexts. Therefore, how to adapt content to meet the needs of users, fit the characteristics of individual mobile devices, and adjust to dynamic context becomes important.

The World Wide Web Consortium (W3C) defines content adaptation as a process of selection, generation, or modification that produces one or more perceivable units in response to a requested uniform resource. In 2005, W3C announced the launch of a new Mobile Web Initiative (MWI), aiming to address the interoperability and usability problems in order to make “Web access from a mobile device as simple, easy, and convenient as Web access from a desktop device.” This article discusses Web content adaptation for mobile devices from several perspectives.

Back to Top

Selective Content Delivery

There are two types of content delivery to mobile device users: pull and push. In the pull model, a mobile client sends an information query to a server and the server returns the relevant content back. In the push model, a server automatically delivers content to mobile clients via a push proxy without receiving users’ requests. The push model is very useful in mobile applications such as news alert services, mobile advertising, and real-time traffic updates.

To prevent users from wading through a morass of possibly irrelevant content to find a single gem of information of interest, selecting and delivering content relevant to users’ interest is essential. This can be achieved by employing user profiles. A push proxy assesses the similarity between a Web page and a user profile to determine if it might be of interest to the user. Furthermore, a Web page can be partitioned into several blocks (for example, sports, business, health, advertisement, among others). Unnecessary or irrelevant blocks can be removed from the original page. A user profile in a mobile information system can consist of the following information about a user’s interests and preferences:

  • Demographic information;
  • Information interests (for example, represented by keywords);
  • Browsing history, such as recently visited Web sites, the time of last access, and visiting frequencies;
  • Content presentation preferences, which will be discussed later;
  • Quality of Service (QoS) preferences; and
  • Access privilege indicating what information a user can access;

User interests can be inferred and updated based on users’ explicit and/or implicit feedback (for example, browsing behavior on mobile devices) [2]. In a mobile computing environment, user profiles can be stored at different locations, including a single centralized server as the only profile server; different profile servers with duplicated or unduplicated user profiles; or local mobile devices.

The push model is generally used for multicasting information to a group of users. It, coupled with user profiles and intelligent agents, can also be used for content prefetching for individual users to minimize the transmission delay (sometimes the required information is not even accessible when it is needed due to a disconnected wireless network). The idea of prefetching is that a system delivers certain content to a local mobile device that will likely be accessed by the user soon. However, the prefetching decision is contingent upon different network conditions and the likelihood that the user will access this content shortly. Prefetching operations consume the already limited bandwidth of wireless networks and limited storage of mobile devices, and users often must pay for the service. It will be particularly expensive if the user does not view the prefetched content eventually. Therefore, it is vital not only to determine what content should be prefetched and when, but also to build utility models to analyze the trade-off between the potential benefit of prefetching and cost under current circumstances (for example, network conditions). For instance, [5] proposes a prefetching decision scheme that utilizes the access probabilities and prefetch thresholds. The access probabilities indicate how likely certain content will be requested by a user based on the user’s previous access history, while the prefetch thresholds computed based on system and network conditions, cost of bandwidth, and transmission time determine whether the performance may be improved by prefetching certain content.

The content delivery can also be context-aware. The term context refers to information that characterizes a situation related to the interaction between users, mobile applications, and the surrounding environment, such as information about a person, a place, or an object. Context information gathered from various sensors, networks, devices, user profiles, and other sources can trigger the content adaptation in order to cope with the dynamic environment. For example, in a museum, mobile device users should only receive corresponding introductory information when they enter different exhibition rooms. In the GUIDE project (a context-aware electronic tour guide) [4], visitors to a city can access context-aware information and services using their handheld GUIDE units. The information presented to visitors is tailored based on the visitor’s interest, current physical location, and attractions already visited.

Back to Top

Adaptive Content Presentation

While many of today’s mobile devices already feature Web browsers, browsing the Web on a mobile device has not become as convenient as expected. Mobile handheld devices are quite restrictive on the format and length of the received content. They typically display less than 20 lines of text on the screen; they may run different operating systems and support different markup languages. There is information loss when a Web site uses a presentational mode that a mobile device does not support. Currently, most Web pages are designed only for display on desktop computers, making direct presentation of those pages on small devices aesthetically unpleasant, difficult to navigate, and even completely illegible.

Merely squeezing original Web content into small screens may not work. Traditionally, device-specific authoring and multiple-device authoring approaches were used to adapt Web content presentation for effective display on mobile devices. They either authorized a set of Web pages that were designed and formatted up-front according to a predefined guideline for a specific device, or generated a set of different versions of the same Web page to cover a number of identified target devices. Obviously, those approaches are device dependent and inflexible. Therefore, automatic re-authoring and client-side navigation approaches seem more effective. Such approaches involve developing software to re-authorize a Web page in real time through a series of transformations, including layout change and content format reconfigurations, so that the page can be effectively displayed on a device and the user can interactively navigate the page.

Similar to a user profile, a device profile can be used to support device-related adaptation. It specifies the MIME media types and physical characteristics of a device including color depth, screen size, memory size, operating system, as well as supported markup languages. The generic Composite Capabilities/Preference Profiles (CC/PP) framework (www. provides a mechanism through which a mobile user agent, such as a browser, can transmit information about the mobile device. A user agent profile based on the CC/PP framework includes device hardware and software characteristics, information about the network to which the device is connected, and other attributes [6].

Figure 1 shows a few screen shots of a Yahoo! Web page displayed on a HP iPAQ h4355 Pocket PC with a 3.5″ transflective screen (Figure 1(a)). It has integrated Bluetooth and WLAN 802.11b for wireless communication and access to the Internet. Figure 1(b) shows the page displayed on that device without any adaptation. A user must use both vertical and horizontal scroll bars in order to see the entire content, which can be cumbersome and may cause loss of context.

There are some simple ways to adapt content presentation based on the features of a device and user’s preference to improve its navigation. For example, as shown in Figure 1(c), a “Fit to Screen” function can be activated to produce a scaled-down version (Figure 1(d)) of the original Web page to better fit the width of a device through syntactic translation (without removing any content from the original page); images embedded in a Web page and the Internet address bar can be removed to reduce the page size and increase display space; and the font size of textual content can be adjusted by the user. Such adaptation preferences, once defined, can be stored in the user profile and automatically used for future adaptation.

Various summarization and visualization techniques have also been used in content presentation adaptation for mobile devices [7, 10]. Web pages often contain many sections and not all of them are of interest to users. It is argued that the document summarization on handheld devices should make use of “hierarchical display,” which is suitable for navigation of a large document and ideal for small area display [10]. A Web page can be organized into a multi-level hierarchy with a thumbnail representation at the upper level for providing a global view and an index to a set of sub-pages at the lower level for details [3]. A user can select a desired portion of a Web page to zoom in for further details.

We have developed a Mobile Web system that automatically adapts the presentation of a Web page on a mobile device based on a three-tier architecture [1]. In addition to adaptation functions that users can activate, as shown in Figure 1(c), Mobile Web also features DOM (Document Object Model)-tree navigation, summarization, personalized topic spotting, and fisheye view, aiming to make Web browsing and information seeking on handheld devices more effective. By following the principle of “overview first, then zoom in for details,” Mobile Web first automatically parses a Web page and generates a DOM-tree hierarchical view of its content, as shown in Figure 2.

The main task of generating a DOM-tree is to identify content blocks and their relationships in a Web page and to extract labels that can represent those content blocks. A user can either expand any branch of the tree, or view the summary of a selected section that is dynamically generated based on heuristic rules. Based on the summary, the user can determine if he or she wants to see the full content of that section. Mobile Web stores users’ personal interest as keywords in their user profiles. When a Web page is displayed, those specified keywords appearing in the page will be automatically highlighted with different colors for easy spotting, and the page display is automatically anchored by those keyword occurrences. Focus+context visualization techniques are designed to integrate a high-detail focus area and a low-detail periphery in order to maximize display space. Via a customized fisheye view component in Mobile Web, users can navigate content through a focus-context view, with the focal content displayed in a larger font size, while peripheral content is still shown in the surrounding area with reduced granularity of detail, such as a smaller font size (see Figure 3).

Environmental context can also be used to adapt the content presentation. For example, when the light level is low or the device is on the move (for example, the user is walking), then the font size of textual content can be automatically enlarged to ease reading.

Back to Top

Adaptation of Multimedia Content

With advances in multimedia and wireless networking technologies, there is great potential to deliver multimedia content (for example, images, audio, and video) to mobile devices. NBC, for example, is considering delivering some TV programs to subscribers. Constraints of mobile devices and wireless networks, however, pose several challenges to multimedia-based mobile entertainment:

  • Low and varied network bandwidth will cause long latency while transmitting multimedia content over wireless networks.
  • A mobile device will not be able to view an audio or video stream if it does not have enough decoding power.
  • Different mobile devices support different media formats. Video on a streaming server must be encoded in an appropriate way so that it can be decoded on the client side.
  • Mobile devices have limited memory capacity, which may be insufficient for viewing multimedia content, particularly video.

When a user accesses multimedia content on a mobile device, a major cost is the long transmission latency due to the large data size, limited network bandwidth, and low local memory. As a result, it is essential to develop effective adaptation approaches to minimizing this cost while maintaining a certain level of multimedia content quality. There are several key requirements for multimedia content adaptation: automated adaptation without user intervention; graceful quality degradation; seamless handoffs across networks during roaming; and high QoS with low jitter, delay, and guaranteed bandwidth. From a QoS perspective, sometimes users do not need a best-quality rendition, but rather good-enough quality to convey the needed information [8]. Minimum QoS should be defined to support smooth audio/video playback in a wireless environment. A set of quality attributes (for example, color, image resolution, frame rate, scaling, or modality) can be specified for different types of multimedia content for QoS-based content adaptation.

Content providers can encode multimedia content with specific parameters, or a media converter can convert it to another format to better fit the delivery context. For example, in a traffic-heavy network, an adaptive system may regenerate content with fewer colors and lower resolutions in order to reduce transmission latency. It can also switch media modality in order to suit the current network bandwidth.

A variety of approaches can be applied to implement adaptation for multimedia content [9]:

  • Multiple encoding. Here, servers store multiple copies of the same image or audio/video stream with different encoding methods or parameters. Applications dynamically choose an appropriate copy based on current network condition.
  • Transcoding. This refers to the mapping of a non-scalable stream to another non-scalable stream with a different compression rate (for example, MPEG to H.263). Transcoding avoids the necessity of storing multiple files corresponding to various bit rates. Since this approach requires decoding and recoding of each media stream, it is computation-intensive and requires deep understanding of different encoding and decoding schemes.
  • Layered encoding (transcaling and multicasting). This is probably the most popular way to provide adaptation for multimedia content. This approach usually generates a base layer and one or more enhancement layers to cover the desired bandwidth range. Layers can be added or dropped by joining or leaving a multicast group.
  • Rate shaping, or allowing an application to change media encoder parameters such as image resolution, video frame rate, quantization parameter, and movement detection threshold.

We believe that enabling access to adaptive, personalized, and context-aware information and service is crucial to fully take advantage of the pervasiveness and convenience of mobile devices. It will not only encourage users to fully embrace mobile technologies, but also promote development of innovative mobile applications.

Back to Top

Back to Top

Back to Top


F1 Figure 1. Adaptive display of Web content with reconfigurations.

F2 Figure 2. A DOM-tree navigation of the MSN home page via Mobile Web.

F3 Figure 3. Analysis results.

Back to top

    1. Adipat, B. and Zhang, D. Adaptive and Personalized Interfaces for Mobile Web. Proceedings of the 15th Annual Workshop on Information Technologies and Systems (WITS'05). Las Vegas, NV, 2005. 21–26.

    2. Billsus, D., Pazzani, M. and Chen, J. A learning agent for wireless news access. In Proceedings of the International Conference on Intelligent User Interfaces. (New Orleans, LA, Jan. 9–12, 2000), 33–36.

    3. Buyukkokten, O., Garcia-Molina, H., and Paepcke, A. Seeing the whole in parts: Text summarization for Web browsing on handheld devices. In Proceedings of the 10th International WWW Conference. Hong Kong (May 1–5, 2001).

    4. Cheverst, K., Davies, N., Mitchell, K., and Friday, A. Experiences of developing and deploying a context-aware tourist guide: The GUIDE Project. In Proceedings of the 6th Annual International Conference on Mobile Computing and Networking. (Boston, MA, Aug. 6–11, 2000), 20–31.

    5. Jiang, Z. and Kleinrock, L. Web prefetching in a mobile environment. IEEE Personal Communication (Oct. 1998), 25–34.

    6. Laakko, T. and Hiltunen, T. Adapting Web content to mobile user agents. IEEE Internet Computing (March–April, 2005), 46–53.

    7. Lank, E. and Phan, S. Focus+context sketching on a pocket PC. In Proceedings of ACM CHI 2004 (Apr. 24–29, 2004, Vienna, Austria), 1275–1278.

    8. Lum, W. and Lau, F. User-centric content negotiation for effective adaptation service in mobile computing. IEEE Transactions on Software Engineering 29, (2003), 1100–1111.

    9. Mao, Z., So, H., Kang, B., and Katz, R. Network support for mobile multimedia using a self-adaptive distributed proxy. In Proceedings of the 11th International Workshop on Network and Operating Systems Support for Digital Audio and Video. Port Jefferson, NY, (June 25–26, 2001), 107–116.

    10. Yang, C.C. and Wang, F.L. Fractal summarization for mobile devices to access large documents on the Web. In Proceedings of the International WWW Conference (Budapest, Hungary, May 20–24, 2003), 215–224.

    11. Zhang, D. and Adipat, B. Challenges, methodologies, and issues in the usability testing of mobile applications. International Journal of Human Computer Interaction 18, 3 (2005), 293–308.

Join the Discussion (0)

Become a Member or Sign In to Post a Comment

The Latest from CACM

Shape the Future of Computing

ACM encourages its members to take a direct hand in shaping the future of the association. There are more ways than ever to get involved.

Get Involved

Communications of the ACM (CACM) is now a fully Open Access publication.

By opening CACM to the world, we hope to increase engagement among the broader computer science community and encourage non-members to discover the rich resources ACM has to offer.

Learn More