Chapter 7
Enhancing the User Experience
WHAT YOU WILL LEARN IN THIS CHAPTER:
- Building a tab bar–style app
- Using the built-in jQuery Mobile scrolling feature
- Using the iScroll library for near-native content scrolling
- Playing audio files in your app
- Playing video files in your app
- Launching other apps from your app
In this chapter, you’ll learn how to provide an improved user experience by making your app look and feel like native apps. You’ll also learn how to play multimedia content and how to interact with other apps on the device.
By building your app using HTML5, you get to reach the widest audience possible because your app is cross-platform out of the box. The challenge is to avoid giving your app a lowest-common-denominator interface that is obviously implemented using HTML. This chapter looks at a few techniques you can use to avoid this.
CREATING A CLASSIC TAB BAR INTERFACE
Mobile web apps built using HTML5 are usually productivity-style apps. If you go to the iPhone App Store or the Android Marketplace and take a look at the apps in the productivity category, you’ll notice that many of them have a tab bar at the bottom. This layout style presents a row of tabs at the bottom of the screen. Tapping a tab opens a new page of the app. Each tab corresponds to a logical grouping of app features. Most apps have between four and six tabs.
This layout style is so common that the native code libraries provide preconfigured classes that make it easy for developers to build tab ...
