Mobile Web Development: Building mobile websites, SMS and MMS messaging, mobile payments, and automated voice call systems with XHTML MP, WCSS, and mobile AJAX

236 Pages·2008·5.02 MB·English

by  Nirav Mehta

Mobile Web Development
Building mobile websites, SMS and MMS messaging,
mobile payments, and automated voice call systems
with XHTML MP, WCSS, and mobile AJAX
Nirav Mehta
BIRMINGHAM - MUMBAI
Mobile Web Development
Copyright © 2008 Packt Publishing
All rights reserved. No part of this book may be reproduced, stored in a retrieval
system, or transmitted in any form or by any means, without the prior written
permission of the publisher, except in the case of brief quotations embedded in
critical articles or reviews.
Every effort has been made in the preparation of this book to ensure the accuracy of
the information presented. However, the information contained in this book is sold
without warranty, either express or implied. Neither the author, Packt Publishing,
nor its dealers or distributors will be held liable for any damages caused or alleged to
be caused directly or indirectly by this book.
Packt Publishing has endeavored to provide trademark information about all the
companies and products mentioned in this book by the appropriate use of capitals.
However, Packt Publishing cannot guarantee the accuracy of this information.
First published: February 2008
Production Reference: 1300108
Published by Packt Publishing Ltd.
32 Lincoln Road
Olton
Birmingham, B27 6PA, UK.
ISBN 978-1-847193-43-8
www.packtpub.com
Cover Image by Bharath Kumar ([email protected])
Credits
Author Project Coordinators
Nirav Mehta Snehal Raut
Zenab Kapasi
Reviewer
Michael Peacock Indexer
Hemangini Bari
Senior Acquisition Editor
David Barnes Proofreader
Chris Smith
Development Editor
Nikhil Bangera Production Coordinators
Aparna Bhagat
Technical Editor Shantanu Zagade
Ajay Shanker
Cover Work
Editorial Manager Aparna Bhagat
Mithil Kulkarni
Project Manager
Abhijeet Deobhakta
About the Author
Nirav Mehta is renowned for his entrepreneurial ventures, his breakthrough
ideas, and his contribution to open source. Nirav leads a software development
company—Magnet Technologies—from India that specializes in Rich Internet
Applications, Web, and Mobile. Nirav believes in simplifying the most complicated
ideas and presenting them in lucid language.
Over the last ten years, Nirav has written and spoken on a variety of topics. He has
also been instrumental in localization efforts in India and training programmers to be
effective developers. He blogs at www.mehtanirav.com.
My love and thanks to my parents. It's your support and freedom
that lets me do all things I love! Thank you!

I would like to thank Mayank Sharma, for his recommendations.
Without you, the book wouldn't be possible.

Thanks to David Barnes, Packt's Acquisition Editor. Your comments,
guidance, and blog have inspired me a lot.

I would like to thank Micheal Peacock and the team at Packt—Nikhil
Bangera, Patricia Weir, Snehal Raut, Ajay Shanker, Sagara Naik, and
everyone else. You guys are amazing! I will always remember how
hard you worked to get the book out near my wedding, and the
superb suggestions throughout.

Of course, the team at Magnet! Ashok, Vishal, and Harshad—you
have been with me in all the ups and downs, I cherish your
partnership. All Magneteers, thank you for being a great team!

I also appreciate the readers of this book! I believe you are up to
something big, and hope my work helps you achieve it.

