Tải bản đầy đủ (.pdf) (411 trang)

webkit for dummies [electronic resource]

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (33.58 MB, 411 trang )


WebKit
FOR

DUMmIES

by Chris Minnick
WebKit
FOR

DUMmIES

WebKit For Dummies
®
Published by
John Wiley & Sons, Inc.
111 River Street
Hoboken, NJ 07030-5774
www.wiley.com
Copyright © 2012 by John Wiley & Sons, Inc., Hoboken, New Jersey
Published by John Wiley & Sons, Inc., Hoboken, New Jersey
Published simultaneously in Canada
No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or
by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as permit-
ted under Sections 107 or 108 of the 1976 United States Copyright Act, without either the prior written
permission of the Publisher, or authorization through payment of the appropriate per-copy fee to the
Copyright Clearance Center, 222 Rosewood Drive, Danvers, MA 01923, (978) 750-8400, fax (978) 646-8600.
Requests to the Publisher for permission should be addressed to the Permissions Department, John Wiley
& Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201) 748-6008, or online at http://


www.wiley.com/go/permissions.
Trademarks: Wiley, the Wiley logo, For Dummies, the Dummies Man logo, A Reference for the Rest of Us!,
The Dummies Way, Dummies Daily, The Fun and Easy Way, Dummies.com, Making Everything Easier, and
related trade dress are trademarks or registered trademarks of John Wiley & Sons, Inc. and/or its afli-
ates in the United States and other countries, and may not be used without written permission. All other
trademarks are the property of their respective owners. John Wiley & Sons, Inc. is not associated with any
product or vendor mentioned in this book.
LIMIT OF LIABILITY/DISCLAIMER OF WARRANTY: THE PUBLISHER AND THE AUTHOR MAKE NO
REPRESENTATIONS OR WARRANTIES WITH RESPECT TO THE ACCURACY OR COMPLETENESS OF
THE CONTENTS OF THIS WORK AND SPECIFICALLY DISCLAIM ALL WARRANTIES, INCLUDING WITH-
OUT LIMITATION WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE. NO WARRANTY MAY BE
CREATED OR EXTENDED BY SALES OR PROMOTIONAL MATERIALS. THE ADVICE AND STRATEGIES
CONTAINED HEREIN MAY NOT BE SUITABLE FOR EVERY SITUATION. THIS WORK IS SOLD WITH THE
UNDERSTANDING THAT THE PUBLISHER IS NOT ENGAGED IN RENDERING LEGAL, ACCOUNTING, OR
OTHER PROFESSIONAL SERVICES. IF PROFESSIONAL ASSISTANCE IS REQUIRED, THE SERVICES OF
A COMPETENT PROFESSIONAL PERSON SHOULD BE SOUGHT. NEITHER THE PUBLISHER NOR THE
AUTHOR SHALL BE LIABLE FOR DAMAGES ARISING HEREFROM. THE FACT THAT AN ORGANIZA-
TION OR WEBSITE IS REFERRED TO IN THIS WORK AS A CITATION AND/OR A POTENTIAL SOURCE
OF FURTHER INFORMATION DOES NOT MEAN THAT THE AUTHOR OR THE PUBLISHER ENDORSES
THE INFORMATION THE ORGANIZATION OR WEBSITE MAY PROVIDE OR RECOMMENDATIONS IT
MAY MAKE. FURTHER, READERS SHOULD BE AWARE THAT INTERNET WEBSITES LISTED IN THIS
WORK MAY HAVE CHANGED OR DISAPPEARED BETWEEN WHEN THIS WORK WAS WRITTEN AND
WHEN IT IS READ.
For general information on our other products and services, please contact our Customer Care
Department within the U.S. at 877-762-2974, outside the U.S. at 317-572-3993, or fax 317-572-4002.
For technical support, please visit www.wiley.com/techsupport.
Wiley publishes in a variety of print and electronic formats and by print-on-demand. Some material
included with standard print versions of this book may not be included in e-books or in print-on-demand.
If this book refers to media such as a CD or DVD that is not included in the version you purchased, you
may download this material at . For more information about Wiley

