Lynda.com - Mobile Web Design & Development Fundamentals


Description

This course surveys the core principles and techniques essential to building web sites for mobile devices. Author Joe Marini introduces the mobile context, sheds light on its unique coding requirements, and discusses interface design techniques that enhance existing sites for mobile viewing. The course shows how to approach designing for mobile form factors such as smaller screens and finger-based interaction, along with how to incorporate CSS3 and HTML5 capabilities, such as geolocation, local storage, and media queries.
Topics include:
 Implementing well-defined web standards
 Working with Modernizr and Mobile Boilerplate
 Building a first mobile web page
 Understanding content adaptation strategies
 Designing forms for mobile
 Detecting client capabilities with script
 Using server-side detection with PHP and ASP.NET
 Working with mobile browser capabilities
 Viewing and testing the mobile site on device emulators
author: Joe Marini
subject: Web + Interactive, Scripting Languages, Developer, Mobile, Platforms
software: HTML 5
level: Beginner
duration: 5h 47m
released: Jul 20, 2011


Table of Contents:

* Introduction 2m 48s
- Welcome 1m 2s
- Using the exercise files 1m 46s

* 1. Understanding the Mobile Web 29m 25s
- Understanding the mobile context 8m 5s
- A survey of mobile sites 11m 44s
- Targeting mobile browsers 4m 31s
- Previewing a complete mobile site 5m 5s

* 2. Mobile Web Development Guidelines 27m 20s
- Designing for one web 3m 43s
- Using well-defined web standards 3m 45s
- Designing mobile-friendly pages 3m 40s
- Being crisp, clean, and succinct 5m 45s
- Minimizing input where possible 6m 47s
- Focusing on the core scenarios 3m 40s

* 3. Setting Up a Development Environment 1h 13m
- Installing the tools 3m 52s
- Setting up a local web server 9m 13s
- Installing device emulators 17m 5s
- Using device emulators 13m 9s
- Downloading Modernizr and Mobile Boilerplate 6m 22s
- Building a first mobile web page 5m 43s
- Developing mobile pages with desktop browsers 8m 6s
- Exploring useful mobile web development resources 10m 23s

* 4. Adapting Desktop Sites for Mobile Devices 53m 26s
- Reviewing mobile markup languages 5m 10s
- Understanding content adaptation approaches 10m 32s
- Controlling the viewport layout 12m 50s
- Designing forms 13m 30s
- Using CSS media queries 11m 24s

* 5. Creating Mobile-Optimized Pages 1h 11m
- Detecting client capabilities with script 10m 8s
- Caching information with local storage 9m 16s
- Determining position with geolocation 12m 52s
- Minimizing HTTP requests with data URLs 7m 39s
- Understanding user agent detection 9m 8s
- Using server-side detection with PHP 6m 52s
- Using server-side detection with ASP.NET 4m 54s
- Using HTML5 Boilerplate for mobile 11m 6s

* 6. Understanding Mobile Browser Capabilities 39m 22s
- Measuring performance 7m 41s
- Creating full-screen web apps 6m 30s
- Customizing the user interface 5m 14s
- Detecting orientation changes 3m 58s
- Detecting device movement 5m 21s
- Using touch events 10m 38s

* 7. Putting It All into Practice 47m 14s
- Taking a look at the finished site 7m 40s
- Examining the header and background image style on the Home page 10m 10s
- Examining the hover effect and layout styles on the Tours page 6m 42s
- Examining mobile forms on the Contact page 9m 45s
- Viewing and testing the mobile site on emulators 8m 11s

- Viewing the site on devices 4m 46s
* Conclusion 2m 34s
- Goodbye 2m 34s


Website:
http://www.lynda.com/HTML-5-tutorials/Mobile-Web-Design-Development-Fundamentals/76334-2.html