Developing Rich Internet Applications Using HTML5, CSS3 and jQuery

Duration: 5 Days | Price: CDN$2875 *Prices are subject to GST/HST

Class Dates:

Students Will Learn:

HTML5 Structural Elements
HTML5 Forms
Audio and Video Elements
Canvas
CSS3 Properties

CSS3 Animations, Transforms and Transitions
jQuery Selectors
jQuery Event Model
Use of jQuery Plugins
jQuery UI Themes and Widgets

Course Description: This hands on course is intended for experienced Web designers and developers who wish to exploit HTML5 and jQuery to create feature-rich, dynamic Web sites. The course provides a thorough introduction into the use of HTML5, CSS3 and jQuery to create Web sites that target the capabilities of modern browsers. HTML5 includes new structural and form elements, implementation of audio and video elements, and intrinsic APIs that offer features such as "offline" applications, local and Web storage, and dynamic creation of graphics using Canvas. CSS3 introduces new selectors and properties, creation of drop shadows, text shadows, rounded corners and gradient backgrounds without the use of an image editor, as well as simple animated effects without the use of JavaScript or Flash.

jQuery simplifies client-side scripting via a series of open-source libraries that provide frameworks for enhanced functionality. The course covers the jQuery library, DOM manipulation, Ajax requests, and use of the UI library to include animation effects and popular widgets such as datepickers and autocomplete. Comprehensive hands-on exercises are performed throughout each day to demonstrate key concepts. Students who are not familiar with HTML, CSS and JavaScript should instead register for the course, Web Site Development With HTML/JavaScript.

Course Prerequisites: Knowledge of HTML, CSS and JavaScript equivalent to attending the Web Site Development With HTML/JavaScript course.

Developing Rich Internet Applications Using HTML5, CSS3 and jQuery Course Overview:

HTML5 Fundamentals Overview of HTML5 Comparing HTML5 to XHTML Changes to Existing Tags Deprecated Elements and Attributes Browser Support Modernizr JavaScript Library ARIA	HTML5 Structural Elements New Semantic Elements <header> <footer> <section> <article> <nav> <aside> <hgroup> <figure> and <figcaption> <mark> Creating a Document Outline
Audio and Video Browser Support for Audio/Video Formats Overview of Codecs <audio> and <video>Elements <source>Element Media Element API and Events	HTML5 Web Forms New Form Attributes autocomplete novalidate New Input Attributes autofocus form min, max and step multiple pattern New Form Elements <datalist> <progress> New Input Elements email url tel search Form Validation
HTML5 JavaScript APIs Canvas API Web Storage API File Storage API Geolocation API Drag and Drop API Web Workers API Taking a Web Application "Offline"	Introduction to CSS3 What's New in CSS3? Benefits of Using CSS3 Browser Support Vendor Prefixes
CSS3 Selectors and Pseudo-Classes "Starts With" Selector "Ends With" Selector "Contains" Selector:nth-child(N) :nth-last-child(N) :nth-of-type(N) :nth-last-of-type(N) :root :target	CSS3 Properties Using Vendor-Specific Extensions to Ensure Cross-Browser Compatibility Using @font-face to Add Custom Fonts Changing the Opacity of Text and Images Creating Rounded Corners, Adding Shadows to Boxes, and Using Images as Borders Creating Multiple Columns for Laying Out Text Working with RGBA and HSL Color Models Creating Simple Animations Using transitions, transform, and animation
Working with Different Media Types Media Queries Changing Layout Based on Screen Size Designing for Mobile Devices	jQuery Fundamentals Overview of jQuery Downloading and Using jQuery library Benefits of Using jQuery
jQuery Selectors and Filters Using jQuery Wrapper document.ready() Using jQuery Selectors and Filters Selecting Single and Multiple Elements Wrapped Sets Method Chaining	DOM Manipulation Review of Document Object Model Accessing Attributes of an Element Adding and Removing Elements Setting element Content With text() and html() Manipulating Classes and CSS
jQuery Events Review of Past Event Models jQuery Event Model Binding and Removing Event Handlers Event Object Common jQuery Events	Page Animation with Effects Controlling Visibility Using show() and hide() Creating Slide and Fade Effects Creating Custom Animations Animation Queuing and Callback Functions
Ajax Requests Using jQuery Ajax Overview Loading Remote HTML Utilizing Global Event Handlers Fetching Data with getJSON() Sending Form Data with Ajax	jQuery Form Enhancement Using Form Selectors and Filters Handling Keyboard and Focus Events Improving Behavior and Appearance Performing Form Validation Validation Plugin
Utility Functions Disabling Animations Using Other Libraries with jQuery String and Array Manipulation	jQuery Plugins Benefits of Plugins Integrating Popular Plugins Image Manipulation with Slideshows and Carousels Creating Custom Plugins
jQuery UI Overview Configuring and Downloading the UI Library Themes and Styles Using ThemeRoller Implementing Drag and Drop	jQuery UI Widgets Downloading Popular Widgets Using Sliders for Numeric Input List Simplification with autocomplete Using datepickers for Date Input

Multiple Training Locations - Convenience and Cost Control

Regularly Scheduled Courses in 11 Cities Across Canada

Hands On Technology Transfer, Inc.
1 Village Square, Suite 8
14 Fletcher Street
Chelmsford, MA 01824
978-250-4299