HTML5 Training

This course teaches you the basics of HTML5 including the latest in CSS styling. We discuss basic syntax and move forward to more advanced features such as JavaScript with animations, CSS3 and media queries, and styling with some of the new HTML5 tags. We don’t just discuss HTML5, but we also tell you how to perform actual design elements using embedded CSS classes. We also discover the latest form field tags that make gathering information and input from your users much easier.

2 Days

All participants must be fluent in HTML 4 and have practical experience with the basics of CSS and JavaScript.

  • Introduction
  • Laying out a Page with HTML5
    • Page Structure
    • New HTML5 Structural Tags
    • Page Simplification
  • HTML5 – How We Got Here
    • The Problems HTML 4 Addresses
    • The Problems XHTML Addresses
    • New Features of HTML5
    • The HTML5 Spec(s)
    • Current State of Browser Support
  • Sections and Articles
    • The section Tag
    • The article Tag
    • Outlining
    • Accessibility
  • HTML5 Audio and Video
    • Supported Media Types
    • The audio Element
      • Audio Formats
      • Multiple Sources
      • Audio Tag Attributes
      • Getting and Creating Audio Files
    • The video Element
      • Video Tag Attributes
      • Creating and Converting Video Files
    • Accessibility
    • Scripting Media Elements
    • Dealing with Non-Supporting Browsers
  • HTML5 Forms
    • New Input Types
      • search
      • tel
      • url and email
      • date/time input types
      • number
      • range
      • min, max, and step attributes
      • colour
  • HTML5 New Form Attributes
    • autocomplete
    • novalidate
  • HTML5 New Form Field Attributes
    • required
    • placeholder
    • autofocus
    • autocomplete
    • form
    • pattern
  • New Form Elements
    • data list
    • progress and meter
  • HTML5 Web Storage
    • Problems with the existing Cookie-based Model
    • New Storage Options
      • Web Storage
      • Indexed DB Storage
    • Overview of HTML5 Web Storage
    • Web Storage
      • Browser Support
      • Local Storage
      • Session Storage
  • HTML5 Canvas
    • Getting Started with Canvas
    • Drawing Lines
      • Multiple Sub-Paths
      • The Path Drawing Process
      • The fill () Method
    • Color and Transparency
    • Rectangles
    • Circles and Arcs
    • Images
      • drawImage() – Basic
      • drawImage() – Sprites
    • Text
  • Integrated APIs
    • Offline Application API
      • Cache Manifest File
      • The HTML File
      • Managing Application Cache with JavaScript
      • The application Cache Events
      • Deployments and Updates
      • A Sample Application
    • Drag and Drop API
  • HTML5 Web Workers
    • The Current JavaScript Execution Model
    • Introduction to Web Workers
    • Usage of Web Workers
    • Communication APIs
    • Handling Errors
  • HTML5 Geolocation
    • Introduction to Geolocation
    • Mechanisms used to find geolocation
    • The Position Object
    • Handling Errors
    • Working with Google Maps
  • Conclusion