Welcome to the HTML Full Course for Beginners repository! 🎉
This repository contains all the source code, examples, and practice files used in my HTML Web Development Series on YouTube. The series is designed for absolute beginners and gradually covers all essential HTML concepts with real examples.
👉 YouTube Playlist: Learn HTML step-by-step with detailed explanations and hands-on demos. Playlist
- HTML fundamentals & structure
- Text formatting and links
- Images, lists, and tables
- Forms and semantic HTML
- HTML5 features & multimedia
- SEO basics & accessibility (A11Y)
- Best practices for clean HTML code
Each folder in this repository corresponds to a video in the series.
| S. No. | Main Topic | Sub-topics Included | Video Link |
|---|---|---|---|
| 1 | Introduction to HTML + Basic Structure | What is HTML, DOCTYPE, <html>, <head>, <body>, first webpage, comments, indentation |
Watch |
| 2 | Text & Formatting Elements | Headings, paragraph, bold/strong, italic/em, underline, hr, br, pre, quotes, small, mark, sup/sub | Watch |
| 3 | Links & Navigation | <a>, href, target, internal/external links, email/phone/download links, navigation menu |
Watch |
| 4 | Images & File Paths | <img>, alt, title, width/height, responsive images, absolute vs relative paths, folder structure |
Watch |
| 5 | Lists & Tables | Ordered/Unordered lists, description list, nested lists, table tags, rowspan, colspan, caption | Watch |
| 6 | Forms (Complete) | Input types, label, textarea, select, optgroup, button, fieldset, validation, GET/POST | Watch |
| 7 | Semantic HTML | header, nav, main, article, section, aside, footer, figure, figcaption, address, time | Watch |
| 8 | Inline vs Block vs Inline-block | Display behavior with real examples | Watch |
| 9 | Multimedia & Embeds | Audio, video, source, track, iframe, embed YouTube/Maps | Watch |
| 10 | HTML5 New Features | details & summary, dialog, progress, meter, new input types | Watch |
| 11 | Head Tag & Meta Tags + SEO Basics | charset, viewport, meta description, keywords, favicon, Open Graph (OG tags) | Watch |
| 12 | Accessibility (A11Y) + Best Practices | alt, aria-label, role, tabindex, headings order, semantic usage | Watch |
| 13 | Entities & Symbols | HTML entities, emoji codes, reserved characters | Watch |
-
Clone the repository:
git clone https://github.com/jdcodebase/html-series
-
Open any lesson folder.
-
Run the
.htmlfiles directly in your browser. -
Follow along with the corresponding YouTube video.
- Absolute beginners in web development
- Students learning HTML for the first time
- Anyone revising HTML fundamentals
- Future frontend & MERN stack developers
If you find this series helpful:
- ⭐ Star this repository
- 👍 Like the videos
- 💬 Drop your questions in the comments
- 🔔 Subscribe to JDCodebase on YouTube
After HTML, we move to:
- CSS (Complete)
- JavaScript (Beginner to Advanced)
- React
- MERN Stack Projects
Happy Coding! 🚀
— JDCodebase