HTML5 Coding Essentials and Best Practices

20
Web Apps Development with HTML5, CSS3, jQuery & Bootstrap 1 & by

Transcript of HTML5 Coding Essentials and Best Practices

Page 1: HTML5 Coding Essentials and Best Practices

Web Apps Development with HTML5, CSS3, jQuery & Bootstrap

1

&

by

Page 2: HTML5 Coding Essentials and Best Practices

Nowadays, advancement in technology has undoubtedly changed the way user accesses online information. To meet

the demand for accessing online information using a variety of devices & form factors, Web developers are adapting

new development strategies to develop websites. Instead of designing multiple versions of a website so that it

supports every device, they now create a single website that will adjust itself according to the device on which it is

accessed. Such websites can be created using the Responsive Web Design (RWD) technique.

In this course, you will learn to create responsive websites using HTML5, CSS3, and bootstrap framework. The course

covers the need of creating responsive websites that adjusts their structure or layout according to the device screen

on which they are accessed. It explains the various building blocks used to create responsive websites. In addition,

students will learn how to add interactivity to websites using jQuery & HTML5 APIs.

This course has been designed with a unique pedagogy of live expert training along with self-paced learning from edX

and hands on training through projects for a holistic learning.

The course also comes with a verified certificate from W3C by edX.

2

About The Course

Consumers have give 5/5 rating for this course

Page 3: HTML5 Coding Essentials and Best Practices

Batch Faculty: Mr.Vijay K Srinivasan, 22+ years of Industry relevant experience

Delivery Methodology: Live Online Program; Direct to Device

Duration: 16 hrs of Live Online Class, 30 hrs of self paced learning , 15 hours of project work

Schedule: Saturday, 2 hr daily , 6 pm- 8pm

Program Fees: INR 9900 + current applicable taxes (payable online).

Orientation Session Date: 24th Sept2016

3

BROAD CONTOURS

Page 4: HTML5 Coding Essentials and Best Practices

UNIQUE FEATURES

Certification from W3C

• On successful completion of the course, you will get W3C certificate worth ~ Rs.6800 ( $99)

• The certificate will verify your achievement and increase your job prospects

Expert Faculty with mentors

• Live The faculty comes with a 22+ years experience

• You also get a support of mentors who will help you resolve your queries even after the session. Tech mentors with min 10 years industry experience

Live ,Online

• The course is delivered Online Through Live interactive classes.

• Convenience of accessing the course from home/hostel on your device and save on the travel time & cost.

Quizzes

• Module wise quizzed to ensure mastery in the topic

NIIT Certification

• On successful completion, in addition to the W3C certification, you also get an NIIT certificate.

4

Page 5: HTML5 Coding Essentials and Best Practices

After completing the course, the student will be able to:

• Implement powerful features of HTML5 for multimedia, graphics, form inputs etc

• Implement HTML5 APIs for critical functionalities such as offline application, enhanced performance etc.

• Understand building blocks and the architecture of Responsive Web Design using Bootstrap

• Add fluidity to a website

• Identify the different types of JavaScript libraries

• Implement jQuery events and AJAX functionality

5

What Will You Learn

Page 6: HTML5 Coding Essentials and Best Practices

• Software professionals with less than 2 years of experience

• Web designer with a inclination towards presentation layer programing

• Students who are looking for a job in front end application development

6

WHO SHOULD ATTEND

Page 7: HTML5 Coding Essentials and Best Practices

• You will learn the advanced and latest features of HTML5

• The course comes with two certifications – W3C certification by edX ( which is the international standards body for world wide web) & that of NIIT ( which is a global skills & training company)

• The subject is taught by a very senior expert with 22+ years in hardcore IT domain.

• It is convenient to attend the course, as you can do it from the ease of your home/ college/office as this is delivered online

• The online sessions are interactive where you can ask your questions from the Tech expert and clarify your doubts

• The learning is through project which will give you a holistic learning experience.

7

Why Should I join this course

Page 8: HTML5 Coding Essentials and Best Practices

COURSE CONTENT

• Session 1: HTML5 and CSS3 Introduction

• Session 2 : HTML5 multimedia Elements & API, Implement CCS3

• Session 3 : HTML5 graphics using Canvas

• Session 4: Introduction to Animation using Canvas

• Session 5: Introduction to HTML5 Forms and Media Queries

• Session 6: Implementing Advanced HTML5 APIs

• Session 7: Bootstrap Framework -1

• Session 8: Bootstrap Framework - 2

8

Page 9: HTML5 Coding Essentials and Best Practices

Certification Criteria

• The course will have 8 modules

• Learner Needs to clear the final assessment with min 70% marks for the NIIT certificate