products, visit www.wiley.com.
Library of Congress Control Number: 2011946308
ISBN 978-1-118-12720-9 (pbk); ISBN 978-1-118-22490-8 (ebk); ISBN 978-1-118-23835-6 (ebk);
ISBN 978-1-118-26293-1 (ebk)
Manufactured in the United States of America
10 9 8 7 6 5 4 3 2 1
About the Author
Chris Minnick has been a Web developer and Web entrepreneur since the
mid-90s. He is the genius behind several successful Web start-ups, includ-
ing ContentBoxer.com and Minnickweb.com. He is also the genius behind
several not-so-successful start-ups, including StickOfButterOnAStick.com,
CelebrityAgeMachine.com, and Texas-Shaped.com.
He writes, speaks, teaches, and consults on the Mobile Web and works with
businesses to maximize their online revenue.Chris has written numerous
books and articles on a wide range of Internet-related topics including mobile
app development, e-commerce, e-business, Web design, XML, and application
servers.
When he’s not working or writing, Chris enjoys swimming in San Francisco
Bay and making wine. More information can be found on his blog:
www.chrisminnick.com.
Dedication
To Margaret, who has been on this journey with me from the beginning and
never stopped believin’.
Author’s Acknowledgments
Thank you to everyone at Wiley who made this book happen, including Katie
Feltman and Pat O’Brien; to Ed Tittel for technical editing, general guidance,
and support over the years; and to my agent Carole Jelen. You’re all the best
ever.
Huge appreciation to all of my friend and family, who encouraged me

and “liked” my Facebook status, even at 1:00AM when I was exhausted
from another marathon writing session, including: Margaret Minnick, Jeff
Schwarzschild, John “Spurious” Lewis and Molly “Superlativa” Lewis, Maya
Wallace, Stephanie and Pat Howse, Sam Hubbard, Brandon McGowen, Gae
Reck, Vicente Lozano, Deanne Brooks, Ben Drake, Savanna Bohlman, Tina
Knop, Jeremy and Amy Duncan, Jim Vanderveen, Michele Vandenbergh,
Kristen Brunton, Maureen Brunton, Marilyn Steinheiser, Sara Stapleton
(“grr”), Jesse James, Steven Cranston, Dave Kalman, Carl Landau, Shelly
Rentz, Carmen Isias, Mike Burkhart, Carol Hachey, Paul and Jonna Stebleton,
Paul and Elizabeth Jackson, Carol and Sondre Skatter, Lujuana Treadwell,
Don Treadwell, Ruth Minnick, Mom and Dad, Beth and Geoff and Eliza
Burkhart, Kathy and J Elliot, David and Kelly and the girls, Ken Byers, Meg
and Emily Mann, Mr. Jones and Sparky.
A very special thank you to my colleagues at Minnick Web Services, Mara
Shank and Priscila Ibarra, who put up with me every day and help me keep it
together.
Publisher’s Acknowledgments
We’re proud of this book; please send us your comments at . For
other comments, please contact our Customer Care Department within the U.S. at 877-762-2974, out-
side the U.S. at 317-572-3993, or fax 317-572-4002.
Some of the people who helped bring this book to market include the following:
Acquisitions, Editorial, and
Vertical Websites
Project Editor: Pat O’Brien
Acquisitions Editor: Katie Feltman
Senior Copy Editor: Barry Childs-Helton
Technical Editor: Ed Tittel
Editorial Manager: Kevin Kirschner
Editorial Assistant: Amanda Graham
Sr. Editorial Assistant: Cherie Case

