Web Designing

HTML

▪ What is HTML?

▪ What is a Web Browser?

▪ What are Versions of HTML?

▪ What can you Do with HTML?

▪ HTML Development Environments

▪ Writing Code with a Text Editor

• Review of HTML Elements

              ▪ Rules of Syntax

              ▪ Making your Code Readable

              ▪ Building a Document

              ▪ Using Colors

              ▪ Adding Color to your Page

              ▪ Using Headings

              ▪ Using Paragraphs

              ▪ Aligning Block-Level Elements

              • Inserting Spaces and Line Breaks

▪ Displaying Preformatted Text

▪ Formatting with Inline Elements

▪ Controlling Fonts

▪ Introducing List Elements

▪ Creating Unordered Lists

▪ Creating Ordered Lists

▪ Nesting Lists

• What is an HTML Table?

▪ Building a Table

▪ Cell Padding and Cell Spacing

▪ Controlling Table and Cell Width ▪ Aligning a Table on the Page ▪ Aligning Tables and Text

▪ Controlling Table and Cell Width

▪ Aligning a Table on the Page

▪ Aligning Tables and Text

▪ Aligning a Table on the Page

▪ Aligning Tables and Text

▪ Aligning Table Data

▪ Spanning Columns and Rows

• Creating a Hyperlink

▪ Understanding and Using URLs

▪ Linking to a Web Document

▪ Linking to a Local Document

▪ Linking to Anchors

▪ Opening a New Browser Window

• Image Formats

▪ Inserting Inline Images

▪ Aligning Images

▪ Using Images to Anchor Links

▪ Sizing Images

▪ Using Transparent Images

▪ Using GIF Animation

• Forms and Controls

▪ Forms and Form Elements

▪ Form Actions, Form Methods, Form Design

Introduction

▪ Laying out a page with HTML5

▪ Page Structure

▪ New HTML5 Structural Tags

▪ Page Simplification

• HTML 5 - How we got here?

▪ New Features of HTML5

▪ The HTML5 Semantic Element

▪ Current State of Browser Support

• SECTIONS AND ARTICLES

▪ The section Tag

▪ The article Tag

▪ The header Tag

▪ The Footer Tag

• HTML5 AUDIO AND VIDEO

▪ Supported Media Types

▪ The audio Element

▪ The video Element

• HTML5 FORMS

▪ New Input Types

• HTML5 NEW FORM ATTRIBUTES

▪ autocomplete

▪ novalidate

• HTML5 NEW FORM FIELD ATTRIBUTES

▪ required

▪ placeholder

▪ autofocus

▪ autocomplete

▪ form

▪ pattern

Introduction of CSS

• CSS Syntax

• CSS Comments

• CSS Types

▪ Inline

▪ Internal

▪ External

• CSS Selector

▪ ID

▪ Class

▪ Attribute

▪ Grouping

▪ Universal

• CSS Color

▪ RGB Value

▪ Hex Value

▪ Color Name

• Background

▪ background-color

▪ background-repeat

▪ background-attachement

▪ background position

▪ background-size

▪ background-image

• CSS Margin

▪ Margin-top

▪ Margin-bottom

▪ Margin-left

▪ Margin-Right

 CSS Padding

▪ Padding -top

▪ Padding -bottom

▪ Padding -left

▪ Padding –Right

• Outline

▪ Outline-style

▪ Outline-color

▪ Outline Width

▪ Outline-Offset

▪ Outline Shorthand Property

• CSS Height and Width

• CSS Display properties

• CSS Position Properties

• CSS Overflow

• CSS Float and Clear

• Pseudo Class and Element

Introduction to CSS 3

▪ Border

▪ border-radius

• CSS Shadows

▪ Text-shadow

▪ Box-shadow

• Transitions

▪ transition

▪ transition-delay

▪ transition-duration

▪ transition-property

• 2D Transforms

▪ transform

▪ matrix ()

