Objective: Equip students with foundational web development skills to build and manage dynamic websites using HTML, CSS, JavaScript, PHP, and WordPress.
Module 1: HTML Basics (4 Classes)
Class 1: Introduction to HTML
What is HTML?
Structure of an HTML document
Basic tags: <html>, <head>, <body>, <h1> to <h6>, <p>
Writing your first HTML file
Class 2: Text Formatting and Links
Text formatting tags: <strong>, <em>, <u>, <br>, <hr>
Creating links: <a href>
Adding titles and tooltips
Absolute vs Relative URLs
Class 3: Images and Multimedia
Inserting images: <img>
Adding videos and audio
Attributes: alt, width, height
Best practices for multimedia
Class 4: Lists, Tables, and Forms
Ordered and unordered lists: <ol>, <ul>, <li>
Creating tables: <table>, <tr>, <td>, <th>
Introduction to forms: <form>, <input>, <textarea>, <button>
Module 2: CSS Basics (5 Classes)
Class 5: Introduction to CSS
What is CSS?
Inline, internal, and external CSS
CSS syntax and selectors
Linking a CSS file to an HTML file
Class 6: Colors, Backgrounds, and Borders
Color properties: color, background-color
Gradients
Borders, padding, and margins
Box model overview
Class 7: Typography
Font properties: font-family, font-size, font-weight, line-height
Text alignment: text-align
Styling links and lists
Class 8: Layout and Positioning
Display properties: block, inline, inline-block
Positioning: static, relative, absolute, fixed
Flexbox basics
Introduction to CSS Grid
Class 9: Responsive Design
Media queries
Viewport meta tag
Fluid layouts
Using percentages and em/rem
Module 3: JavaScript Basics (6 Classes)
Class 10: Introduction to JavaScript
What is JavaScript?
Adding JavaScript to HTML
Variables and data types
Comments in JavaScript
Class 11: Operators and Conditional Statements
Arithmetic, comparison, and logical operators
If-else statements
Switch-case statements
Class 12: Functions
What are functions?
Declaring and calling functions
Function parameters and return values
Class 13: DOM Manipulation
What is the DOM?
Selecting elements: getElementById, querySelector
Changing element content and styles
Class 14: Events in JavaScript
Event types: click, hover, submit
Adding event listeners
Preventing default actions
Class 15: Introduction to Arrays and Loops
Creating and using arrays
Loops: for, while, forEach
Iterating over arrays
Module 4: Basic PHP (6 Classes)
Class 16: Introduction to PHP
What is PHP?
Setting up a local server (XAMPP/WAMP)
Basic PHP syntax
Echo and print
Class 17: Variables and Data Types
Declaring variables
Strings, integers, floats, arrays
Constants in PHP
Class 18: Conditional Statements and Loops
If-else statements
Switch-case
Loops: for, while, foreach
Class 19: Forms and PHP
Handling form data with $_GET and $_POST
Validating user input
Simple form example
Class 20: Arrays and Functions in PHP
Associative arrays
Multi-dimensional arrays
Writing functions
Using built-in PHP functions
Class 21: Introduction to MySQL
What is a database?
Setting up MySQL with PHP
Basic queries: SELECT, INSERT, UPDATE, DELETE
Connecting PHP to a MySQL database
Module 5: WordPress Basics (7 Classes)
Class 22: Introduction to WordPress
What is WordPress?
Installing WordPress locally
Exploring the WordPress dashboard
Class 23: Themes and Plugins
Installing and customizing themes
Essential plugins overview
How to install plugins
Class 24: Creating Pages and Posts
Difference between pages and posts
Adding and formatting content
Using categories and tags
Class 25: Customizing Menus and Widgets
Adding and managing menus
Using widgets for sidebars and footers
Class 26: Managing Media
Uploading and optimizing images
Adding videos and documents
Best practices for media management
Class 27: Introduction to Page Builders
Using Elementor or similar page builders
Creating responsive layouts
Tips for design consistency
Class 28: Basic SEO and Security
SEO basics for WordPress
Installing SEO plugins
Security tips and essential plugins
Class 29: Final Project: Building a Website
Setting up a small project
Using HTML, CSS, JavaScript, PHP, and WordPress
Creating a multi-page site with a blog section
Class 30: Review and Q&A
Reviewing key topics from the course
Addressing student questions
Final tips for continued learning
Assessment and Deliverables:
Assignments after each module
Mid-course project: Build a static website (HTML, CSS, JavaScript)