And finally, my wonderful wife, Nikita. I stole time from you for the
book. Thanks for your constant love, encouragement, and reminders!
About the Reviewer
Michael Peacock is a web developer and senior partner of Peacock, Carter &
Associates ( http://www.peacockcarter.co.uk) a web design and development
business. Michael loves building websites and web applications, and when he isn't,
likes to read, watch films, and occasionally take part in amateur dramatics.

Table of Contents
Preface 1
Chapter 1: Getting Mobile 9
What is Mobile Web? 10
Mobile Web Integration is Connecting the Two! 10
The First Step—Understanding Mobile Devices 11
Mobile Phones 11
PDAs 13
Other Devices 13
Mobile Data Usage is Exploding 13
Mobile Usage Around the World is Not the Same 14
Mobiles and Desktops 15
People Use Their Mobiles Differently Than Their Desktops 15
How Would You Do This Using Your Mobile? 16
It's Not All Rosy—Mobile Devices have Limitations 18
Advantages of Mobile Web 18
But There are Many Ways to Do Mobile Web Development! 19
What About WAP? 19
Bringing Order with Standards and Guidelines 20
Adaptation is Better, but LCD is Easier 21
Summary 21
Chapter 2: Starting Your Mobile Site 23
Pizza On The Run and the Mobile Web 23
Different Options for Going Mobile 24
Do Nothing 25
When to Use This Approach 25
When to Avoid This Approach 25
Remove Formatting 25
When to Use This Approach 26
When to Avoid This Approach 26
Table of Contents
CSS-Based Design 26
When to Use This Approach 27
When to Avoid This Approach 27
Mobile Site 27
When to Use This Approach 27
When to Avoid This Approach 28
Mobile Navigation and Information Architecture 28
Step-By-Step: Planning the Structure of Your Mobile Site 29
Handy Tips in Structuring Your Mobile Site 31
Setting Up the Development Environment 31
Hosting Your Mobile Site is Trivial 35
POTR Mobile Homepage 35
Making a Call is as Simple as Email 37
Understanding the Homepage 37
Document Structure 37
Fundamentals of XHTML MP 38
Before Writing Further Code, Let's Learn Some Grammar 38
Most Common HTML Elements are Supported 40
XHTML MP Does Not Support Many WML Features 41
Summary 42
Chapter 3: Building Pizza On The Run 43
Luigi's Pizza On The Run 43
Designing Layouts for the Mobile Web 44
Mobile Screen Sizes 44
Colors, Images, Page Sizes, and More 45
To Mobile or Not to Mobile? 45
Web Layouts Don't Work on Mobile Devices 46
Using Wireless CSS as the Silver Bullet, Almost! 47
Creating the Database and Code Architecture for POTR 51
Classes for POTR 51
Database Schema 52
Coding Framework 53
Redoing the POTR Homepage 54
Form Elements Don't Look the Same Across Browsers 56
Form Processing Does not Change! 58
Handling Sessions and User Login 59
Taking Orders 61
Constraining User Input with WCSS 64
Single-Step Registration and Order Placement on POTR 66
Special Effects with CSS 69
[ ii ]
Table of Contents
Luigi's Pizza On The Run is Live! 70
Summary 70
Chapter 4: Adapting to User Devices 73
What is Adaptation? 73
Do I Need Adaptation? 74
Can't I just Use Common Capabilities and Ignore the Rest? 74
How to Determine the LCD? 74
OK, So How do I Adapt? 75
Fancy Pizza Selection 76
What are Those <wall:*> Tags? 77
Let's Make Sense of This Code! 78
Can I Use All XHTML Tags? 79
Will This Work Well for WML? 80
Device Detection and Capabilities 80
XML Processing can Bog Down My Server, is There Something Easier? 81
What About W3C's DIAL? 82
Other Useful Tools for Adaptation 82
Dynamically Resizing Images 82
Quick and Easy Way to Make Your Blog Mobile 82
MyMobileWeb: Going the Semantic Way 83
HAWHAW: As Simple as a Laugh? 84
Summary 84
Chapter 5: Developing Standards- Compliant Sites 85
Running the ready.mobi Test 85
Time for Action: Test Your Site's Mobile Readiness with the ready.mobi Test 86
Creating the Structure, Design, Markup, and Navigation for
Best User Experience 89
Mobile Web Development Checklists 90
Strategy 90
Testing Setup 90
Structure and Page Information 91
Design and CSS 91
Images 92
Navigation and Links 92
Content 92
Markup 93
User Input 93
Objects, Security, Caching, Etc. 93
Best Practices should be Upgraded! 93
Most Good Styles of Design and Software will Work
on the Mobile Web Too 94
[ iii ]