Cover Photo: © iStockphoto.com /
Cary Westfall
Cartoons: Rich Tennant
(www.the5thwave.com)
Composition Services
Project Coordinator: Patrick Redmond
Layout and Graphics: Lavonne Roberts,
Corrie Socolovitch
Proofreaders: Jessica Kramer, Toni Settle
Indexer: BIM Indexing & Proofreading Services
Publishing and Editorial for Technology Dummies
Richard Swadley, Vice President and Executive Group Publisher
Andy Cummings, Vice President and Publisher
Mary Bednarek, Executive Acquisitions Director
Mary C. Corder, Editorial Director
Publishing for Consumer Dummies
Kathleen Nebenhaus, Vice President and Executive Publisher
Composition Services
Debbie Stailey, Director of Composition Services
Contents at a Glance
Introduction 1
Part I: Introducing WebKit 7
Chapter 1: Opening for Business 9
Chapter 2: Conguring WebKit 33
Part II: Your First Mobile Web App 61
Chapter 3: Building Your First Mobile Web App 63
Chapter 4: jQuery Mobile 87
Chapter 5: Testing and Debugging 109
Chapter 6: Flying Solo 131
Part III: Mobile Web Fundamentals 141

Chapter 7: Web versus Native 143
Chapter 8: Mobile Web App Design 155
Chapter 9: HTML5 167
Chapter 10: CSS3 183
Chapter 11: Scripting with JavaScript 199
Part IV: Optimizing Your Apps 221
Chapter 12: Optimizing for iOS 223
Chapter 13: Optimizing for Android 235
Chapter 14: Optimizing for BlackBerry 245
Chapter 15: Optimizing for webOS 255
Chapter 16: Optimizing for Performance 263
Part V: Advanced Topics 273
Chapter 17: Converting from Web to Native 275
Chapter 18: Accessing Phone Features 285
Chapter 19: Graphics and Animation 303
Chapter 20: The Future of WebKit and HTML5 327
Part VI: The Part of Tens 339
Chapter 21: Ten Cool WebKit Tricks 341
Chapter 22: Ten Amazing HTML5 Demos 351
Chapter 23: Ten Useful Safari Extensions 361
Index 369
Table of Contents
Introduction 1
Why I Love WebKit, and You Should Too 1
Who Should Read This Book 2
Conventions Used in This Book 3
Foolish Assumptions 3
How This Book is Organized 4
Part I: Introducing WebKit 4
Part II: Your First Mobile Web App 4

Part III: Mobile Web Fundamentals 5
Part IV: Optimizing Your Apps 5
Part V: Advanced Topics 5
Part VI: The Part of Tens 5
Icons Used in This Book 6
Where to Go from Here 6
Part I: Introducing WebKit 7
Chapter 1: Opening for Business 9
What Is a Web Browser Engine? 9
Corvette or clunker: Every browser has one 10
Moving pages through the browser stack 11
What Does a Browser Do? 13
Behind the scenes 13
Meet the current crop of web browsers 15
Understanding Browser Quirks and Incompatibilities 18
Changing standards for browser engines 18
Moving to mobile: Compatibility headaches everywhere 19
The History of WebKit 23
Enter Apple 23
WebKit spreads 24
Development continues 24
The Parts of WebKit 25
WebKit 25
WebCore 26
JavaScriptCore 26
Getting Started with WebKit 27
Downloading WebKit 27
Installing WebKit 28
Launching WebKit 30
WebKit For Dummies

xii
Chapter 2: Conguring WebKit 33
Customizing Your WebKit Interface 33
Getting Started with the Develop Menu 36
Opening a page with another browser 36
User agent 37
The Error Console 40
Using the Web Inspector 40
Using the Extension Builder 55
Using the Snippet Editor 56
Uncovering Hidden Features of WebKit and Safari 57
Useful keyboard shortcuts 57
Handy menu shortcuts to remember 58
Part II: Your First Mobile Web App 61
Chapter 3: Building Your First Mobile Web App 63
Setting Up Your Development Environment 63
Choosing a code editor 63
Installing Komodo Edit 64
Adding WebKit as your default browser 65
Creating a project 66
Starting Your Mobile Template 68
Getting started with Mobile Boilerplate 68
Creating a Komodo Edit template 73
Creating a new project from a template 74
Finally! Meet your rst app! 76
Building the WKFDBookmarks app 78
Taking it up a level 81
Mobilize those links 83
Chapter 4: jQuery Mobile 87
Developing with Frameworks and Libraries 87

