Course Information
Course Overview
Learn to Build Websites with Photoshop, HTML5, CSS3, JavaScript, Bootstrap 5, Dreamweaver, WordPress & WooCommerce
(February 2026 - Update) Added: AI as Your Coding Assistant.
Learn how to use AI to enhance your web design workflow — improve layouts, refine styling, and troubleshoot issues — while progressing from beginner to advanced level.
--
Welcome to Web Designing Course: Beginner to Advanced Level, an all-in-one web design course designed for complete beginners who want to learn web design from the ground up.
If you’ve ever wanted to build websites from scratch but didn’t know where to start, you’re in the right place! This friendly, comprehensive course takes you from the basics to advanced techniques, empowering you to create modern, responsive websites and even launch your own online store by the end.
Start with the fundamentals:
We begin with the very basics of design and graphics. You’ll learn how to use Adobe Photoshop for web design – from simple image editing and manipulation to creating custom graphics. No prior experience is needed; we’ll walk you through editing images, optimizing graphics, and designing visual elements to make your websites look professional and engaging.
Build a strong foundation in HTML5 & CSS3:
Next, we dive into the core of web development – HTML5 and CSS3. You will learn how to hand-code web pages from scratch, structuring content with HTML and styling it with CSS. We cover everything an HTML/CSS beginner needs, from basic tags and layout fundamentals to advanced styling techniques like Flexbox and CSS Grid.
Along the way, you’ll master responsive web design principles and techniques, ensuring that your websites look great and function perfectly on all devices, from large desktop monitors to tablets and smartphones.
Modern JavaScript techniques (2025 Updated):
Once you have the foundation, we introduce JavaScript to bring your websites to life. You’ll learn modern JavaScript fundamentals and how to manipulate the DOM (Document Object Model) to create interactive features. Don’t worry if that sounds complex – we start with the absolute basics (like printing “Hello World”) and gradually work up to dynamic effects and practical JavaScript projects. By understanding JavaScript, you’ll be able to add slideshows, form validations, interactive menus and more, making your sites engaging and user-friendly.
Hands-on projects with Bootstrap 5:
With the basics in place, you’ll accelerate your design workflow by learning Bootstrap 5, the latest version of the popular CSS framework. Bootstrap will help you quickly create beautiful, mobile-first pages with pre-built responsive components. In this course, you’ll build three real-world projects using Bootstrap 5:
a professional multi-page website for a business
an Employee Management System dashboard (admin interface)
a sleek blog user interface
These projects will solidify your understanding of responsive layouts and modern UI design, and you’ll be proud to add them to your portfolio. (We’ve updated the Bootstrap section to the newest v5.3, so you’ll be learning with the latest tools!)
Adobe Dreamweaver & WordPress - Web design without coding:
This course doesn’t stop at coding. You’ll also explore ways to build websites without writing code. First, we introduce Adobe Dreamweaver CC, a powerful web design tool that lets you create and publish websites through a visual interface. You’ll learn how to use Dreamweaver’s features (and even its built-in frameworks) to layout pages and build a complete site, all without hand-coding.
Then, we move on to WordPress, the world’s most popular content management system. In the WordPress module, you’ll learn to set up and customize a WordPress blog from scratch.
We cover core WordPress features like posts, pages, categories, tags, and menus. You’ll work with the modern WordPress block editor and pre-designed patterns to easily arrange content and create beautiful page layouts.
You’ll also discover how to choose and customize themes to define your site’s look, and even add an essential contact form to collect visitor messages.
By the end of this section, you’ll be comfortable building dynamic websites and blogs using WordPress – all without needing to write any code.
WooCommerce (E-commerce made easy with WooCommerce):
Finally, we’ll guide you through creating a complete online store using WooCommerce, the powerful e-commerce plugin for WordPress. You’ll learn step by step how to transform a basic website into a fully functional WooCommerce shop.
This includes adding products with images and descriptions, organizing products into categories, setting up a shopping cart and checkout process, and managing orders and customer accounts.
We’ll also show you how to configure a payment gateway so you can securely accept payments on your site. By the end of this capstone project, you’ll know how to build an e-commerce website from scratch – a hugely valuable skill in today’s digital marketplace.
Why take this course?
This course is designed to be beginner-friendly, yet it grows with you as your skills develop. Each section of the course builds on the previous one, so by the time you finish, you’ll have a well-rounded skill set in modern web design. You will have created multiple projects (from simple web pages to a complete store), giving you a portfolio to showcase your new abilities.
Whether you want to start a career in web design, create a website for yourself or your business, or just learn web design as a hobby, this course provides the tools and support to succeed. We focus on practical, hands-on learning – you’ll not only watch and follow along, but actually build websites step by step with guidance at each stage.
Join us on this exciting journey to become a confident web designer. By enrolling in this course, you’re taking the first step toward creating beautiful, responsive websites and dynamic online experiences. Get ready to code, design, and launch your own websites – we can’t wait to see what you will build!
Course Content
- 70 section(s)
- 647 lecture(s)
- Section 1 Adobe Photoshop - Graphic Fundamentals
- Section 2 Adobe Photoshop - Basic Tools
- Section 3 Adobe Photoshop - Creating a Scene
- Section 4 Adobe Photoshop - Working with Images
- Section 5 Adobe Photoshop - Retouching
- Section 6 Adobe Photoshop - Typography Basics
- Section 7 Adobe Photoshop - Filters
- Section 8 HTML5 - Introduction to HTML
- Section 9 HTML5 - Text Formatting in HTML
- Section 10 HTML5 - HTML Essentials
- Section 11 HTML5 - Images in HTML
- Section 12 HTML5 - Multimedia in HTML
- Section 13 HTML5 - Content in HTML
- Section 14 HTML5 - Form Elements in HTML
- Section 15 HTML5 - Tables in HTML
- Section 16 CSS3 - Getting started with CSS
- Section 17 CSS3 - CSS Essentials
- Section 18 CSS3 - Understanding Box Model in CSS
- Section 19 CSS3 - Typography in CSS
- Section 20 CSS3 - Layouts in CSS
- Section 21 CSS3 - Flexbox and Grid in CSS
- Section 22 CSS3 - Advanced CSS Selections
- Section 23 CSS3 - Building The Website
- Section 24 Responsive Web Design (RWD)
- Section 25 Ai as your Coding Assistant
- Section 26 Modern JavaScript - Getting Started with JavaScript
- Section 27 Modern JavaScript - Variables, Scopes, and More
- Section 28 Modern JavaScript - Working with Arrays
- Section 29 Modern JavaScript - Working with Objects
- Section 30 Modern JavaScript - Functions and Methods
- Section 31 Modern JavaScript - String Outputs
- Section 32 Modern JavaScript - DOM Document Object Model and Events
- Section 33 Modern JavaScript - Projects
- Section 34 AI as Your JavaScript Coding Assistant
- Section 35 Bootstrap 5 - Getting Started
- Section 36 Bootstrap 5 - Layouts
- Section 37 Bootstrap 5 - Contents
- Section 38 Bootstrap 5 - Forms
- Section 39 Bootstrap 5 - Components
- Section 40 Bootstrap 5 - Helpers
- Section 41 Bootstrap 5 - Utilities
- Section 42 Project - EMS App (Employee Management System App)
- Section 43 Project - Blog App with Bootstrap 5
- Section 44 Project - Real-World Education Project
- Section 45 Adobe Dreamweaver CC - Getting Started
- Section 46 Adobe Dreamweaver CC - HTML Components
- Section 47 Adobe Dreamweaver CC - Forms
- Section 48 Adobe Dreamweaver CC - Basic Site
- Section 49 Adobe Dreamweaver CC - Live Site Designer
- Section 50 Adobe Dreamweaver CC - jQuery Mobile
- Section 51 Adobe Dreamweaver CC - jQuery UI
- Section 52 Adobe Dreamweaver Project - EMS Web App
- Section 53 Adobe Dreamweaver Project -Blog App
- Section 54 WordPress - Introduction to WordPress
- Section 55 WordPress - Getting Started
- Section 56 WordPress - The Admin Dashboard
- Section 57 WordPress - Settings in WordPress
- Section 58 WordPress - Site Customization Settings
- Section 59 WordPress - Header and Footer Customization
- Section 60 WordPress - Pages in WordPress
- Section 61 WordPress - Posts in WordPress
- Section 62 WordPress - Blocks in WordPress
- Section 63 WordPress - Media Library in WordPress
- Section 64 WordPress - Plugins in WordPress
- Section 65 WordPress - WordPress Security
- Section 66 WooCommerce - Getting Started
- Section 67 WooCommerce - Creating & Managing products
- Section 68 WooCommerce - Additional Setup
- Section 69 WooCommerce - Settings
- Section 70 WooCommerce - Testing Ordered, Reports & Coupons
What You’ll Learn
- Build fully responsive websites from scratch using HTML5 and CSS3., Design dynamic websites without writing code using intuitive tools and CMS platforms., Create e-commerce websites (online stores) without coding., Create and edit graphics for web pages using Adobe Photoshop., Hand-code websites from scratch with HTML5 & CSS3, mastering the building blocks of the web., Add interactive features to your sites with modern JavaScript., Develop responsive layouts quickly using the Bootstrap 5 framework (through 3 hands-on projects)., Create websites visually without coding using Adobe Dreamweaver CC., Build dynamic websites and blogs with WordPress (no coding needed)., Set up a fully functional online store using WooCommerce on WordPress.
Skills covered in this course
Reviews
-
PProject Team
content needs to be updated to 2025 / 2026 software
-
TTam D Nguyen
good
-
VVserve Ebusiness Solutions
Thank you very much! The skills from this course will be really insightful, and it is informative
-
IIsmat Daniels
Very in-depth and great explanations. I am very happy with my experience with this course. It taught me alot.