Ultimate Web Designer & Web Developer Course

Become a Full-Stack Web Designer in 2022 - Learn Everything from Web Design Fundamentals to Front-End Web Development

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

Requirements

No prior web design or coding knowledge required!

Any operating system: Mac, PC, Linux

No expensive software required

Description
Brad Hussey is updating the entire course to be even more relevant to the modern web designer and front-end web developer as we enter into 2022. Join now to get access!This course by Brad Hussey is the go-to, most comprehensive, A to Z web design, web development and career-building course that will kickstart your progress by focusing on what you need to learn, and avoiding the unnecessary details.- - -Do you want to learn web design and front-end development? Do you need a career change but don't know where to start?Are you a total beginner looking for an all-in-one Web Design, Web Development and Career Building course that takes you step-by-step through all of the necessary skills you need to know to start working professionally as a web designer or developer?Are you a programmer or web developer looking to improve your design skills, so your designer colleagues can stop making fun of your bad designs?Or maybe you're a graphic designer looking to learn how to code, so your programmer colleagues can stop laughing at your sad coding attempts?Have you wasted time & hard earned money watching boring, drawn-out and overwhelming web design and web development courses that promise to make you a complete master of every possible discipline known to man?Look no further! There's no better place to learn web design and become a skilled front-end developer than with The Ultimate Web Designer & Front-End Developer Course by Brad Hussey.This course will teach you everything you need to know (and none of what you don't need to know).With more than 80,000 happy students, this Udemy course is trusted by beginners and experts alike. Brad Hussey – an experienced web designer and front-end developer – will teach you everything from web design basics to creating beautiful user interfaces with HTML and CSS. You'll also learn how to develop dynamic websites with JavaScript, PHP, MySQL and more. And that's just the beginning!You'll also learn about creating responsive websites and user interfaces that look great on any device by using popular frameworks like Bootstrap and Tailwind CSS.By the end of this course, you'll have the skills and knowledge you need to start your own successful web design career, whether you want to land a job as a web designer or start taking on clients as a freelance web designer.So if you're ready to become a web designer in 2022?Join the course today!- - -What can you expect from this course?You will go from knowing nothing to creating over 23 impressive designs, websites, and applications — all with step-by-step instruction from one of the most entertaining, engaging and passionate web design educators on the web today!We'll start by learning Visual & Web Design, how to use Adobe Photoshop, and how to sketch professional wireframes. We'll then learn to code with HTML5, CSS3, Javascript and jQuery. At this point, you'll be able to code custom websites, animations and web applications by yourself.Once we're cool with the front-end languages, we'll then melt our brain-bits with highly advanced skills like Responsive Websites, PHP, MySQL, WordPress and custom WordPress plugin development. You'll then have the ability to build responsive, dynamic websites and blogs, basic eCommerce sites and online stores, and have a professional understanding of all aspects of web design & development.After you've learned everything from Design to Development, you'll be taken through a hands-on career section fully-loaded with valuable tips, resources, and real-world guidance to help you start your career — whether you want to work-from-home as a freelancer or secure a full-time studio gig at a design agency.- - -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 more- - -Why trust me? What makes me any better than the thousands of coding instructors out there?My name is Brad Hussey, and I've been working professionally as a web designer since 2009, and have since helped more than 500,000 students get better at the Art, Business and Craft of Web Design through my courses, tutorials, and my coaching.What makes me different than all the other coding instructors out there is that I know how to communicate complex & boring concepts without putting you to sleep! While you're staring at a screen with hundreds of lines of code, I like to keep things light, crack jokes and keep you entertained. My approach is simple, hands-on, and relaxed.- - -So stop wasting your time and money on courses & tutorials that don't deliver - and let's launch your career to new heights!Join me on this journey, and I promise I won't let you down.Set yourself up for success, and I'll see you on the inside.You won't regret it :)
Overview

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 :)