|
|
|
You Will Learn How To
- Develop streamlined mobile Web sites for efficient access to online information
- Write compelling HTML5 and CSS3 content for mobile users
- Employ JavaScript to maximise the potential of each browser platform
- Extend the browsing experience with mobile-focused multimedia content
- Harness geolocation capabilities to deliver targeted content
- Leverage native extensions and exploit local storage for enhanced device integration
Course Benefits Mobile device Web browsers provide the primary method for Internet access to an exponentially growing number of users. Traditional Web sites designed for desktop browsers do not provide an optimal experience for mobile interaction. In this course, you gain the necessary skills to design and construct a Web site that fully exploits the sophisticated capabilities of Web browsers on mobile devices.
Who Should Attend Web designers and developers interested in building mobile Web sites. Knowledge of HTML and CSS at the level of Course 470, " Developing a Web Site", as well as prior JavaScript experience are assumed.
Hands-On Training Practical hands-on exercises provide experience creating cutting-edge mobile Web sites. Exercises include:
- Architecting modern cross-platform mobile Web sites
- Enhancing forms with HTML5 extensions
- Replicating the native platform UI with CSS3
- Querying device capabilities with JavaScript
- Presenting optimised graphics and multimedia
- Geolocating the user with HTML5 and JavaScript
- Enabling offline access to enterprise data
Course Content Surveying the Mobile Web Environment
- Exploring key mobile Web platforms
- Android
- iOS
- Blackberry
- Windows phone
Analysing Requirements for Mobile Web Sites
Taking advantage of best practices
- Creating vs. migrating Web applications
- Complying with W3C guidelines
Applying architectural principles and constraints
- Selecting high-priority features
- Simplifying the User Interface (UI) for enhanced performance
- Designing for touch interactivity
- Identifying bandwidth and memory limitations
Authoring HTML Content for Mobile Web Sites
Designing for platform independence
- Maximising site functionality with progressive enhancement
- Constructing an appropriate layout for a mobile UI
- Controlling zoom with the Viewport
Integrating HTML5 extensions
- E-mail
- Web addresses
- Date pickers
- Spin boxes
- Autofocus fields
- Search boxes
- Dialling the phone from the page
- Displaying a context-sensitive keyboard
Customising Presentation with Cascading Style Sheets
Harnessing CSS3 capabilities
- Selecting style sheets based on device orientation
- Manipulating layout dynamically with transitions, transforms and animations
Styling layout and content
- Optimising styles for touch interactivity
- Applying styles based on content
- Simulating the native UI with CSS
CSS extensions for mobile
- Mapping device Viewports to style sheets
- Enhancing text readability with text-size-adjust
- Highlighting touch content with tap-highlight-colour
Supporting User Interaction and Mobile Features
Implementing common mobile features
- Determining support for device capabilities
- Touch
- Tilt
- Multimedia
- Local storage
- Detecting browser capabilities on the server and client
Enhancing interactivity with JavaScript
- Employing key libraries: Modernizr, jQuery mobile
- Responding to orientation changes
Comparing phone and tablet UIs
- Differentiating between phone and tablet presentation
- Adapting Web content to respect platform conventions
- Designing tablet-style two column views
Producing Graphics and Media
Processing video for mobile devices
- Generating bandwidth-appropriate video content
- Exploiting the HTML5 video element
- Activating video content from JavaScript
Presenting graphic images
- Optimising graphics for mobile devices
- Maximising screen real estate with jQuery Carousel
Leveraging Geolocation
Determining device position
- Querying for the device location with GPS
- Integrating with the native map application
- Retrieving location-based Web content
Integrating local storage
- Persisting data onto the device
- Managing locally stored data
Enhancing Site Functionality
Working offline
- Enabling disconnected Web applications
- Detecting network status
- Synchronising offline data to enterprise databases
Consolidating the Web with native extensions
- Integrating with the home screen
- Hiding the standard browser UI
- Accessing native mobile hardware with PhoneGap
- Camera
- Contacts
- Accelerometer
- Compass
|
<< Back to Web Development, XML, and Adobe Products
Related Courses
|
|
Course Dates
UK Dates | | 16-18 May | London enrol | | 22-24 Aug | London enrol | | 28-30 Nov | London enrol | US East Coast Dates | | 25-27 Apr | Washington, DC enrol* | | 30 May - 1 Jun | New York enrol* |
*New York and Washington DC Courses – Available online with a run time of 2pm to 9pm BST. For AnyWare enrolments, please register at least 10 days prior to the start of the course.
More Dates and Locations.
|
|
|
|
On-Site &
Custom Training
Bring this or any Learning Tree course to your location or have it customised for your organisation.
|
Participants discussing mobile website optimization.
|
|
"I attended Learning Tree Courses so I could be current with the technologies I'm using. The classes have been very valuable, and I would say it is because of the great instructors. I would definitely recommend them".
– S. Naumenko
Genesis Microchip
|
|
|
E-mail 
Print 
Q&A 
PDF 
Facebook 
Twitter
