Ultimate Web Designer Web Developer Course

Become a Full-Stack Web Designer in 2023 – Learn Everything from Web Design Fundamentals to Front-End Web Development
Ultimate Web Designer Web Developer Course
File Size :
19.65 GB
Total length :
35h 7m



Brad Hussey


Last update

Last updated 3/2022



Ultimate Web Designer Web Developer Course

What you’ll learn

Build 23+ custom web design & development projects by hand
Learn more than 18 professional disciplines
Plan, design and code your very own self-directed website project from scratch to launch!
Plan, design and code robust and fully custom, responsive websites and applications
Explore modern web design tools
Code at an expert level of proficiency with HTML & CSS
Code websites & applications with HTML5 & CSS3
Code basic games & animations with CSS3 and jQuery
Comfortably use Adobe Photoshop for photo manipulation, graphics creation & design
Use modern tools like Figma, Adobe XD and Photoshop to design and prototype for the web
Design a professional and modern business card in Adobe Photoshop
Learn UX and UI design for beginners
Learn visual design fundamentals for beginners
Learn how to wireframe and optimize UX for websites and web applications
Learn how to choose the correct font combinations for your projects
Create beautiful color schemes based on scientific color theory
Code a simple “Tip Calculator” in Javascript
Build a useful “To Do List” web application in jQuery UI
Learn how to easily set up web hosting & domain names
Learn how to program simple PHP applications
Design, build and manage custom database-driven websites with MySQL
Build a fully functional “Client Address Book” with PHP & MySQL
Set up a WordPress blog in 5-minutes
Manage your client’s WordPress websites
Learn how to get hired as a full-time web designer or web developer
Learn how to start a profitable and successful freelance business as a web designer or developer
Learn how to earn a full-time income from any of the disciplines you learn!
Start a side hustle as a web designer or developer
Learn how to land your first (or next) web design client

Ultimate Web Designer Web Developer Course


No prior web design or coding knowledge required!
Any operating system: Mac, PC, Linux
No expensive software required


Welcome to the Ultimate Web Designer & Web Developer Course! Are you ready to become a full-stack web designer in 2023? If so, you’re in the right place.Our comprehensive course is taught by Brad Hussey, a Udemy Partner and experienced web designer with more than 500,000 students worldwide and over 10 years of experience as a professional web designer. From the basics of web design to front-end development skills, this A to Z course covers everything you need to know to succeed in the world of web design and development. It focuses on what you need to learn and avoids unnecessary details. With over 80,000 happy students, this Udemy course is trusted by beginners and experts alike.In this course, you’ll learn how to use Adobe Photoshop, sketch professional wireframes, and code with HTML, CSS, JavaScript, and jQuery. You’ll also learn about responsive design using frameworks like Bootstrap and Tailwind CSS (coming soon). In addition to building your own project, you’ll work on over 23 designs, websites, and applications throughout the course.What are some of the projects you will build?In addition to working on your very own self-directed project that challenges you to use your new skills as you learn, you’ll be building over 23 custom projects throughout the course:In Photoshop:Design a custom web graphicDesign a custom business cardDesign a modern landing pageRe-design a blogIn HTML5 & CSS3:Multiple custom websites & web pagesCode the Google landing page”Orbiting planets” animation in CSS3A responsive “Startup Style” websiteIn Javascript & jQueryA working “Tip Calculator”An actual race car gameA “To-Do List” web applicationIn PHP & MySQLDynamic websitesAn impressive application that fixes clickbait headlinesWorking “login” and “logout” sequenceA profile page that pulls information from a databaseRobust “Client Address Book” application that manages your clients’ informationCustom WordPress pluginIn AngularJSReal Estate Listing Single-Page ApplicationIn WordPress PluginsCustom, real-world “survey” plugin…and much moreOnce you’ve mastered the front-end, we’ll delve into advanced skills like PHP, MySQL, WordPress, and custom WordPress plugin development. By the end of the course, you’ll have the skills and knowledge to start your own successful web design career, whether you want to work as a freelancer or at a design agency.But it doesn’t end there! Our course also includes a career section that provides valuable tips, resources, and real-world guidance to help you succeed in your new career. With step-by-step instruction from one of the most experienced and passionate web design educators around, you’ll be well on your way to becoming a successful web designer.So don’t wait any longer. Join our course today and start your journey to becoming a full-stack web designer in 2023!See you on the inside!


