Welcome to Web Foundations
Course overview and explanation of the course toolkit
Overview of web design terminology, workflows, and careers
Introduction to UX & UI
Define and differentiate concepts of UI and UX
Recognize common UI design software tools and shortcuts
Design Workflow & Principles
Define scope and conduct research for a new project idea
Understand the importance of the target audience
Designing for Responsive Layouts
Identify grid types for optimal content display
Understand responsive and mobile-first design approaches
Typography and Color Theory
Introduction to typography in web design
Understanding color theory for web design
Implementing text and color for readability
UI Patterns and Components
Understanding common UI patterns (buttons, forms, navigation)
Applying UI components to create effective layouts
Unit Project: Mood Board to Mockup
The Internet & HTML
Overview of the internet, history, and regulations
Introduction to HTML syntax and text formatting
Styling with CSS
Understanding CSS and its role in web development
Compare UI design concepts with CSS properties
Explore character sets and font families
Advanced CSS Techniques
Advanced selectors, pseudo-classes, pseudo-elements
Working with Flexbox and CSS Grid Layout
Introduction to CSS animations and transitions
Arranging Content
Structuring content using semantic HTML
Positioning elements with CSS
Unit Project: Green Team Website
Introduction to JavaScript
Overview of JavaScript in web development
Basic syntax and data types
JavaScript Functions and Control Flow
Understanding functions, parameters, return values
Working with control structures (if-else, loops)
DOM Manipulation
Understanding the Document Object Model (DOM)
Selecting and modifying elements with JavaScript
Event handling and user interaction
Unit Project: Interactive Website
Final Project Planning
Define project goals, gather requirements, develop a timeline
Create a design plan and start coding
Integrating JavaScript & CSS
Enhance the final project with JS interactivity and advanced CSS
Final Testing and Debugging
Perform cross-browser testing and improve code quality
Deploying Your Website
Deploy sites using GitHub Pages and Netlify
Set up and maintain a live website
Unit Project: Final Website
