Advance Web design and Development

Advance Web design and Development

A web designer technically design or redesign a website in cooperation with the developer to make a lucrative visibility and make it visitors friendly by creative aspect.

course at a glance

  • Date : 19 Oct - 13 Jan 2018
  • No. of Classes/ Sessions : 36
  • Total Hours : 72
  • Last Date of Registration : 19 Oct 2017
  • Class Schedule :
    • Tuesday - 4.00PM - 6.00PM
    • Thursday - 4.00PM - 6.00PM
  • venue : UYS LAB. 31 Mohakhali Commercial Area ,Colombiya Super market,Floor #4th , Wirless Gate, Bonani ,Dhaka 1213.

Price: TK. 20,000

This training is jointly organized by BITM & UYS Lab

Training will be held in UYS Lab.

An interactive, smooth and easy to access website can hold audience longer than a complicated code stuffed non creative website. For every website good numbers of customer traffic is the main object and each minute visitors stay on the website counts, it means the longer visitors stay the more it causes good rank for the website. Basically the main reason behind the huge demand for a web designer over a web developer, ignoring the fact that the first one can be a non technical person, is to keep the front end design eye catchy and easily accessible.

Course outline :

Class 01:

  1. Introduction to Web Design
  2. Static Vs Dynamic Website.
  3. What is wireframing  ?
  4. Handsketch & Wireframing.
  5. Wireframing tools.
  6. Story Board ( How to think )
  7. Course module overview.

Project:  Think about a website. Make a skeleton by using wireframing tools.

Class 02:

  1. Website Designing tools
  2. IDE vs Code editor.
  3. Environment Setup.
  4. HTML & Browsers.
  5. File extension.
  6. Creating a file.
  7. Arranging files and making a startup package.


Project:  Creating startup package and upload it to google drive.


Class 03:

  1. HTML Syntax.
  2. Head & Body Section.
  3. Basic tags.
  4. HTML Elements & Attributes.
  5. Commenting in HTML.
  6. List items in HTML.

Project:  Creating a web page with proper HTML Syntax.

Class 04:

  1. What is table?
  2. Table Head and Body Contents.
  3. Attributes of table.
  4. Table row and column.
  5. Nested table.
  6. Layout with table.

Project:  Creating a webpage layout with table.

Class 05:

  1. Introduction to form.
  2. Form elements.
  3. Input types and attributes.
  4. Form controls.
  5. GET vs POST method.
  6. Form arrangement and decoration.

Project:  Creating a register form that requires every form elements.


Class 06:

  1. Different types of image in HTML.
  2. Iframe in HTML.
  3. Audio and Video controlling.
  4. Embedded video from youtube.
  5. Gif amination embedded.
  6. HTML Review.

Project:  Creating a webpage where image, audio, video and gif animation will be embedded.

Class 07:

  1. Introduction to CSS (Cascading style sheet).
  2. Syntax of CSS.
  3. How to link CSS.Important property of CSS.
    1. Inline
    2. Internal
    3. External
  5. Layout concept in CSS.

Project:  Creating Link a css file and implement important property.


Class 08:

  1. Introduction to Selectors.
  2. Id Vs Class.
  3. Attribute selectors.
  4. Child and Adjacent Selectors.
  5. Selectors Grouping.

Project:  Creating an external css file and change HTML view styling with selectors.

Class 09:

  1. List styling.
  2. Creating menu in css.
  3. Styling text.
  4. Working with web fonts and icons.
  5. Styling fonts and icons.
  6. Input box styling.

Project:  Creating a menu with icons. Styling text and fonts.

Class 10:

  1. Introduction to CSS layout.
  2. Floats.
  3. Positioning.
  4. Practical positional example.
  5. Flexbox.
  6. Grids.

Project:  Creating a website with actual positioning.


Class 11:

  1. Introduction to lovable css.
  2. Border and rounded corners.
  3. Working with background.
  4. Gradient & shadow.
  5. Transition & transformation.

Project:  Creating a website with image/color backgrounds and transition, transformation effects.


Class 12:

  1. Overview of Responsive Web Design (RWD)
  2. Working with viewport.
  3. Practicing Media Queries.
  4. RWD Frameworks.

Project:  Enable a website for mobile responsive view.




Class 13:

  1. Introduction to LASS/SASS.
  2. Variable
  3. Mixins.
  4. Nesting & Scope.
  5. Operation.
  6. Function.
  7. Extend.

Project:  Implementing css property with LASS/SASS.


Class 14:

  1. Introduction to Bootstrap Framework. (BS)
  2. How to install bootstrap.
  3. Great grid system.
  4. Understanding device screen size.
  5. BS table.
  6. BS form.
  7. BS button.
  8. BS Image responsive.

Project:  Installing bootstrap and create a grid for web layout.