Section 1: Hey! Welcome to the course!

Lecture 1 Welcome!

Lecture 2 Course Change Log — New Updates to the Course!

Lecture 3 Resources for the Journey

Lecture 4 Price Calculator: Discover Your Hourly Rate & Your Income Potential

Section 2: Introduction to Visual Design for Web Designers & Web Developers

Lecture 5 Elements & Principles of Visual Design on the Web

Lecture 6 The “C.R.A.P.” Principles

Lecture 7 Typography Guide for Web Designers

Lecture 8 The Basics of Colour Theory

Lecture 9 Designing with Grids on the Web

Lecture 10 Design Systems Explained: The 10 Minute Guide for New Web Designers

Section 3: Designing Websites, Graphics & Interfaces with Figma

Lecture 11 Figma vs. Photoshop for Web Design

Lecture 12 How to Quickly Get Started with Figma for Web Design

Lecture 13 Figma Fundamentals: Learn the UI, Groups, Components & more

Lecture 14 Figma Project: Create a Design System in Figma

Lecture 15 Figma Project – Design System Walkthrough

Lecture 16 Figma Project: Create a LoFi Wireframe in Figma

Section 4: Introduction to Adobe Photoshop

Lecture 17 Section Intro: The 80/20 Rule, Photoshop Basics, and More

Lecture 18 Creating a New Photoshop Document

Lecture 19 Photoshop Environment: The Toolbar – Part 1

Lecture 20 Photoshop Environment: The Toolbar – Part 2

Lecture 21 Photoshop Environment: Palettes

Lecture 22 Photoshop Environment: The Menu

Lecture 23 Photo Enhancement & Manipulation

Lecture 24 Photoshop Project #1: Create a New Graphic with Multiple Layers + Tutorial

Lecture 25 Photoshop Project #2: Design a Business Card + Tutorial

Lecture 26 Section Outro: Wrap Up, Further Learning & What’s Next

Section 5: Introduction to Web Design (and more Photoshop)

Lecture 27 Section Intro: Web Design Basics, Wireframing, Photoshop

Lecture 28 Web Design Terminology: The Jargon the Pros Use

Lecture 29 The Four Phases of a Web Design Project + Cost Estimates

Lecture 30 What is User Experience (UX) Design?

Lecture 31 The Anatomy of a Website Design

Lecture 32 The 960 Grid System + Free Photoshop Downloads

Lecture 33 Web Design Project #1: Design a Minimal Landing Page + Tutorial

Lecture 34 Web Design Project #2: Re-Design a Blog Landing Page

Lecture 35 Web Design Project #2: Tutorial

Lecture 36 Section Outro: Wrap Up, Further Learning & What’s Next

Section 6: Advanced Web Design Challenge

Lecture 37 Challenge Intro: How the Challenge Works

Lecture 38 Discovery Phase: Create a Sitemap

Lecture 39 Discovery Phase II: Sketch & Wireframe Your Design

Lecture 40 Creative Phase: Design Your Website in Photoshop

Lecture 41 Sharing, Collaborating & Getting Feedback on Your Design

Lecture 42 Challenge Wrap Up & What’s Next

Section 7: Introduction to HTML

Lecture 43 Section Intro: HTML Fundamentals, First Webpage, Course Files

Lecture 44 The Basics of HTML: Tags, Attributes, Elements

Lecture 45 Basic File & Folder Structure of a Website

