HTML5 Mobile Web Development

Video description

Ready to create mobile web applications with the new features available in HTML5? In this 10-session video course, you’ll learn how to style apps to respond to a mobile device’s vertical and horizontal orientation, take advantage of global positioning, create basic animations, make your app available to users offline, and much more.

Presented by creativeLIVE in partnership with O’Reilly, each session offers easy-to-follow, hands-on lessons. You’ll …

HTML5 Mobile Web Development

Video description

Presented by creativeLIVE in partnership with O’Reilly, each session offers easy-to-follow, hands-on lessons. You’ll learn how to combine HTML5 elements with JavaScript and CSS3 to build mobile web apps for Twitter, movie trailers, and an address book. This video package is ideal for web developers interested in mobile development, mobile web developers ready to update their skills with HTML5, and business developers and project managers looking to understand mobile technologies.

Discover what’s new in HTML5, CSS3, and JavaScript for mobile development
Build your own Twitter App with these technologies
Create apps that detect the orientation of mobile devices
Use geolocation and maps in a location-based app
Enable mobile users to use your app offline
Use HTML5 web forms to create an address book app
Create drawings and animation with JavaScript and HTML5’s canvas element
Use HTML5’s audio and video elements to build a movie trailer app

You’ll get access to all ten sessions, including slide presentations and examples. Each session was presented live during ten consecutive weeks in October, November, and December 2010, and you can now download all the videos and example files, which include presentation slides, tip sheets, code and sample eBook chapters.

Publisher resources

Download Example Code

Meet HTML5

Example files for Week 1

Meet HTML5 and Apps for this Course

Requirements and Installing the Simulators

Create a Twitter App

Example files for Week 2

New HTML5 Elements

Viewport and CSS Reset

Size your app for mobile with CSS

Add gradients

Create navigation icons

Style a list

Make your page a web app

Make Ajax Calls

Example files for Week 3

Make Ajax Calls

Get Tweets as JSON

CSS3 Transitions

Web Fonts

Review and Final QA

Add Geolocation, Detect Orientation and Use CSS3 Media Queries

Example files for Week 4

CSS3 Media Queries

Detect Orientation with JavaScript

Geolocation

Review and QA

Use HTML5 Databases for Offline Storage

Example files for Week 5

Use HTML5 Databases for Offline Storage

Cache the Tweets

Cache Manifest

Detect Online Status

Review

Next Week Preview

Using Tweetstr while offline on the iPad

Create an Address Book App with Forms

Example files for Week 6

Create a Web SQL Database for our Address Book

New Input Types

CSS3 Animations

Review and Final QA

Build a Movie Trailer app with Audio and Video

Example files for Week 7

Build a Movie Trailer App with Audio and Video

Custom Audio Player

Playback Progress Bar

Changing the Audio

Review

Draw Using JavaScript and Canvas

Example files for Week 8

Draw using JavaScript and Canvas

Add Drawings to your Canvas

The Drawing System and Paths

Create Arcs and Bezier Curves

Review

Animate Your Drawings with Canvas

Example files for Week 9

Combine Images with Compositing

Manipulate Images on the Canvas

Scale and Rotate with Transforms

Rotate an Image

Create an Animation

Review

Combine the HTML5 Video Element with the Canvas

Example files for Week 10

Combine the HTML5 Video Element with Canvas

Create an Etch-a-sketch with DeviceMotion APIs

Review: What we learned about HTML5 on Mobile

Learning HTML5: Where to go from here

Start your Free Trial

Self paced

Go to the Course
We have partnered with providers to bring you collection of courses, When you buy through links on our site, we may earn an affiliate commission from provider.