Course Highlights
  • 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
Curriculum

4 Topics
Welcome!
Course Change Log — New Updates to the Course!
Resources for the Journey
Price Calculator: Discover Your Hourly Rate & Your Income Potential

7 Topics
Elements & Principles of Visual Design on the Web
The "C.R.A.P." Principles
Typography Guide for Web Designers
The Basics of Colour Theory
Designing with Grids on the Web
Design Systems Explained: The 10 Minute Guide for New Web Designers
Visual Design Quiz

6 Topics
Figma vs. Photoshop for Web Design
How to Quickly Get Started with Figma for Web Design
Figma Fundamentals: Learn the UI Groups Components & more
Figma Project: Create a Design System in Figma
Figma Project - Design System Walkthrough
Figma Project: Create a LoFi Wireframe in Figma

11 Topics
Section Intro: The 80/20 Rule Photoshop Basics and More
Creating a New Photoshop Document
Photoshop Environment: The Toolbar - Part 1
Photoshop Environment: The Toolbar - Part 2
Photoshop Environment: Palettes
Photoshop Environment: The Menu
Photo Enhancement & Manipulation
Photoshop Project #1: Create a New Graphic with Multiple Layers + Tutorial
Photoshop Project #2: Design a Business Card + Tutorial
Photoshop Quiz
Section Outro: Wrap Up Further Learning & What's Next

11 Topics
Section Intro: Web Design Basics Wireframing Photoshop
Web Design Terminology: The Jargon the Pros Use
The Four Phases of a Web Design Project + Cost Estimates
What is User Experience (UX) Design?
The Anatomy of a Website Design
The 960 Grid System + Free Photoshop Downloads
Web Design Project #1: Design a Minimal Landing Page + Tutorial
Web Design Project #2: Re-Design a Blog Landing Page
Web Design Project #2: Tutorial
Web Design Quiz
Section Outro: Wrap Up Further Learning & What's Next

6 Topics
Challenge Intro: How the Challenge Works
Discovery Phase: Create a Sitemap
Discovery Phase II: Sketch & Wireframe Your Design
Creative Phase: Design Your Website in Photoshop
Sharing Collaborating & Getting Feedback on Your Design
Challenge Wrap Up & What's Next

7 Topics
Section Intro: HTML Fundamentals First Webpage Course Files
The Basics of HTML: Tags Attributes Elements
Basic File & Folder Structure of a Website
Your Must Have Tool: A Good Code Editor
Hello World: Create Your Very First Web Page!
HTML Quiz
Section Outro: Wrap Up Further Learning & What's Next

13 Topics
Section Intro: HTML Tags Code a Real Web Page
Basic Structure of an HTML Document
Heading & Paragraph Tags
Using Emphasis & Strong Emphasis
Hyperlinks
Lists
Images
Tables
Forms
HTML Entities & "Special Characters"
HTML Project: Code a Basic Web Page + Tutorial
Intermediate HTML Quiz
Section Outro: Wrap Up Further Learning & What's Next

7 Topics
Section Intro: Advanced HTML Techniques HTML5
IDs & Classes
Span & Div Tags
Intro to HTML5 Tags: Header Footer Nav Section Article Aside & Time
HTML5 Project: Build a Basic HTML5 Web Page + Tutorial
Advanced HTML Quiz
Section Outro: Wrap Up Further Learning & What's Next

6 Topics
Section Intro: Expert HTML5 techniques
New HTML5 Inputs
Making Internet Explorer Compatible with HTML5
HTML5 Data Attribute
Expert HTML Quiz
Section Outro: Wrap Up Further Learning & What's Next

13 Topics
Section Intro: Essentials of CSS + Download Course Files
What is CSS? All the basics you need to know!
Inheritance of Styles
Measurements & The Box Model
Inline CSS
Internal CSS
External CSS
ID & Class Selectors
Descendant Selectors
Grouping Selectors
Specificity
CSS Project: Style an HTML Web Page + Tutorial
Section Outro: Wrap Up Further Learning & What's Next

8 Topics
Section Intro
Colors
Text Styling & Formatting
Borders
Background Images
Styling Links
CSS Quiz
Section Outro: Wrap Up Further Learning & What's Next