Lecture 46 Your Must Have Tool: A Good Code Editor

Lecture 47 Hello World: Create Your Very First Web Page!

Lecture 48 Section Outro: Wrap Up, Further Learning & What’s Next

Section 8: Intermediate HTML

Lecture 49 Section Intro: HTML Tags, Code a Real Web Page

Lecture 50 Basic Structure of an HTML Document

Lecture 51 Heading & Paragraph Tags

Lecture 52 Using Emphasis & Strong Emphasis

Lecture 53 Hyperlinks

Lecture 54 Lists

Lecture 55 Images

Lecture 56 Tables

Lecture 57 Forms

Lecture 58 HTML Entities & “Special Characters”

Lecture 59 HTML Project: Code a Basic Web Page + Tutorial

Lecture 60 Section Outro: Wrap Up, Further Learning & What’s Next

Section 9: Advanced HTML & HTML5

Lecture 61 Section Intro: Advanced HTML Techniques, HTML5

Lecture 62 IDs & Classes

Lecture 63 Span & Div Tags

Lecture 64 Intro to HTML5 Tags: Header, Footer, Nav, Section, Article, Aside & Time

Lecture 65 HTML5 Project: Build a Basic HTML5 Web Page + Tutorial

Lecture 66 Section Outro: Wrap Up, Further Learning & What’s Next

Section 10: Expert HTML & HTML5

Lecture 67 Section Intro: Expert HTML5 techniques

Lecture 68 New HTML5 Inputs

Lecture 69 Making Internet Explorer Compatible with HTML5

Lecture 70 HTML5 Data Attribute

Lecture 71 Section Outro: Wrap Up, Further Learning & What’s Next

Section 11: Introduction to CSS

Lecture 72 Section Intro: Essentials of CSS + Download Course Files

Lecture 73 What is CSS? All the basics you need to know!

Lecture 74 Inheritance of Styles

Lecture 75 Measurements & The Box Model

Lecture 76 Inline CSS

Lecture 77 Internal CSS

Lecture 78 External CSS

Lecture 79 ID & Class Selectors

Lecture 80 Descendant Selectors

Lecture 81 Grouping Selectors

Lecture 82 Specificity

Lecture 83 CSS Project: Style an HTML Web Page + Tutorial

Lecture 84 Section Outro: Wrap Up, Further Learning & What’s Next

Section 12: Intermediate CSS

Lecture 85 Section Intro

Lecture 86 Colors

Lecture 87 Text Styling & Formatting

Lecture 88 Borders

Lecture 89 Background Images

Lecture 90 Styling Links

Lecture 91 Section Outro: Wrap Up, Further Learning & What’s Next

Section 13: Advanced CSS

Lecture 92 Section Intro

Lecture 93 Styling Web Forms

Lecture 94 Block, Inline and Inline-Block Elements

Lecture 95 Understanding Float & Clear (once and for all!)

Lecture 96 Relative, Absolute & Fixed Position

Lecture 97 CSS Project: Build the Google Home Page + Tutorial (Part I)

Lecture 98 CSS Project: Build the Google Home Page (Part II)

Lecture 99 Section Outro: Wrap Up, Further Learning & What’s Next

Section 14: CSS Flexbox

Lecture 100 A Guide to CSS Flexbox – Parent Properties (a.k.a. Flex Container Properties)

Lecture 101 Flex Items: Understanding the Mysterious “Flex” Property

Lecture 102 Flex Items: Align-Self Property

Section 15: Expert CSS & CSS3

Lecture 103 Section Intro: What is CSS3? + Course Files Download

Lecture 104 CSS3 Box Sizing & Round Corners

Lecture 105 CSS3 Colours & Gradients

Lecture 106 CSS3 Shadows

Lecture 107 CSS3 Columns

Lecture 108 CSS3 Animations & Transitions

Lecture 109 CSS3 Project #1: Create Animated Buttons + Tutorial

