Over

120,000

Worldwide

Saturday - Sunday CLOSED

Mon - Fri 8.00 - 18.00

Call us

 

App Designing with HTML & CSS


Students will learn the skills necessary to become a Back-End Engineer, Front-End Engineer, or a Full-Stack Engineer. After completing the courses, you will be able to design web pages for both static and dynamic websites with latest technologies. You can opt for HTML5 training course, LAMP Developer training course or WAMP Developer training course among others. The package also includes courses on Android Application Testing, App Development using AngularJS for Professionals, Professional Web Designing with HTML & CSS, Object Oriented JavaScript, Bootstrap Framework, Koenig Course for JavaScript and jQuery, Ruby on Rails 4.0 and JavaScript and HTML5: Develop Web Application.

Course Duration :- 40 hours
Upon the completion of the Informatica course, the candidates will be able to do the following:
Learn the structure and markup of HTML
Explore new HTML5 form features
Learn to employ best practices
Work with CSS3 and build HTML5 applications
Learn the components and create styles using CSS3
Understand how to design page layouts and employ positioning with CSS3
Use best practices in CSS3 when using display commands such as web fonts, transforms and selectors
The package also includes courses on Android Application Testing, App Development using AngularJS for Professionals, Professional Web Designing with HTML & CSS, Object Oriented JavaScript, Bootstrap Framework, binary Course for JavaScript and jQuery, Ruby

KEY FEATURES

Accredited Training Partner

To teach real programming skills

Build a solid understanding

Educated Staff

Timesheets

Video Lessons

Modules / Levels

1. Overview of HTML5

The Story Behind

The HTML5 Advantages

HTML vs. HTML5

What’s new in HTML5

Semantic Markup

New HTML5 Semantic Tags

2. Semantic Markup and Selector APIs

Semantic Markup

Selector APIs

3. The Canvas API

Introduction

History

Understanding Canvas

Context

Coordinates

Browser Support & Alternate Content

Working with Canvas

Checking for browser support

Writing Text on Canvas

Drawing a line

Applying Transformations to Drawings

Translate in Canvas

Working with Paths

Working with Stroke Styles

Working with Rectangle

Working with Fill Styles

Working with Curves Insert Image into Canvas

Linear Gradient

Radial Gradient

Background Pattern

Scaling Canvas Object

Canvas Text

Applying Shadows

4. Scalable Vector Graphics in HTML5

Overview

HTML 5 & CSS 3

Working with SVG in HTML5

i. Working with SVG Shapes

ii. Transforming SVG

iii. Reusing SVG Elements

iv. Drawing Paths

v. Using Patterns and Gradients with SVG

A small Application using SVG

5. Multimedia in HTML5

Introduction to Multimedia

Codecs and Containers

Browser support for Audio/ Video

i. Checking the Browser Support

Working with Audio/ Video Elements

i. Using Autoplay

ii. More attributes

iii. Control Functions

iv. Adding Subtitles for Accessibility

v. Audio Activation

vi. Exclusive Video Attributes

vii. Video Timeline Browser

6. Understanding Geolocation API

Overview

Sources of Location Information

Privacy Protection

Checking for Browser Support

Position Requests

i. One-Shot Position Request

ii. Repeated Position Updates

Showing Location on Google Map

7. Working with Forms API

Overview of Forms

Functional Forms

The Input Catalog

Common Input Types

i. text

ii. password

iii. submit

iv. radio

v. checkbox

HTML 5 & CSS 3

vi. button

HTML5 Input Types

i. number

ii. date

iii. color

iv. range

v. month

vi. week

vii. time

viii. datetime-local

ix. email

x. search

xi. tel

xii. url

HTML5 Form Attributes and Functions

Validating Form Elements in HTML5

A complete Application

8. Communications API in HTML5

Introducing Cross Document Messaging

i. Sending a message

ii. Receiving a message

iii. Listening to the Message Events

iv. Sample Application using postMessage

XMLHttpRequest Level 2

i. Progress Events

ii. Cross-Origin Requests

Using Progress Events

Complete Application

9. Working with WebSockets

Understanding WebSockets

WebSocket Handshake

WebSocket Interface

i. Methods

WebSocket Framing

Adding Event Listeners

10. Working with Web Workers

Understanding Web Workers

Web Workers API

i. Browser Support

HTML 5 & CSS 3

Working with Web Workers

i. Initialization

ii. Stopping

iii. Error Handling

iv. Shared Web Workers

11. Working with Drag-and-Drop

Understanding the Concept

Drag-and-Drop API HTML5

Drag-and-Drop Events

i. The Event Flow

Functions and Properties

File Handling

A complete Application

12. Using Storage APIs

Understanding Storage

Setting and Retrieving Values

i. Resolving Data Leaks

Storage API Attributes and Functions

i. Web Storage Updates

ii. Web Storage Explained

Complete Implementation

13. Offline Web Applications with HTML5

Offline Web Applications

Cache and Web Application

i. Cache Manifest File