Class 15:

  1. BS Modal.
  2. BS Scrollspy.
  3. BS Tab & tooltip.
  4. BS Carousel.
  5. BS Accordion.

Project:  Complete a webpage with Bootstrap.


Class 16: Mid Term Exam.

Class 17:

  1. What is Photoshop?
  2. Basic concept of Photoshop.
  3. How to use Photoshop tools?
  4. PSD fonts,color and layer concept.
  5.  Image slicing in Photoshop.
  6. PSD fonts
  7. PSD to HTML converting techniques.

Project:  Converting to HTML.

Class 18: Converting Portfolio PSD template to HTML.

Class 19: Converting Multipurpose Business PSD template to HTML.

Class 20:

  1. Introduction to Javascript (JS).
  2. What can't you do with JavaScript?
  3. JS basic syntax.
  4. Variable in JS.
  5. Operator, Data type and Functions in JS.
  6. Commenting in JS.

Project:  Playing with Javascript syntax.

Class 21:

  1. Array in JS.
  2. Concept of Objects.
  3. JS Conditions ( if,else )
  4. Switch in JS.
  5. Loop: for loop, while loop, do while loop.

Project:  Practicing JS with programming concept.

Class 22:

  1. DOM & BOM in JS.
  2. Method, documents, elements in DOM.
  3. DOM Event & Eventlistner.
  4. JS Window.
  5. History, Navigation in JS.

Project:  Working with advance JS.

Class 23:

  1. Date format in JS.
  2. Form validation techniques.

Project:  Completing form validation in Javascript.


Class 24:

  1. What is outsourcing?
  2. How to open an account in
  3. Cover letter writing.
  4. Finding jobs & facing interview.
  5. Proper communication with clients.
  6. Payment method.
  7. Question and answer session.

Project:  Creating an account in marketplace.

Class 25:

  1. JQuery Introduction.
  2. JQuery Selectors.
  3. JQuery and DOM.
  4. JQuery and Event.

Project:  Working with JQuery.


Class 26:

  1. Introduction to JQuery effects.
  2. Hide, Show, Fade, Slide in JQuery.
  3. Animation in JQuery.
  4. Slider in JQuery.
  5. Using Plugins in JQuery.

Project:  Implementing a slider in JQuery.


Class 27:

  1. What is domain and hosting?
  2. What is Server?
  3. Introduction to cpanel.
  4. Overview of webmail.
  5. How to host a website in server?
  6. Creating a database in server.
  7. Working in live server.

Project:  Host the website in live server. Creating and accessing webmail.

Class 28:

  1. What is server side scripting?
  2. Introduction to PHP.
  3. How to use WAMP/XAMP.
  4. PHP syntax.
  5. Defining variable and constant.
  6. Functions in PHP.

Project:  Installing WAMP/XAMP in localhost. Working with PHP syntax.


Class 29:

  1. Introduction to RDBMS
  2. Connection with MySql Database.
  3. Create a database in localhost.
  4. Making a login system in PHP.

Project:  Creating a database and making a login system.


Class 30:

  1. Converting static site to Dynamic with PHP.
  2. Use include function.
  3. Change all the contents from backend.

Project:  Converting a static site to Dynamic.


Class 31:

  1. What is CMS?
  2. Introduction to Wordpress.
  3. Creating database for WP.
  4. Installing WP.
  5. Overview ot WP elements.

Project:  Creating Database and Installing WP.


Class 32:

  1. Understanding the WordPress Dashboard.
  2. Pages, Tags, Menu, Media and Content Administration.
  3. Core WordPress Settings.
  4. Finding and Installing Plugins Quickly and Easily
  5. Recommended WordPress Plugins 

Project:  Create a menu in WP. Add a new menu in WP. Installing plugin in WP.


Class 33:

  1. Understanding the Structure of WordPress Themes 
  2. Finding Themes and Choosing the Right One 
  3. Installing and Configuring Themes 
  4. Editing and Customizing Themes 
  5. Using Theme Frameworks and Parent-Child Themes 
  6. Theme Best Practices
  7. Using page builder in WP.

Project:  Working with theme in wp.


Class 34: Hands on live Project in WP (Complete a website)

Class 35:

  1. Overview of WP.
  2. Final Exam.



Class 36:

  1. Introduction to fiverr.
  2. How to create a fiverr account?
  3. Gigs setting techniques.
  4. Buyer request.
  5. Working with Payment method.
  6. Certification & Closing ceremony.

Project:  Opening a fiverr account.


Module Advance Web design and Development 72 Hrs

Tentative Class Start

19th October, 2017

Available Seat

10 / 20

who can join

There are no special prerequisites to be trained up for this course. But attendees should be aware on basic computer skills.

Meet the Instructor