Training Calendar

Previous YearPrevious MonthNext YearNext Month
November 2024
Mon Tue Wed Thu Fri Sat Sun
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

psmb

Total Visitors

38.2%United States United States
21.2%China China
19.1%Canada Canada
8.5%Russian Federation Russian Federation
6.3%Malaysia Malaysia
2.1%United Kingdom United Kingdom
2.1%France France
2.1%Germany Germany

Yesterday: 1
This Week: 1
Last Week: 6
This Month: 12
Last Month: 9
Total: 50085

Introduction To Development Using HTML5, CSS3 & JQuery

  • Print

 

Course Overview

 

HTML5, CSS3 and Javascript together enable web designers and developers to create dynamic and flexible web content. CSS3 is used in conjuction with HTML5 and Javascript to add effect to page elements and even create animated effects without the need for browser plugins. Content can be made to response to different devices, screen-size and orientation which is important for both desktop and mobile websites and applications. This course will bring you quickly up to speed with these key technologies which underpin the web. The course provides a through introduction into the use of HTML5, CSS3 and jQuery to create Web sites that target the capabilities of modern browsers.

 

 

Objectives

  • Create dynamic, responsive content for devices across platforms, including mobile devices.
  • Use jQuery to make rich user experience and unlock the potential of HTML5.
  • Debug your web sites in the browser.
  • Know how to use the latest input types and attributes to improve forms and make them easier to use on mobile devices.
  • Responsive site design with media queries – make your site adapt to browser size and mobile devices.

 

Pre-requisites

Experience in Java Script and HTML

 

HTML5 - Schedule

Day 1

09.00am – 10.00am

HTML5 Fundamentals

  • Overview of HTML5
  • Comparing HTML5 to XHTML
  • Changes to existings tag
10.00am – 10.30am

Breakfast

10.30am – 12.45pm
  • Deprecated elements and attributes
  • Browser supported
  • Modernizr Javascript library
  • HTML5 Shiv and polyfills

HTML5 Structural Elements

  • New block-level semantic elements
  • New text-level semantic elements
  • Creating a document outline

Audio and Video

  • Browser support for Audio/Video
  • formats
  • Audio and Video elements
  • Media element API and events

12.45pm – 02.15pm

Lunch

02.15pm – 05.00pm

HTML5 Web Forms

  • New form attributes
  • New input attributes
  • New form elements
  • New input elements
  • Form validation

Introduction To CSS3

  • What's new in CSS3
  • Benefits of using CSS3
  • Browser Support
  • Vendor prefixes

Day 2

09.00am – 10.00am

CSS3 Properties

  • Custom fonts
  • Changing the opacity of text and images
  • Creating rounded corners, adding shadow to boxes and using images as borders

10.00am – 10.30am

Breakfast

10.30am – 12.45pm
  • Creating multiple columns for laying
  • out text
  • Working with RGBA and HSL colour models

CSS3 Selectos and Pseudo-Classes

  • New attributes selectors
  • Selecting the nth elements
  • Selecting the nth of a type

Working With Different Media Types

  • Media Queries
  • Changing layout based on screen size
  • Designing for mobile devices

12.45pm – 02.15pm

Lunch

02.15pm – 05.00pm

Introduction to Bootstrap

  • Layout with bootstrap
  • Everyday bootstrap
  • Bootstrap components
  • Bootstrap and Javascripts

jQuery Fundamentals

  • Overview of jQuery
  • Downloading and using jQuery
  • Benefits of using jQuery
  • Uses of the jQuery function

                                                                        Day 3

09.00am – 10.00am

jQuery Selectors and Filters

  • Using jQuery selectors and filters
  • Selecting single and multiple
  • elements
  • Operating on wrapped sets
  • Method chaining

10.00am – 10.30am

Breakfast

10.30am – 12.45pm

jQuery Events

  • jQuery event model
  • Binding and removing event handlers
  • Delegated and direct events
  • Event object
  • Common jQuery event

12.45pm – 02.15pm

Lunch

02.15pm – 05.00pm

Page Animation With Effects

  • Controlling visibility
  • Creating slide and fade effects
  • Creating custom animations
  • Animation queuing and callback functions

                                                                        Day 4

09.00am – 10.00am

Ajax Request Using jQuery

  • Ajax overview
  • Loading remote HTML
  • Making Ajax requests using the $.ajax() function
  • Using the $.get() and $.post() functions

10.00am – 10.30am

Breakfast

10.30am – 12.45pm

jQuery Form Enhancement

  • Using form selectors and filters
  • Handling keyboard and focus events
  • Improving behavior and appearance
  • Performing form validation
  • Using the validation plugin

12.45pm – 02.15pm

Lunch

02.15pm – 05.00pm

Utility Functions

  • Disabling animations
  • Using other Libraries with jQuery
  • String and array manipulation

jQuery Plugins

  • Benefits of plugins
  • Integrating popular plugins
  • Image manipulation with slideshow and caraousels