Lecture 110 CSS3 Project #2: Code an Orbiting Planet Animation + Tutorial (Part I)

Lecture 111 CSS3 Project #2: Code an Orbiting Planet Animation (Part II)

Lecture 112 Section Outro: Wrap Up, Further Learning & What’s Next

Section 16: Advanced HTML & CSS Challenge

Lecture 113 Your Challenge: Everything You Need to Know + Section Wrap Up

Lecture 114 Bonus Tutorial: How to Slice a Photoshop Design & Convert it to HTML & CSS

Lecture 115 Bonus Tutorial P2: How to Slice a Photoshop Design & Convert it to HTML & CSS

Section 17: Introduction to Javascript

Lecture 116 Section Intro: What is Javascript, The 80/20 Rule + Course Files Download

Lecture 117 Internal & External Javascript

Lecture 118 Basic Syntax of Javascript (and many other programming languages)

Lecture 119 Javascript Output

Lecture 120 Javascript Variables

Lecture 121 Javascript Arrays

Lecture 122 Javascript Functions

Lecture 123 Javascript If / Else Statements

Lecture 124 Javascript Project: Program a Tip Calculator + Tutorial

Lecture 125 Javascript Project: Program a Tip Calculator, Part II

Lecture 126 Section Outro: Wrap Up, Further Learning & What’s Next

Section 18: Introduction to jQuery

Lecture 127 Section Intro: What is jQuery? + Course Files

Lecture 128 Download & Install jQuery

Lecture 129 The Simple Syntax of jQuery

Lecture 130 jQuery Selectors

Lecture 131 jQuery Event Methods

Lecture 132 Section Outro: Wrap Up & What’s Next

Section 19: Intermediate jQuery

Lecture 133 Section Intro: jQuery Deep Dive!

Lecture 134 jQuery Chaining

Lecture 135 Hiding, Showing & Fading Content with jQuery

Lecture 136 The jQuery Animate Method

Lecture 137 Modifying CSS with jQuery

Lecture 138 jQuery Project: Mini Race Car Game + Tutorial

Lecture 139 Section Outro: Wrap Up, Further Learning & What’s Next

Section 20: jQuery UI (Advanced jQuery)

Lecture 140 Section Intro: What is jQuery UI? + Course Files

Lecture 141 jQuery UI: Draggable

Lecture 142 jQuery UI: Droppable

Lecture 143 jQuery UI: Sortable

Lecture 144 jQuery UI: Accordion

Lecture 145 jQuery UI: Datepicker

Lecture 146 jQuery Project: To Do List Web Application + Tutorial

Lecture 147 Section Outro: Wrap Up, Further Learning & What’s Next

Section 21: Responsive Design & Development using Bootstrap

Lecture 148 Section Intro: What is Responsive Design & Bootstrap? + Course Files

Lecture 149 Getting Started with Bootstrap

Lecture 150 Quickly Prototype with the Free Examples

Lecture 151 Understanding the Bootstrap Grid System

Lecture 152 Responsive (and sexy) Forms

Lecture 153 Responsive Tables, Buttons and Images

Lecture 154 Helper Classes & Responsive Utilities

Lecture 155 Using Glyphicons (Font Icons)

Lecture 156 Bootstrap Navbar

Lecture 157 Bootstrap Modal Window

Lecture 158 Bootstrap ScrollSpy

Lecture 159 Togglable Tabs

Lecture 160 Sliding Carousel

Lecture 161 Bootstrap Project: Code a “Hipster” Startup Website + Tutorial

Lecture 162 Bootstrap Project: Startup Website, Part 2

Lecture 163 Section Outro: Wrap Up, Further Learning & What’s Next

Section 22: Advanced Bootstrap Challenge

Lecture 164 Your Challenge: Convert Your Custom Website Into a Responsive Bootstrap Site

Section 23: Web Hosting & Domains