Complete Illustration

14. Introduction to CSS3

Brief Description

Writing CSS

i. Defining Styles

ii. External Style Sheets

iii. Inline Style Sheets

iv. Declaration Block

v. Selectors

Browser-specific Prefixes

Adding Comments to a CSS

15. Basic Selectors

Understanding Selectors

The Document Object Model (DOM)

HTML 5 & CSS 3

i. Working of Selectors

Using

Types of Selectors

i. Universal Selectors

ii. Type Selectors

iii. Class Selectors

iv. ID Selectors

v. Descendant Selectors

vi. Attribute Selectors

vii. Pseudo-classes

viii. Pseudo-elements

Grouping Selectors

Styling Links

Playing with Cursor

16. Working with Sizes, Colors and Files

Sizes and Measuring Units

i. Relative Units

ii. Example of Relative Units

iii. Angles

iv. Computing Length Values with calc()

Exploring Colors

i. Color Names

ii. Hexadecimal Notations

iii. RGB Format

iv. RGBA Format

v. HSL Format

vi. HSLA Format

 Background Images

17. Styling Text

 Working with Fonts

i. font-family

ii. font-size

iii. font-style

iv. font-variant

v. font-weight

 Dealing with Line Spacing

 Changing the Text Color

 Text Formatting

i. text-align

HTML 5 & CSS 3

ii. text-decoration

iii. text-indent

iv. text-transform

v. vertical-align

vi. white-space

vii. text-overflow

 Adding Text Shadows

i. Text Shadow

ii. Adding Blur Effect to Shadow

iii. White Text with Black Shadow

iv. Adding Multiple Shadows

18. Web Fonts

 Desktop Fonts vs. Web Fonts

 Adding Web Fonts to Sites

i. Font Hosting Service

ii. Storing Fonts to the Web Server

 Font Formats and the Supporting Browsers

 Embedding Web Fonts

19. Background, Borders and Shadows

 CSS Background

i. background-color

ii. background-image

iii. background-repeat

iv. background-position

v. background-attachment

 Adding Multiple Images to the Background

 Defining Borders

i. Border-style

ii. Border Width

iii. Border Color

iv. Border Shorthand

 Additional Border Properties

i. Single Sided Border

ii. Border with Alpha Transparency

iii. Rounded Corner Borders

 Using Border Images

i. Image Border Properties

 Adding Drop Shadows

i. Adding Drop Shadow

HTML 5 & CSS 3

ii. Using Inset

 Outline Styling

20. Gradients without Images

 Understanding Gradients

 Creating Linear Gradients

i. Browser support

ii. Specifying Colors

iii. Specifying Direction

iv. Controlling Transparency

 Creating Radial Gradients

i. Differently Spaced Color Stops

ii. Specifying Shape

iii. Specifying Size

 Repeating Gradients

 Using Multiple Gradients

21. Advanced Selectors

 Why Advanced Selectors

 First, Last and Only Child Instances

i. :first-child Selector

ii. :last-child Selector

iii. :only-child Selector

iv. :first-of-type Selector

v. :last-of-type Selector

vi. Difference between :first-child and :first-of-type

 Styling Selectors Based on Positions

 Styling Selectors Based on Relationships

 Styling Selectors Based on States

 Negative Selectors

 Other Pseudo Classes

22. Lists and Navigation Menus

 Working with Lists

i. List Styling Properties

 Navigation Menus

i. Creating Vertical Navigation Bars

ii. Creating Horizontal Navigation Bars

23. Exploring Generated Content

 What is Generated Content

 Inserting the Generated Content

i. Setting the Selectors Attribute as Generated Content

HTML 5 & CSS 3

ii. Inserting Text as Generated Content

iii. Enclosing Content in Quotes

iv. Image (url) as Generated Content

 Working with Counters

i. Incrementing the Counter

ii. Initializing the Counter

 Using before and after as Pseudo Classes

1 Introduction to Bootstrap

 Introduction

 Bootstrap File Structure

 Default Grid System

 Fluid Grid System

 Responsive Design

2 Bootstrap CSS

 Typography

 Tables

 Forms

 Button

 Images

 Icons

3 Bootstrap Layout Components

 Dropdown Menus

 Button Groups

 Button with Dropdowns

 Navigation Elements

 Navbar

 Breadcrumbs

 Pagination

 Labels

 Badges

 Typographic Elements

 Thumbnails

4 Alerts

 Progress Bars

 Media Object

5 Bootstrap JavaScript Plugins

 Model

 Dropdown

 Scrollspy

 Toggleable Tabs

 Tooltips

 Popover

 Alerts

 Buttons

 Collapse

Bootstrap Framework

 Carousel

 Typeahead

6 Using Bootstrap

 Customizing Bootstrap

 Built with Bootstrap

Drop us a Query

Your Name (required)

Your Email (required)

Phone No

Your Query

What You Get

  • 24/7 e-Learning Access
  • Certified & Industry Experts Trainers
  • Assessments and Mock Tests