1page.title=Web Apps Overview 2@jd:body 3 4<div class="figure" style="width:327px"> 5 <img src="{@docRoot}images/webapps/webapps.png" alt="" /> 6 <p class="img-caption"><strong>Figure 1.</strong> You can make your web content available to 7users in two ways: in a traditional web browser and in an Android application, by 8including a WebView in the layout.</p> 9</div> 10 11<p>There are essentially two ways to deliver an application on Android: as a 12client-side application (developed using the Android SDK and installed on user devices as an {@code 13.apk}) or as a web application (developed using web standards and accessed through a web 14browser—there's nothing to install on user devices).</p> 15 16<p>The approach you choose for your application could depend on several factors, but Android makes 17the decision to develop a web application easier by providing:</p> 18<ul> 19 <li>Support for viewport properties that allow you to properly size your web application 20based on the screen size</li> 21 <li>CSS and JavaScript features that allow you to provide different styles and images 22based on the screen's pixel density (screen resolution)</li> 23</ul> 24 25<p>Thus, your decision to develop a web application for Android can exclude consideration for 26screen support, because it's already easy to make your web pages look good on all types of screens 27powered by Android.</p> 28 29<p>Another great feature of Android is that you don't have to build your application purely on 30the client or purely on the web. You can mix the two together by developing a client-side Android 31application that embeds some web pages (using a {@link android.webkit.WebView} in your Android 32application layout). Figure 1 visualizes how you can provide access to your web pages from either 33a web browser or your Android application. However, you shouldn't develop an Android 34application simply as a means to launch your web site. Rather, the web pages you embed in your 35Android application should be designed especially for that environment. You can even define an 36interface between your Android application and your web pages that allows JavaScript in the web 37pages to call upon APIs in your Android application—providing Android APIs to your web-based 38application.</p> 39 40<p>Since Android 1.0, {@link android.webkit.WebView} has been available for Android 41applications to embed web content in their layout and bind JavaScript to Android APIs. After 42Android added support for more screen densities (adding support for high and low-density 43screens), Android 2.0 added features to the WebKit framework to allow web pages to specify 44viewport properties and query the screen density in order to modify styles 45and image assets, as mentioned above. Because these features are a part of Android's WebKit 46framework, both the Android Browser (the default web browser provided with the platform) and 47{@link android.webkit.WebView} support the same viewport and screen density features.</p> 48 49<p>To develop a web application for Android-powered devices, you should read the 50following documents:</p> 51 52<dl> 53 <dt><a href="{@docRoot}guide/webapps/targeting.html"><strong>Targeting Screens from Web 54Apps</strong></a></dt> 55 <dd>How to properly size your web app on Android-powered devices and support 56multiple screen densities. The information in this document is important if you're building a web 57application that you at least expect to be available on Android-powered devices (which you should 58assume for anything you publish on the web), but especially if you're targeting mobile devices 59or using {@link android.webkit.WebView}.</dd> 60 <dt><a href="{@docRoot}guide/webapps/webview.html"><strong>Building Web Apps in 61WebView</strong></a></dt> 62 <dd>How to embed web pages into your Android application using {@link android.webkit.WebView} and 63bind JavaScript to Android APIs.</dd> 64 <dt><a href="{@docRoot}guide/webapps/debugging.html"><strong>Debugging Web Apps</strong></a></dt> 65 <dd>How to debug web apps using JavaScript Console APIs.</dd> 66 <dt><a href="{@docRoot}guide/webapps/best-practices.html"><strong>Best Practices for Web 67Apps</strong></a></dt> 68 <dd>A list of practices you should follow, in order to provide an effective web application on 69Android-powered devices.</dd> 70</dl> 71 72