Lecture 165 Section Intro: What is Web Hosting?

Lecture 166 Purchasing a Bundled Domain Name & Hosting Package

Lecture 167 The Hosting Control Panel (a.k.a. cPanel)

Lecture 168 Understanding FTP & How to Upload a Website to Your Live Server

Lecture 169 Section Outro: Wrap Up, What’s Next + Bonus (Free) Web Hosting

Section 24: Introduction to PHP

Lecture 170 Section Intro: What is PHP & What Does It Do? + Course Files

Lecture 171 Basic PHP Syntax

Lecture 172 PHP Variables & Constants

Lecture 173 PHP Arrays (Associative & Multi-Dimensional)

Lecture 174 PHP Project: Program an App to fix “Click Bait Headlines” + Tutorial

Lecture 175 PHP Project: Click Bait Headlines, Part 2

Lecture 176 Section Outro: Wrap Up & What’s Next

Section 25: Intermediate PHP

Lecture 177 Section Intro: Let’s dive deeper into PHP

Lecture 178 If, Else and Elseif Statements

Lecture 179 PHP Loops: While, For, Foreach & Do While

Lecture 180 PHP Functions & Arguments

Lecture 181 $_GET and $_POST

Lecture 182 PHP Project: Convert a Static Website into a Dynamic PHP Site + Tutorial

Lecture 183 Section Outro: Wrap Up, Further Learning & What’s Next +Bonus (Free) PHP Course!

Section 26: Introduction to MySQL Databases

Lecture 184 Section Intro: What is MySQL? + Course Files

Lecture 185 Creating Your First MySQL Database + phpMyAdmin Overview

Lecture 186 Establishing a MySQL Connection with PHP

Lecture 187 Selecting Data from a Database and Displaying it on Your Web Page

Lecture 188 Insert Data into Your Database from a Web Page

Lecture 189 Password Hashing (for securely storing passwords)

Lecture 190 Using PHP Sessions to Store Global Variables

Lecture 191 MySQL Project #1: Code a Login Form, Profile Page & Logout + Tutorial

Lecture 192 MySQL Project #2.1: Client Address Book – Planning our Application

Lecture 193 MySQL Project #2.2: Client Address Book – Build the Login Sequence

Lecture 194 MySQL Project #2.3: Client Address Book – Logout Sequence & Display Clients

Lecture 195 MySQL Project #2.4: Client Address Book – Adding Clients

Lecture 196 MySQL Project #2.5: Client Address Book – Editing Clients

Lecture 197 MySQL Project #2.6: Client Address Book – Deleting Clients

Lecture 198 Section Outro: Wrap Up, Further Learning & What’s Next

Section 27: Advanced PHP & MySQL Challenge

Lecture 199 Your Challenge: Convert Your Custom Static Website into a Dynamic Website

Section 28: WordPress Websites

Lecture 200 Section Intro: What is WordPress?

Lecture 201 How to Start a WordPress Blog in 5-Minutes

Lecture 202 The Dashboard

Lecture 203 Using Free and Premium Plugins to Achieve Any Feature You Desire

Lecture 204 Using Free and Premium Themes to Quickly Make Gorgeous Websites

Lecture 205 Theme Showcase: “X” Theme – The Ultimate All-in-one WordPress DIY Theme

Lecture 206 The Importance of 24/7 WordPress Security

Lecture 207 Quickly Start an eCommerce Online Store

Lecture 208 Section Outro: Wrap Up, Further Learning, What’s Next + Course Discount

Section 29: Career Development: How to Start Your Web Design / Development Career

Lecture 209 Section Intro: The Career Options Available to You as a Web Designer & Developer

Lecture 210 The Importance of “Cultivating” Your Career

Lecture 211 What Does Success Mean To You?

Lecture 212 Freelancing: Should You Work For Free?

Lecture 213 Freelancing: Should You Quit Your Job?

