MOBILE DEVELOPMENT WITH HTML5, CSS3 AND JAVASCRIPT TRAINING – GTIT23

Course Description

This course provides and introduction to HTML 5, JavScript and CSS3.

^^

Duration

5 days

^^

Target Audience

This course is designed for Web developers, Webmasters and JavaScript programmers.

^^

Course Prerequisites

Those attending this course require at least 3 months of practical programming experience.Experience in the following areas is also required: HTML, CSS.

If you have any questions or doubts as to whether you meet the pre-requisites for this course, or indeed are wondering which course best suits you, please consult with us to discuss your suitability for course attendance.

^^

Suggested Follow on Courses

Please contact us for further details.

^^

Course Content

 1. INTRODUCTION TO MOBILE WEB DESIGN 

  1.  Why Have a Mobile Presence?
  2. Pros and Cons of Mobile Web
  3. What Features to Expose in Mobile Web?
  4. Example Functions for Mobile Web
  5. Architecture Options
  6. Comparing the Options
  7. Guidelines for Mobile UI Design
  8. Summary

2. IMPLEMENTATION TECHNIQUES

  1.  Device Specific Stylesheets
  2. Media Query in @media Rule
  3. Media Query with @import Rule
  4. Media Query from HTML
  5. Deal with Device Orientation
  6. Detecting Device in Server
  7. Generating Device Specific HTML Markup
  8. Detecting Device Type in Browser
  9. Do Device Specific Rendering
  10. Handling Touch Events
  11. Example: Handling Touch Events
  12. Adding Home Screen Icon in iPhone
  13. Third Party Mobile Web Tookit
  14. Summary

3. BEST PRACTICES OF MOBILE WEB DESIGN

  1.  Introduction
  2. URI Consistency
  3. Exploit Device Capability
  4. Testing
  5. Use Short URI
  6. Minimize Navigation Bar At Top
  7. Balance Navigation Hierarchy
  8. Identify Content Type for a Link
  9. Minimize Dummy Page Load
  10. Limit Page Size
  11. Control Scrolling Behavior
  12. Avoid using Color to Convey Meaning
  13. General HTML Markup Guidelines
  14. User Input
  15. Summary

4. INTRODUCTION TO HTML5

  1. History of HTML5
  2. HTML5 Standards Body
  3. New Features of HTML5 – 1/3
  4. New Features of HTML5 – 2/3
  5. New Features of HTML5 – 3/3
  6. Current Browser Support for HTML5
  7. Detecting Support for HTML5
  8. HTML5 vs. Flash
  9. Replacing Flash with HTML5
  10. Summary

5. INTRODUCTION TO CSS

  1. Element selection
  2. The cascade
  3. Selectors
  4. Properties
  5. Best Practices

6. THE BASICS

  1. What Is HTML5
  2. HTML5 Goals
  3. HTML Specs, Past and Present
  4. How Is HTML5 Different From HTML4?
  5. HTML5 Is Not Based On SGML
  6. More Differences
  7. HTML5 Defines Required Processing For Invalid Documents
  8. The Doctype Declaration
  9. Semantic Elements
  10. The <aside> Element
  11. Browser Support For HTML5
  12. Summary

7. NEW SEMANTIC ELEMENTS

  1. Function over Form
  2. HTML4 Layouts
  3. HTML5 Semantic Layouts
  4. Nesting Semantics
  5. Other New Semantic Elements
  6. The <time> Element
  7. WAI-ARIA
  8. The <ruby> and <rt> Elements
  9. The <rp> Element
  10. The <keygen> Element
  11. Summary

8. FORMS

  1. The form Attribute
  2. The placeholder Attribute
  3. Form Field Types
  4. Forms and Validation
  5. The required Attribute
  6. The number input type
  7. The pattern Attribute
  8. The range and date input types
  9. The <datalist> Element
  10. The autofocus and oninput Attributes
  11. HTML5 CSS Pseudo-Classes
  12. Summary

9. INTRODUCTION TO  AJAX

  1. Objectives
  2. What is AJAX
  3. A Simple Example
  4. The Old Way
  5. The AJAX Way
  6. Two Key Aspects of AJAX
  7. What are the Advantages of the AJAX Approach
  8. AJAX Technologies
  9. The Basic AJAX API
  10. Creating the XMLHttpRequest Object
  11. The XMLHttpRequest Object Basics