▪ translate (x, y)

▪ scale (x, y)

▪ rotate(angle)

▪ skew (x-angle, y-angle)

• Animations

▪ @keyframes

▪ animation                                                              

▪ animation-name

• Selectors

▪ CSS combinations

▪ Pseudo Elements

• Gradients

▪ Linear Gradients

▪ Radial Gradients

• User Interface

▪ resize

▪ box-sizing

▪ outline-offset

• CSS Filters

▪ Blur

▪ Opacity

• Media Query

▪ What is Responsive Web Design

▪ Intro to the Viewport

▪ The Viewport Tag

▪ Media Queries

▪ Tablet Styles

▪ Mobile Styles

▪ Making a Mobile Drop-down Menu

• Web Fonts

▪ @font-face

▪ font-family

▪ src

▪ font-stretch

▪ font-style

▪ font-weight

• Flexbox

▪ flex-grow

▪ flex-shrink

▪ flex-basis

▪ flex

▪ flex-wrap

▪ flex-direction

▪ flex-flow

▪ justify-content

▪ align-items

▪ order

Introduction to JavaScript

▪ Syntax

▪ Statements

▪ Comments

Enabling in various browsers Popup Boxes

▪ Alert

▪ Confirm

▪ Prompt

 Variables

 Operators

▪ Arithmetic

▪ Assignment

▪ Comparison

▪ Logical

▪ Relational

▪ Ternary

Conditional Statements

▪ If else

▪ if...else if...else

▪ nested if

▪ Switch

▪ Loops

▪ While

▪ do...while

▪ for

▪ for...in Statement

▪ Break

▪ Continue

 Functions

▪ User-defined Functions

▪ Function Syntax

▪ Function with Arguments

▪ Returning Values from Functions

▪ Built-in Functions

 Events

▪ Introduction

▪ Mouse

▪ Events

▪ Keyboard Events

▪ Form Events

▪ Document/Window Events

Built-in Objects

▪ Number

▪ Strings

▪ Math

▪ Array

▪ Date

▪ Reg exp use in form validation

• Getting Started with jQuery

• Selecting Elements

• Manipulating the Page

• Traversing the DOM and Chaining

• Handling Events

• Enhancing with Animation Effects

• JQuery Hide/show

• jQuery toggle()

• jQuery Slide method

• jQuery Fade method

• jQuery stop()

• jQuery Callback and Chaining

• jQuery text(),html() and val()

• jQuery css()

• jQuery addClass(),removeClass(),toggleClass()

• jQuery Best Practices

• Introduction

▪ Introduction of Bootstrap

▪ What needs for Bootstrap

▪ Our First Web Page

▪ What's Inside?

▪ Scripts and Styles

▪ Bootstrap CDN Link

▪ Summary

• Layout with Bootstrap

▪ Introduction

▪ Grid Layouts

▪ Simple Layout

▪ Fixed Grids

▪ Responsive Design

▪ Responsive Utilities

▪ Summary

• Everyday Bootstrap

▪ Introduction

▪ Typography

▪ Tables

▪ Forms

▪ Buttons

▪ Images and Icons

▪ Summary

• Bootstrap Component

▪ Introductions

▪ Drop down Menu

▪ Buttons with Menus

▪ Tabs and Pill

▪ The Navbars

▪ Badges

▪ Summary

• Bootstrap and JavaScript

▪ Introduction

▪ More Buttons

▪ Modals

▪ Tooltips and Popovers

▪ Carousel

▪ Summary

• Fundamental of Web Hosting

• Types of Hosting Packages

• Linux and Windows Control Panel

• Using FTP Client

• Maintaining a Website

• Domain Names Registration

• What is SEO & its scope.

• Keyword Research and Analysis (Tools and Implementation)

• Website Analysis

• Website Performance Monitoring

• Google Analytics/Webmaster

• XML Sitemap

• Use of Meta Tags

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin