Smashing mobile web development : going mobile with HTML5, CSS3, and Javascript

If you're a devoted reader of Smashing Magazine, you know that all development roads now lead to mobile, so desktop-browser-based web developers need to get up to speed and soon. Start migrating your abilities to mobile with this terrific book. It first helps you make the switch to HTML5 and CSS3, before teaching you how to apply those skills to build websites that work across all mobile devices and mobile browsers.

Topics include using wireframes and templates, understanding frameworks such as jQuery Mobile, getting up to speed on newer technologies such as Boilerplate, and more.

Essential guide for web developers who want to build websites that work across all mobile devices and mobile browsers
Explains the essential tools you'll need for web mobile, including HTML5, CSS3, and JQuery Mobile
Brings you up to speed on newer tools such as Boilerplate Keeps your professional skills up to date with today's technology trends

By the time you finish Smashing Mobile Web Development , you'll have built your own mobile website that incorporates geolocation, social media, and more.

Author Notes

Greg Avola is a co-founder and CTO for a social startup, Untappd, that helps users track, recommend, and discover new beers, breweries, and beer venues. The Untappd mobile app was built using the HTML5/CSS/JS technologies that are discussed throughout this book.
Jon Raasch is a front-end web developer and designer who has been programming for the web for more than 15 years. Using modern programming techniques, he designs user interfaces that are dynamic and engaging and make full use of search engine spiderability. By integrating design, development, and branding, he makes websites that are as accessible to users as they are to Googlebot.

Part I Introduction to HTML5/JS/CSS	p. 5
Chapter 1 Introduction to Mobile Web Development	p. 7
Mobile Web Examples	p. 8
Understanding Native Versus Web Platforms	p. 9
Pros and Cons of Native Versus Web Platforms	p. 9
Web-to-Native Solutions	p. 11
Devices and Operating Systems	p. 12
Design Aesthetics	p. 13
Dialog Boxes	p. 14
iOS Design Patterns	p. 14
Android Design Patterns	p. 14
Viewports	p. 14
Orientations	p. 16
Fonts	p. 16
Summary	p. 18
Chapter 2 Overview of Mobile Technologies	p. 19
HTML	p. 20
Key HTML5 Features	p. 20
CSS3	p. 28
Key CSS3 Features	p. 29
Javascript	p. 34
jQuery	p. 34
XUI	p. 34
Zepto	p. 35
jQTouch	p. 35
UI Frameworks/Utilities	p. 35
Sencha Touch	p. 35
jQuery Mobile	p. 35
Modernizr	p. 36
iScroll	p. 36
Mustache/JavaScript Templates	p. 37
Summary	p. 38
Part II Application Setup and Infrastructure	p. 39
Chapter 3 Development and Production Setup	p. 41
Development Setup	p. 42
Implementing Local Hosting	p. 43
Setting Up MAMP (For Mac OS X)	p. 43
XAMPP for Windows	p. 45
Using IDEs to Write Your Web App	p. 48
Testing Your Code	p. 51
Setting Up the Production Environment	p. 57
Hosting	p. 57
Infrastructure Setup	p. 58
Managing Bandwidth	p. 59
Summary	p. 59
Chapter 4 Creating the Prototype	p. 61
Using HTML5 to Aid in Structure and Design	p. 62
Using the HTML5 Mobile Boilerplate	p. 62
Application Design	p. 63
Mocking Up Your Pages	p. 64
Settings/About	p. 65
Defining Hash Navigation	p. 73
Pushstate Navigation	p. 75
Summary	p. 76
Chapter 5 Mobile Web Structure	p. 77
Elements to Build	p. 78
Centering Your Content with Viewports	p. 78
Using Full App Mode (iOS Only)	p. 79
Adding Header and Navigation Elements	p. 87
Adding Hash Change Events	p. 89
Transitions	p. 90
Letting Users Scroll Through App Pages	p. 92
Allowing Your Application to Adapt to Orientation Changes	p. 95
Summary	p. 99
Chapter 6 Creating a Mobile Web Database	p. 101
Elements to Build	p. 102
Databases in HTML5	p. 102
Summary	p. 112
Part III Development	p. 113
Chapter 7 Interacting with Web SQL	p. 115
Elements to Build	p. 116
Creating the Database and Its Tables	p. 116
Adding Values to the Color Table	p. 118
Building the Manage Wine Page	p. 119
Summary	p. 134
Chapter 8 Geolocation and AJAX	p. 135
Elements to Build	p. 136
Creating the Find Tab	p. 136
Creating the Callback	p. 139
Handling Location with Google Maps	p. 140
Using the Foursquare API to Find Venues	p. 143
Creating the Info Window	p. 147
Building the Refresh Button	p. 150
Summary	p. 152
Chapter 9 Running Queries and Connecting with Social Media	p. 153
Elements to Build	p. 154
Creating the Activity Tab	p. 154
Writing the Query	p. 154
Working with Templates	p. 156
Using Templates to Build the Activity Feed	p. 158
Running Your Script and Displaying the Results Correctly	p. 161
Creating the Wine Detail Page	p. 162
Creating the Wine Detail Page Structure	p. 162
Building the Wine Detail Page Logic	p. 163
Showing Detail on the Page	p. 166
Connecting to External Sites	p. 167
Building the Template	p. 167
Creating the List View	p. 170
Building the Template for Your Tweets	p. 172
Defining a Custom Function for Relative Timestamps	p. 174
Tweaking the Timestamp	p. 175
Changing the Tweet in the List View	p. 177
Sharing on Twitter and Facebook	p. 178
Summary	p. 179
Chapter 10 Location Storage and Search	p. 181
Elements to Build	p. 182
Creating the Mystorage Function	p. 182
Caching Geolocation and Venues	p. 184
Caching Tweets	p. 188
Saving Details in the Settings Tab	p. 189
Searching Your History	p. 191
Summary	p. 195
Part IV Performance and Production	p. 197
Chapter 11 Testing and Organizing Your code	p. 199
Organizing Your JavaScript Files	p. 200
Setting Up Global.js	p. 201
Creating Database.js	p. 202
Creating Util.js	p. 202
Creating Social.js	p. 203
Creating Geo.js	p. 203
Creating Helper.js	p. 203
Putting It All Together	p. 204
Loading Your JavaScript Files	p. 204
Head.js	p. 205
Manifest Cache	p. 205
Decrease Your Javascript Footprint	p. 206
Mobile Testing Techniques	p. 207
Testing For Corks	p. 207
Summary	p. 209
Chapter 12 Preparing for Launch	p. 211
Debugging Tips	p. 212
Testing Environments	p. 212
Development Tools	p. 215
Touch Vs. Mouse Events	p. 221
Performance Tips	p. 221
Mobile Bandwidth	p. 222
JavaScript Optimizations	p. 224
CSS Optimizations	p. 229
Summary	p. 233
Appendix A: HTML5, CSS3, and JavaScript Concepts	p. 235
HTML5	p. 236
Markup	p. 236
Geolocation	p. 238
DOM Storage	p. 240
Cache Manifest	p. 242
CSS3	p. 245
Box Shadow	p. 245
Gradients	p. 249
CSS Animation	p. 257
JavaScript	p. 265
Basic Events	p. 265
Touch Events	p. 267
jQuery	p. 271
Summary	p. 277
Index	p. 279

Available:*

On Order

Summary

Summary

Author Notes

Table of Contents