What is jQuery? 88
What is jQuery Mobile? 89
Introducing the Mobile Cookbook App 91
Cooking up a cookbook app 91
Setting out the ingredients: HTML basics 91
Sinking your teeth into jQuery Mobile 93
Spicing up your cookbook app 99
Presentation, presentation, presentation 102
Images on buttons 104
Adding forms with jQuery Mobile 106
xiii
Table of Contents
Chapter 5: Testing and Debugging 109
Testing Mobile Web Apps 109
The best way to test an app 110
Testing early and often 111
Testing in WebKit 112
Testing with emulators 113
Release early and often 118
Debugging Mobile Web Apps 118
Debugging with the Web Inspector 119
Enabling the Debug Console on iOS 119
Learning from my mistakes 119
Improving Your App with Audits 127
Chapter 6: Flying Solo 131
Making Ofine Web Apps 131
Writing your manifest 131
Understanding the structure of a manifest 133
Conguring your server for ofine Apps 135
Using Ofine Databases 136

Web storage 136
Browser support 139
Part III: Mobile Web Fundamentals 141
Chapter 7: Web versus Native 143
Understanding How Mobile Web Apps Evolved 144
How Apple invigorated the Mobile Web 144
WebKit takes off 144
Thinking Differently about Apps 145
Benets of native apps 146
Benets of web apps 146
Debunking the Myths 147
Myth #1: Web apps are slower 147
Myth #2: Web apps require you to
be connected to the Internet 148
Myth #3: Some kinds of apps need to be native 148
Myth #4: Web apps can never look as good as native 148
Exploring Some Great Mobile Web Apps 150
Twitter 150
Financial Times 151
TripiT 152
ESPN.com 152
WebKit For Dummies
xiv
Chapter 8: Mobile Web App Design 155
Design for Many Devices 155
Designing for People 157
Developing user proles with User Stories 157
Designing for simplicity 159
Progressive Enhancement 159
Mobile First 163

Chapter 9: HTML5 167
Understanding How We Got to 5 167
The early years 167
HTML 3.2 and 4 169
XHTML 169
What’s up with WHATWG? 170
Meanwhile, Back at the W3C . . . 170
W3C gets some sense 170
Now it’s serious: We’ve got a logo 172
What’s the Big Deal with HTML5? 172
Using Multimedia without plug-ins 172
Simplied syntax 176
Improved interoperability between browsers 177
Cross-platform mobile development 178
Markup Changes 178
Out with the old 178
In with the new 179
Checking Out HTML5’s New APIs 181
Contacts API 181
Media Capture API 182
Calendar API 182
HTML5 Web Messaging 182
Geolocation 182
Ofine storage 182
Chapter 10: CSS3 183
The Elements of Style 183
Using Selectors to Choose Elements 187
Getting to know your rst selectors 188
Using more advanced selectors 189
Chaining selectors together 190

Navigating the C in CSS 190
Dening selector importance 191
Studying the browser’s logic 192
Learning CSS3 Modules 194
Understanding browser prexes 194
Media queries 194
xv
Table of Contents
CSS multicolumn layout 195
Borders 195
Text effects 196
Chapter 11: Scripting with JavaScript 199
Understanding the Role of JavaScript 200
Client-server computing 200
Running scripts on the server 200
Running scripts on the client 201
Writing JavaScript Code 201
Creating an HTML5 script block 202
Holding data in variables 202
Looping with a for statement 203
Writing to the document 203
Speaking Precisely 204
Pay attention to your capitalization 204
Separate your statements correctly 204
Put strings in quotes 204
Validating Form Data with JavaScript 205
Sending data to JavaScript 207
Grouping statements with functions 208
Extracting form data 208
Stripping extra characters 209

