1 page.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 7 users in two ways: in a traditional web browser and in an Android application, by 8 including a WebView in the layout.</p> 9 </div> 10 11 <p>There are essentially two ways to deliver an application on Android: as a 12 client-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 14 browser—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 17 the 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 20 based on the screen size</li> 21 <li>CSS and JavaScript features that allow you to provide different styles and images 22 based 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 26 screen support, because it's already easy to make your web pages look good on all types of screens 27 powered by Android.</p> 28 29 <p>Another great feature of Android is that you don't have to build your application purely on 30 the client or purely on the web. You can mix the two together by developing a client-side Android 31 application that embeds some web pages (using a {@link android.webkit.WebView} in your Android 32 application layout). Figure 1 visualizes how you can provide access to your web pages from either 33 a web browser or your Android application. However, you shouldn't develop an Android 34 application simply as a means to launch your web site. Rather, the web pages you embed in your 35 Android application should be designed especially for that environment. You can even define an 36 interface between your Android application and your web pages that allows JavaScript in the web 37 pages to call upon APIs in your Android application—providing Android APIs to your web-based 38 application.</p> 39 40 <p>Since Android 1.0, {@link android.webkit.WebView} has been available for Android 41 applications to embed web content in their layout and bind JavaScript to Android APIs. After 42 Android added support for more screen densities (adding support for high and low-density 43 screens), Android 2.0 added features to the WebKit framework to allow web pages to specify 44 viewport properties and query the screen density in order to modify styles 45 and image assets, as mentioned above. Because these features are a part of Android's WebKit 46 framework, 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 50 following documents:</p> 51 52 <dl> 53 <dt><a href="{@docRoot}guide/webapps/targeting.html"><strong>Targeting Screens from Web 54 Apps</strong></a></dt> 55 <dd>How to properly size your web app on Android-powered devices and support 56 multiple screen densities. The information in this document is important if you're building a web 57 application that you at least expect to be available on Android-powered devices (which you should 58 assume for anything you publish on the web), but especially if you're targeting mobile devices 59 or using {@link android.webkit.WebView}.</dd> 60 <dt><a href="{@docRoot}guide/webapps/webview.html"><strong>Building Web Apps in 61 WebView</strong></a></dt> 62 <dd>How to embed web pages into your Android application using {@link android.webkit.WebView} and 63 bind 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 67 Apps</strong></a></dt> 68 <dd>A list of practices you should follow, in order to provide an effective web application on 69 Android-powered devices.</dd> 70 </dl> 71 72
