UI – HTML5 Training

Course Content overview

  • HTML5
  • CSS3
  • DOM structure
  • Advanced JavaScript (Data Structures, Event Listeners, Control structures, Prototyping, Closures, Inheritance & Adding methods for an object)
  • Developing Responsive/Adaptive Designs
  • UI development Best practices and standards along with Dos and Don’ts
  • JQuery / Bootstarp3 / Angular JS framework

The course agenda will include:

  • Case Study by using all features of HTML 5 and CSS 3

Introduction to HTML 5

  • What is HTML 5?
  • Why HTML 5?
  • HTML5 DOCTYPE
  • Page Encoding
  • HTML5 Symantec Markup
    • Header, nav, footer,article,section,aside ,hgroup….
  • Browser Support
  • HTML 5 polyfill and Shims
  • HTML 5 Shiv
  • Modernizer

Forms

  • New Form Controls
    • number,mail,url,tel,month,datetime,time….
    • Form validation attributes

Audio and Video

CSS 3 and Bootstrap:

  • What is new in CSS 3
  • CSS 3 selectors (pseudo & state based)
  • Transform in CSS3
  • Gradients, shadows and Round corners
  • Animation
  • 2D and 3D rendering
  • Media queries
  • Introduction to Responsive rendering with Bootstrap
  • Quick overview on SASS / LESS programming

API

  • HTML5 Canvas& SVG
    • 2D graphics
    • SVG graphics with HTML 5
  • Web Storage
    • Local storage
    • Session Storage
    • web sql
  • Drag and Drop (DnD)
    • Working with Realtime application
  • Web workers
    • Demonstrating workers with Ajax
  • Web sockets
  • Html 5 Application Caching (Offline application)
    • Working with Manifest
  • Geo Location

JavaScript and Advanced JavaScript with ECMA 6

  • Quick overview of JavaScript
  • Understanding BOM and DOM
  • Primitive types and Reference types
    • Number,String,Boolean,null,undefined,Object
  • Functions
    • Declarative functions
    • Anonymous Function (Function Expression Syntax)
    • Instance Function
  • Working with typeof, instanceof
  • Working with Object
  • JSON
  • Scope (global vs local)
  • Prototypical inheritance
  • Closures (IIFE)
  • JavaScript Patterns
    • Module pattern
    • Mixin
    • Singleton
  • Quick overview on ECMA 6 new features (Harmony)

jQuery:

  • Selectors
  • Event handling
  • DOM manipulation
  • Ajax

Extending jQuery