Lecture 214 Free eBook Download: Cultivate a Successful Freelance Career

Lecture 215 Where To Find Web Design & Development Jobs: Part-time, Full-time & Freelance

Lecture 216 4 Valuable Tips for Crafting the Perfect Résumé

Lecture 217 The Grande Finale: Where Do You Go From Here?

Section 30: Legacy Content: AngularJS Quick Start: Build a Single-Page Web Application

Lecture 218 Welcome Ryan, our AngularJS expert & Guest Instructor

Lecture 219 An Introduction to AngularJS + The App You’ll Build from Scratch

Lecture 220 Installation & Set up

Lecture 221 Controllers and Views

Lecture 222 Switching to Services

Lecture 223 $HTTP Service

Lecture 224 Creating the User Interface

Lecture 225 Custom Filters

Lecture 226 Creating New Data

Lecture 227 Editing and Deleting Data

Lecture 228 Wrap Up & Further Learning

Section 31: Legacy Content: WordPress Plugin Quick Start

Lecture 229 Bonus Section Intro: Introducing Joel Funk (our Plugin Ninja)!

Lecture 230 Welcome to the WordPress Plugin Quick Start + Course Files

Lecture 231 Course Requirements

Lecture 232 Concepts & Definitions: Introduction

Lecture 233 Concepts & Definitions: What are plugins?

Lecture 234 Concepts & Definitions: What are hooks?

Lecture 235 Concepts & Definitions: Common actions & filters

Lecture 236 Concepts & Definitions: What are post types?

Lecture 237 Concepts & Definitions: Planning plugins

Lecture 238 Groundwork: Introduction

Lecture 239 Groundwork: Plugin header data

Lecture 240 Groundwork: Creating admin pages

Lecture 241 Groundwork: Creating admin menus

Lecture 242 Groundwork: Creating custom post types

Lecture 243 Groundwork: Creating custom database tables

Lecture 244 Core features: Introduction

Lecture 245 Core features: Creating custom shortcodes

Lecture 246 Core features: Enhancing shortcodes

Lecture 247 Core features: Including scripts

Lecture 248 Core features: Capturing form submissions

Lecture 249 Core features: Handling Ajax responses

Lecture 250 Core features: Creating custom admin columns

Lecture 251 Core features: Completing our stats page

Lecture 252 Core features: Completing our welcome page

Lecture 253 What next? Are you ready to go Ultimate!?

Section 32: Legacy Content from The First Version of the Course

Lecture 254 [Legacy] What You Get in This Course: Major Course Discounts + eBook

Lecture 255 [Legacy] How to Get a Free Trial of Adobe Photoshop & More

Lecture 256 [Legacy] Welcome Section – Wrap Up: What You’ve Learned & What’s Next

Lecture 257 [Legacy] Section Intro: What You’re Going to Learn

Lecture 258 [Legacy] The Basic Elements & Principles of Visual Design

Lecture 259 [Legacy] Typography Basics

Lecture 260 [Legacy] The Science of Colour (or Color)

Lecture 261 [Legacy] Designing with Grids

Lecture 262 [Legacy] Section Outro: Wrap Up, Further Learning & What’s Next

Section 33: Bonus Section

Lecture 263 Bonus Lesson

Web developers & Programmers looking to dramatically improve their design skills,Graphic & Web Designers who want to improve their web development & coding skills,Total beginners who want to learn how to plan, design and code amazing websites & applications,People who want to make a comfortable living online as a web designer or developer,Professionals who desperately want to leave the 9-to-5 for a fruitful new web design career,Freelancers who want to deliver higher value to their web design clients,Designers & developers who want to know how to start a successful freelance business,Anyone who likes a bit of fun 🙂

Course Information:

Udemy | English | 35h 7m | 19.65 GB
Created by: Brad Hussey

You Can See More Courses in the Developer >> Greetings from CourseDown.com

New Courses

Scroll to Top