Getting logical with if 209
Understanding the HTML DOM 211
Representin’ with objects 211
Climbing the DOM tree 212
Using dot notation with the DOM 214
Identifying nodes and relations 215
Using JavaScript for Much More Than Eye Candy 216
NextBus 216
Chalk 217
Fiddling with JavaScript 217
Part IV: Optimizing Your Apps 221
Chapter 12: Optimizing for iOS 223
Conguring Your Web App for iOS 223
Understanding the viewport 223
Understanding device pixels and viewport pixels 226
Controlling the viewport size 227
Making your app full-screen 229
Using Apple-specic tags 230
Making a splash 232
Hiding the status bar 232
Getting in Touch with Touch Events 233
WebKit For Dummies
xvi
Chapter 13: Optimizing for Android 235
Sizing Your App 235
Understanding Android “dips” 236
Setting the viewport to device width: It’s the least you can do 236
Picturing the viewport 237
Looking deeper into density 239
Using Media Queries with Android 241

Determining screen density with JavaScript 242
Setting the Home Screen Icon 243
Chapter 14: Optimizing for BlackBerry 245
Understanding the Types of BlackBerry Apps 245
Developing native apps 245
Developing WebWorks apps 246
Developing HTML5 apps 246
Optimizing Mobile Web Apps for BlackBerry 246
Optimizing for display sizes 246
Optimizing the viewport 247
Optimizing for screen density 247
Using the Web Inspector with BlackBerry 247
Enabling Web Inspector on the Playbook 247
Remote debugging 248
Accessing Native Events 251
Cursor-event-mode meta tag 251
Touch-event-mode meta tag 252
Submitting Web Apps to BlackBerry App World 252
Downloading and Installing the BlackBerry Simulator 253
Chapter 15: Optimizing for webOS 255
Understanding the Two Types of Web Apps on webOS 255
Developing browser-based web apps 255
Developing native web apps 256
Optimizing Web Apps for webOS Devices 256
Designing for the web Web browser 256
Designing for the webOS viewport 257
Running the Emulator 258
Chapter 16: Optimizing for Performance 263
Testing with Online Tools 263
Google Page Speed 263

Page Speed Service 266
mobiReady 268
Controlling Latency 270
Reducing real latency 270
Reducing perceived latency 271
xvii
Table of Contents
Part V: Advanced Topics 273
Chapter 17: Converting from Web to Native 275
Introducing PhoneGap 275
PhoneGap 1.0 276
PhoneGap Build 276
Converting the Mobile Cookbook with PhoneGap Build 276
Preparing your app for PhoneGap Build 277
Uploading your app 277
Converting to an iOS native app 280
Installing the Cookbook on Android 280
Chapter 18: Accessing Phone Features 285
W3C Device APIs Working Group 286
Contacts API 286
Calendar 287
Media Capture API 287
Battery Status 288
Network Information API 289
Giving Permission for Device and Feature Access 289
Preventing Peeping Tom apps 290
Balancing usability and security 291
Geolocation API 293
Getting your location with getCurrentPosition 295
Mashing up with geolocation 298

Chapter 19: Graphics and Animation 303
Understanding Computer Graphic Formats 304
Raster graphics 304
Vector graphics 304
Reducing File Size with Compression 305
Lossy compression 305
Lossless compression 306
Drawing with SVG 307
Making graphics with SVG-edit 309
Finding SVG graphics 311
Embedding SVG graphics in HTML 311
Animating SVG with SMIL 314
Scripting Graphics with the Canvas Element 315
Creating a canvas 315
Drawing on the canvas 316
Animating with canvas 317
WebKit For Dummies
xviii
Chapter 20: The Future of WebKit and HTML5 327
WebKit2 327
Getting Input with Web Forms 328
Placeholder text 328
Autofocus 328
New eld types 328
Number sliders 329
Color 330
Date pickers 330
Creating 3-D Scenes with WebGL 331
Enabling WebGL in WebKit 331
Taking WebGL for a spin 331

Chrome OS 333
Part VI: The Part of Tens 339
Chapter 21: Ten Cool WebKit Tricks 341
Chapter 22: Ten Amazing HTML5 Demos 351
Chapter 23: Ten Useful Safari Extensions 361
Index 369
Introduction
M

