---

Course Description:

---

Website design means planning, creation and updating of websites. Website design also involves information architecture, website structure, user interface, navigation ergonomics, website layout, colors, contrasts, fonts and imagery (photography) as well as icons design.

Introduction

---

• Introduction & History of WWW
• What is website means?
• Difference between Server & Browser
• What is Domain, Deployment & Hosting

HTML

---

• Getting Started with HTML
• Creating First Web Page
• Understanding Basics of Web Page
• Requirement of DOCTYPE
• Tag vs Element
• HTML Headings
• Creating HyperLinks
• • Anchor Tag
• Tag Anatomy
• HTML Comments
• Setting the Colors
• Working with Images
• • HTML < img > tag
• • Understanding “alt” attribute
• • Image as link
• HTML Favicon Image
• Line Break & Horizontal Line
• < div > tag
• HTML Center Tag
• Text Formating
• • Bold
• • Italic
• • Underline
• • Strike
• • Marked
• • Smaller
• • Big
• • Quote
• HTML List
• • OrderedList < ol >
• • UnorderedList < ul >
• • DefinationList < dl >
• Creating Tables
• Understanding table structure

Advance HTML

---

• HTML Form
• Creating DataEntry Form
• Input with every type of data
• • Text
• • Number
• • Email
• • Password
• • Range
• • Tel
• • Color
• • Url
• • Date
• • Time
• • Month
• • Week
• • Radio
• • Checkbox
• • File
• Creating Dropdown List
• Creating Buttons(Submit,Reset,Image)
• Creating MultLine Input box
• Form Validation with “pattern” attribute
• HTML Character Entities
• HTML < sub > and < sup > tags
• HTML Semantic Elements
• • < article >
• • < section >
• • < details >
• • < figure >
• • < figcaption >
• • < header >
• • < nav >
• • < main >
• • < summary >
• Creating webpage inside a webpage
• • < iframe > tag
• Play Video
• • < video > tag
• Play Audio
• • < audio > tag
• Play Youtube video on your webpage
• HTML < meta > tag

Project Work

---

CSS

---

• Introduction & History of CSS
• Types of CSS Implementation
• • Inline,Internal & External
• Understanding CSS syntax
• CSS selectors
• • Tag selector
• • ID selector
• • Class selector
• • Group selector
• • Universal selector
• • Combinator selector
• • - Descendent selector
• • - Child selector
• • - Adjacent Sibling selector
• • - General Sibling selector
• Color Formats
• Design Customisations with
  and tag
• Border CSS property
• Round Border property
• Outline CSS property
• Working with height & width property
• Understanding max-width value
• Margin & Padding property
• Background property
• • Background color
• • Background Image
• • Background repeat
• • Background attachment
• Background Gradient
• • Linear
• • Radial
• Text Formating
• • Align
• • Direction
• • Decoration
• • Transform
• • Intent
• • Spacing
• • Line Height
• • Word Spacing
• • Text Shadow
• Box Shadow
• Float Property
• Font Property
• Display Property
• Creating Page Layout

Advance CSS

---

• Position Property
• Z-Index Property
• Opacity Property
• Overflow Property
• Creating a division in Horizontal center
• Pseudo class
• Navigation Vertical
• Navigation Horizontal
• Filter Property
• Transition Property
• • Timing Functions
• Transform Property
• • Translate
• • Rotate
• • Scale
• • Skew

Project Work

---

JavaScript

---

• Introduction & History of JavaScript(JS)
• Creating Popup Dialog
• Ways for adding JS in HTML page
• Plain JS
• JS using Function
• Change Text using JS
• Operators
• • Assignment
• • Arithmetic
• • ShortHand
• • Increment-Decrement
• • Relational
• • Logical
• Decision Making
• • If
• • If-else
• • If-else-if
• • Switch
• Loop Controls
• • For loop
• • While loop
• • Do-while loop
• Window methods
• Document methods
• Arrays
• String
• String methods
• Change CSS using JS
• JS Events
• • Click event
• • Key event
• • Mouse event
• • Focus event
• • Load event
• • Scroll event
• • Resize event

Project Work

---

JQuery(JQ)

---

• Introduction & History of JQuery
• Using JQ manually
• Using JQ CDN
• Change CSS using JQ
• JQ Events
• JQ Effects
• Using JQuery based plugins
• Image Gallery (LightBox) using JQ

Bootstrap Framework

---

• Getting started with Bootstrap
• Grid system in Bootstrap
• Adding Header & Navigation
• Adding Logo in Navigation Bar & Adding Banner
• Adding Jumbotron
• Adding Rows, Columns & Containers
• Adding Column Width using offset Ordering Columns using push or pull
• Nesting Columns in Bootstrap Adding Footer top Website Typography in Bootstrap
• Adding Responsive or Utilities in Bootstrap
• Styling Button using between classes
• Styling Images and making images Responsive

Project Work

---

Making the website live:

---

• Deploying & Hosting on server