8 Topics
Section Intro
Styling Web Forms
Block Inline and Inline-Block Elements
Understanding Float & Clear (once and for all!)
Relative Absolute & Fixed Position
CSS Project: Build the Google Home Page + Tutorial (Part I)
CSS Project: Build the Google Home Page (Part II)
Section Outro: Wrap Up Further Learning & What's Next

3 Topics
A Guide to CSS Flexbox - Parent Properties (a.k.a. Flex Container Properties)
Flex Items: Understanding the Mysterious "Flex" Property
Flex Items: Align-Self Property

10 Topics
Section Intro: What is CSS3? + Course Files Download
CSS3 Box Sizing & Round Corners
CSS3 Colours & Gradients
CSS3 Shadows
CSS3 Columns
CSS3 Animations & Transitions
CSS3 Project #1: Create Animated Buttons + Tutorial
CSS3 Project #2: Code an Orbiting Planet Animation + Tutorial (Part I)
CSS3 Project #2: Code an Orbiting Planet Animation (Part II)
Section Outro: Wrap Up Further Learning & What's Next

3 Topics
Your Challenge: Everything You Need to Know + Section Wrap Up
Bonus Tutorial: How to Slice a Photoshop Design & Convert it to HTML & CSS
Bonus Tutorial P2: How to Slice a Photoshop Design & Convert it to HTML & CSS

12 Topics
Section Intro: What is Javascript The 80/20 Rule + Course Files Download
Internal & External Javascript
Basic Syntax of Javascript (and many other programming languages)
Javascript Output
Javascript Variables
Javascript Arrays
Javascript Functions
Javascript If / Else Statements
Javascript Project: Program a Tip Calculator + Tutorial
Javascript Project: Program a Tip Calculator Part II
Javascript Quiz
Section Outro: Wrap Up Further Learning & What's Next

7 Topics
Section Intro: What is jQuery? + Course Files
Download & Install jQuery
The Simple Syntax of jQuery
jQuery Selectors
jQuery Event Methods
Basic jQuery Quiz
Section Outro: Wrap Up & What's Next

7 Topics
Section Intro: jQuery Deep Dive!
jQuery Chaining
Hiding Showing & Fading Content with jQuery
The jQuery Animate Method
Modifying CSS with jQuery
jQuery Project: Mini Race Car Game + Tutorial
Section Outro: Wrap Up Further Learning & What's Next

8 Topics
Section Intro: What is jQuery UI? + Course Files
jQuery UI: Draggable
jQuery UI: Droppable
jQuery UI: Sortable
jQuery UI: Accordion
jQuery UI: Datepicker
jQuery Project: To Do List Web Application + Tutorial
Section Outro: Wrap Up Further Learning & What's Next

16 Topics
Section Intro: What is Responsive Design & Bootstrap? + Course Files
Getting Started with Bootstrap
Quickly Prototype with the Free Examples
Understanding the Bootstrap Grid System
Responsive (and sexy) Forms
Responsive Tables Buttons and Images
Helper Classes & Responsive Utilities
Using Glyphicons (Font Icons)
Bootstrap Navbar
Bootstrap Modal Window
Bootstrap ScrollSpy
Togglable Tabs
Sliding Carousel
Bootstrap Project: Code a "Hipster" Startup Website + Tutorial
Bootstrap Project: Startup Website Part 2
Section Outro: Wrap Up Further Learning & What's Next

1 Topic
Your Challenge: Convert Your Custom Website Into a Responsive Bootstrap Site

5 Topics
Section Intro: What is Web Hosting?
Purchasing a Bundled Domain Name & Hosting Package
The Hosting Control Panel (a.k.a. cPanel)
Understanding FTP & How to Upload a Website to Your Live Server
Section Outro: Wrap Up What's Next + Bonus (Free) Web Hosting

8 Topics
Section Intro: What is PHP & What Does It Do? + Course Files
Basic PHP Syntax
PHP Variables & Constants
PHP Arrays (Associative & Multi-Dimensional)
PHP Project: Program an App to fix "Click Bait Headlines" + Tutorial
PHP Project: Click Bait Headlines Part 2
PHP Quiz
Section Outro: Wrap Up & What's Next