obile apps are the rocket fuel powering the growth of the web today.
Everything is going mobile. If you’re starting a web business today
without a mobile strategy , or if you have a mobile strategy but it isn’t the
center of your business, you’re going to have a hard time gaining any sort of
traction.
Ever since Apple released the browser engine behind its Safari Web browser
as open source, WebKit and the mobile web have been joined at the hip. In
the last few years, WebKit has advanced the state of the art for the Mobile
Web by aggressively adopting new web standards, such as HTML5 and CSS3,
and by pushing the performance of existing standards like JavaScript.
By itself, WebKit is interesting. When combined with the mobile Web, it’s
powerful. When it’s the heart of almost every smartphone browser coming
out today, it’s revolutionary. That’s what this book is about.
Why I Love WebKit, and You Should Too
The smartphone and tablet markets today are split between several different
operating systems — including Apple’s iOS, Google’s Android, Research in
Motion’s Blackberry, Microsoft’s Windows Mobile, and several other players.
Each of these different operating systems has its own way of developing and
deploying “native” apps (the ones you download from an “app store”) — and
none of them works with any of the others.
If you’re developing a mobile app, then, and you want it to run on as close to

every smartphone and tablet as possible, you can spend many thousands of
dollars to develop the iPhone version, then spend many thousands of dollars
more to develop the Android version, then the Blackberry version, and so on.
And, you haven’t even started to work on the tablet versions yet.
The requirement to essentially rewrite your app for every mobile platform
just doesn’t seem right or necessary — and it isn’t.
Right now, WebKit-based browsers run on nearly all of the major smartphone
and tablet operating systems. This makes WebKit the cross-platform mobile
app standard. Industry leaders such as Google, Twitter, and Facebook have
2
WebKit For Dummies
made the decision that it makes more sense to focus on writing one incredible
mobile web app, rather than to create multiple native apps. The rest of the
mobile development world is rapidly coming around to the same conclusion.
If you’re a business owner who wants to take your business mobile, WebKit
means that you can likely leverage your existing web presence in developing
your mobile app.
If you’re a web developer who wants to make the shift to mobile, WebKit
means you can develop apps using many of the same skills that you already
know, including HTML, CSS, and JavaScript.
If you’re a user of mobile devices, WebKit means that your data and apps
don’t need to be tied to your device. You can access the same apps on your
desktop computer that you use on your phone. Your apps will update them-
selves without you doing anything at all. And — perhaps best of all for those
of us who love to get our hands on the latest gadgets — you won’t be locked
into using just one mobile operating system.
Who Should Read This Book
This is a beginner’s guide to developing mobile web apps for devices with
WebKit browsers. I don’t assume that you have any prior web development
or mobile app development experience.

I’ve distilled my own years of web development experience, along with thou-
sands of pages of documentation, articles, blog posts, and technical manuals
into this book (and boy are my arms tired!).
I designed this book to be hands-on, because that’s how I learned everything
I know about the web and because I believe that’s the best way to really get
to know anything new.
I’ve written and included several mobile web apps, and numerous code snip-
pets throughout the book. These are designed to make you curious and to
be jumping off points for your own experimentation with the mobile web.
I’ve also provided links to a large number of resources for learning about the
mobile web and for seeing some examples of apps that others are creating.
I’ve attempted to provide as complete a picture of mobile web development
for WebKit browsers as I can without going off onto highly technical explana-
tions of concepts that aren’t central to the matter at hand (well, at least not
unless it was absolutely necessary, or at least fun).
3

Introduction
I hope that my efforts, along with the efforts of the hundreds of people who
have contributed to my knowledge or the examples and demos I cite in this
book, will inspire you to work with us to push the limits of the web and the
mobile web.
If you have no experience with web or mobile development, but you want to
learn to do mobile development, you should read this book. If you’re a web
developer who wants to shift to developing mobile apps, you should read this
book. If you’re a native app developer who wants to create cross-platform
apps, you should read this book. If you’re starting a web business, or if you
already own one, you should read this book. If you’re one of my friends or
family members and you want to find out if you’re mentioned in here, you
should read this book.

