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
WebViewand 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.