HTML5 MOBILE WEBSITES

Size: px

Start display at page:

Download "HTML5 MOBILE WEBSITES"

Aubrey Burns
5 years ago
Views:

1 HTML5 MOBILE WEBSITES

3 HTML5 MOBILE WEBSITES TURBOCHARGING HTML5 WITH jquery MOBILE, SENCHA TOUCH, AND OTHER FRAMEWORKS MATTHEW DAVID AMSTERDAM BOSTON HEIDELBERG LONDON NEW YORK OXFORD PARIS SAN DIEGO SAN FRANCISCO SINGAPORE SYDNEY TOKYO Focal Press is an imprint of Elsevier

4 Focal Press is an imprint of Elsevier 225 Wyman Street, Waltham, MA 02451, USA The Boulevard, Langford Lane, Kidlington, Oxford, OX5 1GB, UK 2012 Elsevier Inc. All rights reserved. No part of this publication may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording, or any information storage and retrieval system, without permission in writing from the publisher. Details on how to seek permission, further information about the Publisher's permissions policies and our arrangements with organizations such as the Copyright Clearance Center and the Copyright Licensing Agency, can be found at our website: This book and the individual contributions contained in it are protected under copyright by the Publisher (other than as may be noted herein). Notices Knowledge and best practice in this field are constantly changing. As new research and experience broaden our understanding, changes in research methods, professional practices, or medical treatment may become necessary. Practitioners and researchers must always rely on their own experience and knowledge in evaluating and using any information, methods, compounds, or experiments described herein. In using such information or methods they should be mindful of their own safety and the safety of others, including parties for whom they have a professional responsibility. To the fullest extent of the law, neither the Publisher nor the authors, contributors, or editors, assume any liability for any injury and/or damage to persons or property as a matter of products liability, negligence or otherwise, or from any use or operation of any methods, products, instructions, or ideas contained in the material herein. Library of Congress Cataloging-in-Publication Data Application submitted British Library Cataloguing-in-Publication Data A catalogue record for this book is available from the British Library. ISBN: For information on all Focal Press publications visit our website at Printed in the United States of America

5 Dedication There is one person who rides the author crazy train with me. She is my soul mate and life partner. I love you, darlin'. v

7 CONTENTS Author's Note... xi Section 1 Article 1: Building Websites with HTML5 to Work with Mobile Phones Designing for the Mobile Web... 7 HTML5 in Mobile Websites...11 Using CSS Graphical Control with Bitmap, SVG, and CANVAS Elements Adding Video to Your Web Pages Applying New Web API Functionality to Your Mobile Web Pages Developing for Specific Mobile Browsers Developing Websites for the Rest Tablet Development Summary Project: Developing Your First Mobile Website...55 What You Will Need Setting Up Your Project Customizing the HEADER Element Customizing the Main SECTION Element Customizing the FOOTER Element Creating the Home Page for the Website Adding a News Page That Uses the TIME and ASIDE Elements Creating a Contact Us Page That Uses the New Form Input Attributes Summary vii

8 viii CONTENTS Section 2 Article 2: Developing Websites with jquery Mobile Progressive Enhancement What Is jquery? Going beyond the Core of jquery Developing Websites Using jquery Mobile Getting Started with jquery Mobile Working with Components Gesture-Driven Events Extending jquery Mobile with Plug-ins and Custom JavaScript Extending jquery Mobile with Custom Themes Converting Your jquery Website into an App Using PhoneGap Keeping Up to Date on the Latest News and Getting Involved Beyond Alpha Project: Building A Mobile Website Using jquery Mobile What You Will Need Setting Up jquery Mobile Pulling in Dynamic Data Summary Section 3 Article 3: Working with jqtouch to Build Websites on Top of jquery Rapidly Building iphone Apps without Learning Objective-C Converting HTML into an iphone App Adding Animation Some Little Extras Summary

9 CONTENTS ix Project: Building A Website With jqtouch What You Will Need Setting Up Your jqtouch Project Summary Section 4 Article 4: Using Sencha Touch to Build a Mobile Website Getting Started with Sencha Touch Creating Your First Sencha Touch Page Working with User Interface Elements in Sencha Touch Summary Project: Building A Web Application With Sencha Touch What You Will Need Setting Up Your Sencha Touch Project: First, the HTML Second: Custom CSS Third: The JavaScript Summary Section 5 Article 5: Converting Websites into Native Apps Using PhoneGap Working with PhoneGap Setting Up a PhoneGap Project for ios Devices Extending PhoneGap with Plug-ins Extending PhoneGap with Custom Code Packaging Your App for the itunes App Store Using itunes Connect to Publish Your App Using Dreamweaver CS5.5 to Build Your PhoneGap Projects Using PhoneGap Build to Create BlackBerry and Windows Phone Apps Summary

10 x CONTENTS Project: Building A Native ios App With PhoneGap What You Will Need Setting Up Your Web Files for the Project Using PhoneGap Build Building Your Application Submitting to the App Stores Making Money! Summary Section 6 Article 6: Creating Websites for ipad and Android Honeycomb Tablets What Makes a Tablet a Unique User Experience? Elements of the Tablet Experience: Sidebars, Pop-overs, and Touch Interfaces Using Sencha Touch for Tablet Creation Using jquery Mobile to Build Websites Optimized for Tablets Building for the Future: CSS Regions Summary Project: Developing Solutions For Tablets What You Will Need Setting Up Your Project Controlling Themes Editing Swatches Changing the Visual Elements Coming Soon: ThemeRoller for jquery Mobile Summary Index...231

11 Author's Note Writing a book something done by yourself in a quiet room is a great way to meet people. Seriously. The first person I met is my acquisitions editor, Rachel. She is the one who brings all the right people together to complete the book you are reading. The wonderful folks at Focal Press (yes, I am talking to you Carlin, Laura, and Cassie) take my chicken scratch words, edit them, and bind them. Ryan, my long time friend and technical editor, checks all my code. But it is not just the publishers who help there are loads of other people. This last year I was able to teach at UW-Oshkosh where I forced all my students to read my books and then proceeded to lecture them on the benefits of mobile web design. What great guinea pigs! I have to thank Mike, Cindy, Lynnea, Audralyn, Beth, Christine, Katie, Kaylyn, Melinda, Nicole, and Taira. You guys rock. I also have to thank Kin at Adobe for all his help with jquery Mobile the guy is a modest genius! I live in the middle of nowhere in a farmhouse a mile from the nearest village (Stockbridge is the proud cultural center of 600 residents, four bars, one gas station, and no grocery stores we have our priorities set straight!). I get to write and research in peace. You see, writing books is fun. Meeting people because of the books I have written that's brilliant! xi

Security for Microsoft Windows System Administrators

Security for Microsoft Windows System Administrators Security for Microsoft Windows System Administrators Introduction to Key Information Security Concepts Derrick Rountree Rodney Buike, Technical Editor