Conventions Used in This Book
This book guides you through learning to use and to develop mobile web
apps for WebKit browsers. Throughout the book, I’ll be including code writ-
ten in HTML5, CSS3, XML, and JavaScript.
Code examples in this book appear in a monospaced font so that they’ll stand
out. That means the code you see will look like this:
<meta name = “viewport” content = “width = device-width”/>
All of the URLs in this book (and there are a lot) are also in a monospaced
font:
www.dummies.com/go/webkit
I’ve posted all of my example apps to the above website, and you can check
them out if you have any questions about anything in the code (is that a 1 or
a lower-case “L”?) I’ll provide updates to the code at that website as well as
at www.webkitfordummies.com.
Foolish Assumptions
I don’t assume much, and I’ve tried at every step of the way to be there to
give you a hand with some of the trickier parts of your journey to mobile
web-app guru-land.
4
WebKit For Dummies
I expect you to have a computer and an Internet connection. The operat-
ing system on your computer doesn’t matter too much. Mac, Windows, and
Linux users will all be able to complete the examples.
I use all three of these operating systems in my daily life, but I tended to skew
toward the Mac OS X side of things while writing this book (as you’ll detect in
the screenshots). This isn’t meant to imply that your experience of this book
will be any worse if you use Windows. I, and my trusty technical editor, have
gone over all of the examples to make sure they work correctly on at least
Mac and Windows. You may need to get a little creative in parts if you use
Linux for your primary desktop operating system.

Furthermore, you should at least be familiar with smartphones or tablet
computers and apps. Maybe you’ve tried your buddy’s iPhone. That’s good
enough.
All of the software used in this book can be downloaded for free. In addition,
you can try all of different smartphone operating systems on desktop com-
puters by using emulators.
How This Book is Organized
WebKit For Dummies has six main parts. You can read the book from start to
finish, or just find what you want in the Table of Contents or the Index.
Part I: Introducing WebKit
Part I introduces you to WebKit and the big picture of mobile web-app
design. I’ll also get you set up with a shiny new browser that you’ll use
throughout the book.
Part II: Your First Mobile Web App
In Part II, you’ll dive head-first into mobile web-app development. We’ll make
one app that will display and organize some of the links I gathered while writ-
ing this book. The second app will be the foundation for a little cookbook app
featuring a few of my favorite (extremely basic) recipes. We’ll round out this
part by talking about testing and then an increasingly important aspect of
mobile web-app development: offline apps.
5

Introduction
Part III: Mobile Web Fundamentals
Part III is where I go into details about some of my favorite topics: things like
HTML5, CSS3, JavaScript, and much more. From how to start planning and
thinking about an app, to how to write some pretty nifty code to make it all
go — this is where you’ll find the real meat and potatoes (or perhaps you’d
prefer our vegetarian option: delicious portabella mushrooms marinated in
garlic and balsamic vinegar and grilled. Served with buttered noodles and

grilled asparagus).
Part IV: Optimizing Your Apps
In Part IV, we go a step further and look at how you can take your HTML5 app
and make it really shine. I’ll tell you some details about each of the major mobile
platforms that use a WebKit browser, and get into some nitty-gritty details of
how to tweak your app for optimum compatibility with each platform.
I’ll also go into the all-important topic of optimizing for performance and then
wind up this part with the ultimate platform-specific optimization — creating
a native app from your web app.
Part V: Advanced Topics
Part V is a really exciting one. In this part, you’ll learn about some next-level
techniques and tools. Many of them are available to be used right now.
Others are so new and cutting edge that you may have to wait a little bit
after you learn them before you can use them in a real-world app. This is the
part where we talk about how to take pictures from your WebKit browser,
use a phone’s location to show the user on a map, create animation without
plugins, and even dive in to 3D graphics.
Part VI: The Part of Tens
Part VI is about lists of things I think every mobile web developer and WebKit
user ought to know. You’ll see some of my favorite HTML5 demos, learn
some shortcuts and tricks for WebKit, and find out how you can make WebKit
even better by using extensions.

×