7 Topics
Section Intro: Let's dive deeper into PHP
If Else and Elseif Statements
PHP Loops: While For Foreach & Do While
PHP Functions & Arguments
$_GET and $_POST
PHP Project: Convert a Static Website into a Dynamic PHP Site + Tutorial
Section Outro: Wrap Up Further Learning & What's Next +Bonus (Free) PHP Course!

15 Topics
Section Intro: What is MySQL? + Course Files
Creating Your First MySQL Database + phpMyAdmin Overview
Establishing a MySQL Connection with PHP
Selecting Data from a Database and Displaying it on Your Web Page
Insert Data into Your Database from a Web Page
Password Hashing (for securely storing passwords)
Using PHP Sessions to Store Global Variables
MySQL Project #1: Code a Login Form Profile Page & Logout + Tutorial
MySQL Project #2.1: Client Address Book - Planning our Application
MySQL Project #2.2: Client Address Book - Build the Login Sequence
MySQL Project #2.3: Client Address Book - Logout Sequence & Display Clients
MySQL Project #2.4: Client Address Book - Adding Clients
MySQL Project #2.5: Client Address Book - Editing Clients
MySQL Project #2.6: Client Address Book - Deleting Clients
Section Outro: Wrap Up Further Learning & What's Next

1 Topic
Your Challenge: Convert Your Custom Static Website into a Dynamic Website

10 Topics
Section Intro: What is WordPress?
How to Start a WordPress Blog in 5-Minutes
The Dashboard
Using Free and Premium Plugins to Achieve Any Feature You Desire
Using Free and Premium Themes to Quickly Make Gorgeous Websites
Theme Showcase: "X" Theme - The Ultimate All-in-one WordPress DIY Theme
The Importance of 24/7 WordPress Security
Quickly Start an eCommerce Online Store
WordPress Quiz
Section Outro: Wrap Up Further Learning What's Next + Course Discount

9 Topics
Section Intro: The Career Options Available to You as a Web Designer & Developer
The Importance of "Cultivating" Your Career
What Does Success Mean To You?
Freelancing: Should You Work For Free?
Freelancing: Should You Quit Your Job?
Free eBook Download: Cultivate a Successful Freelance Career
Where To Find Web Design & Development Jobs: Part-time Full-time & Freelance
4 Valuable Tips for Crafting the Perfect Résumé
The Grande Finale: Where Do You Go From Here?

11 Topics
Welcome Ryan our AngularJS expert & Guest Instructor
An Introduction to AngularJS + The App You'll Build from Scratch
Installation & Set up
Controllers and Views
Switching to Services
$HTTP Service
Creating the User Interface
Custom Filters
Creating New Data
Editing and Deleting Data
Wrap Up & Further Learning

25 Topics
Bonus Section Intro: Introducing Joel Funk (our Plugin Ninja)!
Welcome to the WordPress Plugin Quick Start + Course Files
Course Requirements
Concepts & Definitions: Introduction
Concepts & Definitions: What are plugins?
Concepts & Definitions: What are hooks?
Concepts & Definitions: Common actions & filters
Concepts & Definitions: What are post types?
Concepts & Definitions: Planning plugins
Groundwork: Introduction
Groundwork: Plugin header data
Groundwork: Creating admin pages
Groundwork: Creating admin menus
Groundwork: Creating custom post types
Groundwork: Creating custom database tables
Core features: Introduction
Core features: Creating custom shortcodes
Core features: Enhancing shortcodes
Core features: Including scripts
Core features: Capturing form submissions
Core features: Handling Ajax responses
Core features: Creating custom admin columns
Core features: Completing our stats page
Core features: Completing our welcome page
What next? Are you ready to go Ultimate!?

10 Topics
[Legacy] What You Get in This Course: Major Course Discounts + eBook
[Legacy] How to Get a Free Trial of Adobe Photoshop & More
[Legacy] Welcome Section - Wrap Up: What You've Learned & What's Next
[Legacy] Pop Quiz!
[Legacy] Section Intro: What You're Going to Learn
[Legacy] The Basic Elements & Principles of Visual Design
[Legacy] Typography Basics
[Legacy] The Science of Colour (or Color)
[Legacy] Designing with Grids
[Legacy] Section Outro: Wrap Up Further Learning & What's Next

1 Topic
Bonus Lesson

  Write a Review

Ultimate Web Designer & Web Developer Course

Go to Paid Course