• Learner need to clear the module wise assessment on edX to get a verified certificate from W3C by edX.

9

CERTIFICATION

Page 10: HTML5 Coding Essentials and Best Practices

SAMPLE CERTIFICATE*

*For illustrative purposes only10

Page 11: HTML5 Coding Essentials and Best Practices

Mr.Vijay K Srinivasan

• 22+ years experience in IT sector

• Sr. Vice President , IT and Automation

• Wizard in enterprise architecture & design across multiple platforms.

• Heads the technical organization for a startup in education sector.

11

BATCH FACULTY

Page 12: HTML5 Coding Essentials and Best Practices

Our Stats on HTML Training

Trained more than 28000+ students in HTML5 in past 5 years itself

* As NIIT group12

Page 13: HTML5 Coding Essentials and Best Practices

• The World Wide Web Consortium (W3C) is an international

community where Member organizations, a full-time staff,

and the public work together to develop Web standards.

• The W3C mission is to lead the World Wide Web to its full

potential by developing protocols and guidelines that ensure

the long-term growth of the Web.

13

ABOUT W3C

Page 14: HTML5 Coding Essentials and Best Practices

• This is a complete Online program – Live & Interactive plus self read videos

• Our live, instructor led sessions will be conducted Direct to Device, at home/college

• The blended learning comes self paced course from W3 Consortium plus live interactive learning session from NIIT’s expert Faculty.

14

DELIVERY METHODOLOGY

System Requirements• PC/Laptop/Mobile Device• Web Camera• Headphone with Mic• Internet Connection with > 1Mbps Speed

This self-diagnostic test will verify if you meet the necessary requirements (except webcam and mike)

https://na1cps.adobeconnect.com/common/help/en/support/meeting_test.htm

Page 15: HTML5 Coding Essentials and Best Practices

Application

Enrol online at www.training.com

Payment Options

• INR 9900 + applicable taxes

15

HOW TO APPLY

* plus current applicable taxes

Page 16: HTML5 Coding Essentials and Best Practices

DETAILED MODULE WISE CONTENT

16

Page 17: HTML5 Coding Essentials and Best Practices

Module 1-4

Module 1: HTML5 and CSS3 Introduction• Introduction to HTML5

• New structural elements

• Other elements and attributes

• Introduction to CSS3

• Introduction to SEO and Microdata

• Assignment(s)

Module 2: Implement HTML5 multimedia Elements & API and CSS3

• Streaming multimedia content

• Subtitles and closed captions

• Enhanced HTML5 media players and frameworks

• HTML5 API for integrating webcam and microphone features

• Applying CSS3 style sheets to enhance the user experience

• Assignment(s)

Module 3: Implement HTML5 graphics using Canvas

• Basics of HTML5 canvas

• Immediate drawing mode: rectangles, text and images

• Path drawing mode: lines, circles, arcs, curves and other path drawing methods

• Colors, gradients, patterns, shadows, etc.

• Assignment(s)

Module 4: Implement Animation using Canvas

• Basic animation techniques

• Canvas and user interaction (keyboard, mouse)

• A glimpse of advanced canvas functionalities

• Introduction to business Case study

17

Page 18: HTML5 Coding Essentials and Best Practices

Module 5-8

Module 5: Implement HTML5 Forms and jQuery

• Introduction to HTML5 forms• Accessible forms• New input types• New form attributes• New elements related to forms• Form validation API• Form validation using jQuery• Build your first professional Web Page

Module 6: Implement Advanced HTML5 APIs

• Introduction to HTML5 APIs• HTML5 Cache• Web Storage API• File API• Geolocation API• Web Socket API• Web Messaging API

Module 7: Implement Bootstrap Framework - 1

• What is Bootstrap?

• Why do we use Bootstrap?

• Bootstrap Folder structure

• Bootstrap Metatag

• Bootstrap Grid System

• Bootstrap Navigation Bar

Module 8: Implement Bootstrap Framework - 2

• Introduction to Bootstrap Text Typography

• Introduction to Bootstrap Form Controls

• Introduction to Bootstrap Button

• Introduction to Bootstrap Alert messages

18

Page 19: HTML5 Coding Essentials and Best Practices

DISCLAIMER

This presentation has been prepared for general understanding of the candidates about the Program. NIIT reserves the right, in its sole discretion, to revise, add, supplement or complement the academic aspects of the Program including but not limited to the curriculum, admission norms, examination, evaluation criteria and the nomenclature of the Program as well as the certificate/credential awarded to the candidates

19

Page 20: HTML5 Coding Essentials and Best Practices

For any Doubts or Queries,

Call us at 1800 208 1050

(or)

Write to us at [email protected]

20