Web Apps Overview

Figure 1. You can make your web content available to users in two ways: in a traditional web browser and in an Android application, by including a WebView in the layout.

There are essentially two ways to deliver an application on Android: as a client-side application (developed using the Android SDK and installed on user devices as an .apk) or as a web application (developed using web standards and accessed through a web browser—there's nothing to install on user devices).

The approach you choose for your application could depend on several factors, but Android makes the decision to develop a web application easier by providing:

  • Support for viewport properties that allow you to properly size your web application based on the screen size
  • CSS and JavaScript features that allow you to provide different styles and images based on the screen's pixel density (screen resolution)

Thus, your decision to develop a web application for Android can exclude consideration for screen support, because it's already easy to make your web pages look good on all types of screens powered by Android.

Another great feature of Android is that you don't have to build your application purely on the client or purely on the web. You can mix the two together by developing a client-side Android application that embeds some web pages (using a WebView in your Android application layout). Figure 1 visualizes how you can provide access to your web pages from either a web browser or your Android application. However, you shouldn't develop an Android application simply as a means to launch your web site. Rather, the web pages you embed in your Android application should be designed especially for that environment. You can even define an interface between your Android application and your web pages that allows JavaScript in the web pages to call upon APIs in your Android application—providing Android APIs to your web-based application.

Since Android 1.0, WebView has been available for Android applications to embed web content in their layout and bind JavaScript to Android APIs. After Android added support for more screen densities (adding support for high and low-density screens), Android 2.0 added features to the WebKit framework to allow web pages to specify viewport properties and query the screen density in order to modify styles and image assets, as mentioned above. Because these features are a part of Android's WebKit framework, both the Android Browser (the default web browser provided with the platform) and WebView support the same viewport and screen density features.

To develop a web application for Android-powered devices, you should read the following documents:

Targeting Screens from Web Apps
How to properly size your web app on Android-powered devices and support multiple screen densities. The information in this document is important if you're building a web application that you at least expect to be available on Android-powered devices (which you should assume for anything you publish on the web), but especially if you're targeting mobile devices or using WebView.
Building Web Apps in WebView
How to embed web pages into your Android application using WebView and bind JavaScript to Android APIs.
Debugging Web Apps
How to debug web apps using JavaScript Console APIs.
Best Practices for Web Apps
A list of practices you should follow, in order to provide an effective web application on Android-powered devices.
↑ Go to top