BASIS-SEIP Trance 3

Web Design Course Outline

Course Introduction

Course Curriculum

Workplace Setup

Day 02
Introduce to HTML5

Introduce to Tags, Elements, Nested Elements

Basic Building Blocks of HTML5

Day 03
Heading Tag

Paragraph Tag

Formatting Tag

Introduce to Attribute

Day 04
Table

Colspan

Rowspan

Day 05
Nested Table

Complex Table

HTML Comment Tag

Ordered Lists

Unordered Lists

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Description Lists

Day 07
HTML File paths

Image

Hyperlinks

Download

Layout Create using Table

Day 08
Media

Audio

Video

iFrame

Day 09
HTML Quotation and Citation Elements
HTML Entities
HTML Symbol Entities
HTML Emojis
Day 10
Forms

Input Elements & Attributes – First Part

Day 11
Forms

Input Elements & Attributes – Second Part

HTML vs XHTML

Normal Flow, Rendering Process

W3C Validation

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Day 12
Formative Assessment - 01

Day 13
Introduce to CSS

Syntax

Selector

Procedure of usage of Stylesheet

Color

CSS Units

Height & Width

Typography (Text Effects)

CSS Comment System

Day 14
Border (Rounded Corners, Border Images)
Padding

Margin

Box Model

Outline

Background

Hyperlinks

Custom Fonts

Custom Icon

Day 15
List

Table

Align

CSS Combinators
Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
CSS The !important Rule

Day 16
HTML5 Elements

Semantic & Non-Semantic Elements

Block & Inline Elements (Display)

Box Sizing

Day 17
Layout Design Using Semantic, Non-Semantic Elements

Day 18
Practice Layout Design Using Semantic, Non-Semantic Elements

Day 19
Introduce to Flexbox

Flex Container

Day 20
Flex Items

Flex Responsive

Day 21
Layout Design Using Semantic, Non-Semantic Elements & Flexbox

Day 22
Practice Layout Design Using Semantic, Non-Semantic Elements & Flexbox

Day 23
Formative Assessment - 2

Day 24
Position

Static Position

Relative Position

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Absolute Position

Z-index

Navigation Bar

DropDowns

Day 25
Pseudo-class

Pseudo-element

CSS Counters

Day 26
Opacity

Overflow

Image Sprites

Image Galley

Day 27
Forms

CSS Attribute Selectors

Shadows

Day 28
2D Transforms

3D Transforms

Transition with CSS

Animation with CSS Advance

Day 29
Tooltips

Buttons

Pagination
Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Image Reflection

Day 30
Max-width

Media Queries

Multiple Columns

Day 31
Layout Design Using HTML & CSS

Day 32
Introduce to SASS

SASS Installation & Configure

Variable

Nesting

@import

@mixing

@extend

SASS Functions

Day 33
Layout Design using SASS

Day 34
Formative Assessment - 3

Day 35
Introduce to JavaScript

Syntax

Statements

Procedure of usage of JavaScript

Comments

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Day 36
Variables

Data Type

Constant & Reserve Key Word

Operator

Day 37
Conditional Statement

Loop

Switch

Break

Day 38
Functions

Events

Arrays

Day 39
Objects

Form Validation with JS

Day 40
DOM/BOM

Day 41
Introduce to jQuery

JavaScript vs jQuery

jQuery HTML

jQuery CSS

jQuery DOM

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Day 42
Introduce to Bootstrap

Bootstrap Install & Configure

Break Points

Grid System

Containers

Columns

Typography

Image

Table

Figures

Day 43
Form

Accordion

Alerts

Close Button

Toasts

Badge

BreadCrumb

Buttons

Buttons Group

Day 44
Collapse

DropDwon

Navs & Tabs

Modal

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Tool Tips

Popovers

Card

Progress

Paginations

Day 45
Placeholder

ScrollSpy

OffCanvas

Spinner

Utilities

Migrations

Day 46
Navbar

Carousel

Install and Configure Plugin in Web Page

Introduce to PSD to HTML Conversion

Day 47
Final Projects – Day – 1

Day 48
Final Projects – Day – 2

Day 49
Final Projects – Day – 3

Day 50
Formative Assessment - 5

Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]
 BASIS-SEIP Trance 3
Web Design Course Outline
Day 51
Sector Specific (Common) Competencies – Day - 01

Day 52
Sector Specific (Common) Competencies – Day - 02

Day 53
Sector Specific (Common) Competencies – Day - 03

Day 54
Sector Specific (Common) Competencies – Day - 04

Day 55
Sector Specific (Common) Competencies – Day - 05

Day 56
Generic (Basic) Competencies – Day - 01

Day 57
Generic (Basic) Competencies – Day - 02

Day 58
Generic (Basic) Competencies – Day - 03

Day 59
Generic (Basic) Competencies – Day - 04

Day 60
Generic (Basic) Competencies – Day – 05

Thank You!
Instructor
Md Abdullah Al Noman – [email protected]
Shabiha Ahmed - [email protected]