10. CANVAS

  1. The <canvas> Element
  2. <canvas> vs. <svg>
  3. Browser Support for <canvas>
  4. Creating the Canvas
  5. Using the Context
  6. Using Color
  7. Painting Gradients
  8. Drawing Paths
  9. Painting Patterns
  10. Transformers
  11. Summary

11. VIDEO AND AUDIO

  1. HTML5 Video/Audio Overview
  2. New Elements for Video/Audio
  3. Using the <audio> Element
  4. The <video> Element
  5. Specifying More Than One Audio or Video File
  6. The poster Attribute
  7. Other <audio> and <video> Attributes
  8. JavaScript and Media Elements
  9. Summary

 12. GEOLOCATION

  1. Geolocation Concepts
  2. Geolocation API
  3. Functions and Options
  4. Example
  5. Example(cont’d)
  6. Success Function
  7. Error Function
  8. Options
  9. Users Need to Agree!
  10. watchPosition API
  11. How does it work?
  12. Summary

13. WEB STORAGE AND  SQL

  1. Data Storage
  2. Data Storage Options
  3. Web Storage
  4. Programming Interface – Storage/Retrieval
  5. Programming Interface – Enumerating the Values
  6. Programming Interface – Removing Items
  7. Example – Storing a value
  8. Example – Retrieving a value
  9. Example – Listing all the keys
  10. “Expandos”
  11. Storing JavaScript Objects
  12. Retrieving JavaScript Objects
  13. Web SQL Databases
  14. Using a Web SQL Database
  15. Running Queries
  16. Running Queries (cont’d)
  17. Reading Values
  18. IndexedDB
  19. Creating an Object Store
  20. Loading the Store Shelves
  21. Browsing the Shelves
  22. Storage Considerations
  23. Summary

 14. OFFLINE PROCESSING

  1. Offline Concepts
  2. The Cache Manifest File
  3. Contents of the Cache Manifest
  4. Contents of the Cache Manifest (cont’d)
  5. Serving the Cache Manifest
  6. applicationCache
  7. Conclusion

 15. APACHE CODOVA (PhoneGap)

  1. The Cordova Model
  2. Packaging a Cordova Application
  3. Cordova APIs
  4. App Stores

16. T THE JQUERY MOBILE TOOLKIT

  1. Introduction
  2. Downloading and Using jQuery Mobile
  3. The Basics
  4. Example: A Multi-Page HTML
  5. The Anatomy of a Page
  6. Example of Page Segments
  7. Theming
  8. Creating a List View
  9. Decorating List View Rows
  10. Implement Master Detail Navigation Pattern
  11. Create a Tabbed View
  12. Summary

17. JQUERY FUNDAMENTALS

  1. The jQuery Function
  2. Wrapper chaining
  3. Selectors
  4. .live()
  5. Document Events

18. STYLE CLASS MANIPULATION

  1. Apply styles to element
  2. Defining style sheets
  3. Setting properties
  4. Adding Classes

 19. DOM MANIPULATION

  1. Selectors
  2. Psuedo-selectors
  3. Appending and Removing Elements
  4. Best Practices

20. THEMES

  1. Theme Roller
  2. Editing Themes
  3. Custom Transitions

 21. EVENTS

  1. Page Events
  2. Gestures
  3. Orientation Events
  4. Virtual Clicks

 19. BUTTONS

  1. Inline Buttons
  2. Grouping
  3. Icon only Buttons

22. LISTS AND GRIDS

  1. Visual Separators
  2. Interactive Rows
  3. Images
  4. Grids

 23. JSON

  1. JavaScript Object Literals
  2. Converting to JSON
  3. Converting from JSON

24. DEVICE INFORMATION

  1. Device Information API
  2. Contacts

25. THE FILE API

  1. Reading a File
  2. Writing a File
  3. Directory Navigation

 26. THE CAMERA

  1. Accessing the Camera
  2. Displaying Images

 

27. THE ACCELEROMETER

  1. What is the Accelerometer
  2. The API
  3. A shake event

^^

See more Internet Technologies courses