mobile web

Jump to: navigation, search

Mobile Web

This article is Ready to Use.


A starting point for mobile web development, with links to resources and a collection of mobile development techniques.

General introductory articles

About mobile web - Start here to get a general history of the mobile web and what it means to support different devices with a wide range of browsing capabilities.

Detecting device and browser - The basics of browser detection for mobile devices. Smartphones usually have better detection capabilities than low cost feature phones, which may not support CSS or JavaScript. This article explains techniques commonly used on today's mobile websites.

"Mobifying" your HTML5 site - Real examples showing how to support mobile with HTML5 features.

List of all mobile web related articles

Page Summary
Battery Status API Provides information about the battery status of the hosting device.
BatteryManager The object that exposes the battery status information.
charging Represents if the system's battery is charging.
chargingTime Represents the time remaining in seconds until the system's battery is fully charged.
chargingchange Fired when the battery charging state is updated.
chargingtimechange Fired when the battery charging time is updated.
dischargingTime Represents the time remaining in seconds until the system's battery is completely discharged and the system is about to be suspended.
dischargingtimechange Fired when the battery discharging time is updated.
level Represents the current battery level scaled from 0 to 1.0.
levelchange Fired when the battery level is updated.
onchargingchange Handles the chargingchange event.
onchargingtimechange Handles the chargingtimechange event.
ondischargingtimechange Handles the dischargingtimechange event.
onlevelchange Handles the levelchange event.
NavigatorBattery The NavigatorBattery interface is exposed on the Navigator object.
battery The object that exposes the battery status information.
autoExposureMode This reflects the desired auto exposure mode setting.
autoWhiteBalanceMode This reflects whether automatic White Balance Mode selection is desired.
brightness This reflects the desired brightness setting of the camera.
contrast This reflects the desired contrast setting of the camera.
exposureCompensation This reflects the desired exposure compensation setting.
imageHeight This reflects the desired image height.
imageWidth This reflects the desired image width.
iso This reflects the desired camera ISO setting.
redEyeReduction This reflects whether camera red eye reduction is desired.
saturation This reflects the desired saturation setting of the camera.
sharpness This reflects the desired sharpness setting of the camera.
whiteBalanceMode This reflects the desired white balance mode setting.
PhotoSettingsOptions Provides the photo-specific settings options and current settings values.
Network Information API Provides an interface for web applications to access the underlying connection information of the device.
Connection Provides a handle to the device's connection information.
bandwidth An estimation of the current bandwidth in MB/s (Megabytes per seconds) available.
change Fires when the Connection changes.
metered A connection is metered when the user's connection is subject to a limitation from his Internet Service Provider strong enough to request web applications to be careful with the bandwidth usage.
onchange Handles the change event, fired when the Connection changes.
NetworkInformation Is exposed on the Navigator object, and all instances of the Navigator type are defined to also implement the NetworkInformation interface.
connection The object from which connection information is accessed.
Vibration API The Vibration API provides access to the vibration mechanism of the hosting device. Vibration is a form of tactile feedback, often used by mobile phones.
Detecting device and browser This article explains client and server-side techniques for detecting browser capabilities.
HTML5 hybrid applications A hybrid app is a native mobile app that is built using the web platform that uses a native ‘shell’ to wrap the web content.  Hybrid apps are installed through an app store, run on the device and provide access to enhanced native device hardware, but are written primarily using HTML, CSS and JavaScript.  Instead of using the native SDK to create the application, hybrid apps typically wrap a web application with a native web view controller full screen, without the address bar or other normal browser controls.
Proxy-based browsers This article will give an overview of proxy based browsers. Some solution transform web pages into compact formats. Some solution only provides data compression.
High DPI Images for Variable Pixel Densities One of the features of today's complex device landscape is that there's a very wide range of screen pixel densities available. Some devices feature very high resolution displays, while others straggle behind. Application developers need to support a range of pixel densities, which can be quite challenging. The goal of web app developers is to serve the best quality images as efficiently as possible. This article will cover some useful techniques for doing this today and in the near future.
Mobile web debugging Debugging web applications on multiple platforms requires careful prioritisation, different from developing for desktop alone. This article explains techniques and tools available, with links to external resources., Debugging web applications on multiple platforms requires careful prioritisation. This article explains techniques and tools available, with links to external resources.
Mobile-friendly web design and development overview Mobile friendly: web design and development Overview (start with a basis of semantic HTML, accessibility best practices are Making an app or site mobile friendly. Do you create a different site, or do you adapt your existing site for mobile? A brief introduction to Adaptive design - graceful degradation, progressive enhancement, using media queries and viewport to adapt layout, using feature detection to server appropriate content and services, geolocation, multimedia, offline apps, don't use browser sniffing!) A lot of this will be covered elsewhere.
Mobile JavaScript best practices What to know, what to watch out for to make your apps perform at their best.
Mobile web This concept page explains in general terms what mobile web is and its brief history.
Responsive Web Design Responsive Web Design is an approach that emphasises design which works well across a variety of devices and browsing contexts -- without serving different content for each different operating system, device, browser, display size or pixel density.
capture The capture attribute facilitates user access to a device's media capture mechanism, such as a camera, or microphone, from within a file upload control, for capturing media on the spot.
Introduction to using the application cache An introduction to using the appcache interface for offline application functionality.
Building web games With the combination of developments in HTML5 and improvements to modern browsers, it's now possible to build high-quality games using web technologies.

In this document, we'll provide you with the tools, frameworks, and tutorials you'll need to create games. We'll also explain how they should be used and how they fit together.

See more pages...

See also

External resources