Syllabus: Introduction to HTML Programming
Course Description:
This course provides a foundational understanding of HTML (HyperText Markup Language), the
standard language for creating and designing web pages. By the end of the course, students will
be able to build and structure basic web pages using HTML tags and elements.
Course Objectives:
1. Understand the role of HTML in web development.
2. Learn how to structure web pages with HTML.
3. Develop proficiency in using HTML elements, attributes, and tags.
4. Create well-organized, accessible, and functional web pages.
Course Outline:
Module 1: Introduction to HTML
What is HTML?
History and Evolution of HTML
HTML vs. Other Web Technologies
Setting up the development environment (Text editors, Browsers)
Basic HTML document structure (<!DOCTYPE>, <html>, <head>, <body>)
Module 2: Basic HTML Elements
Headings and Paragraphs: <h1> to <h6>, <p>
Text Formatting Tags: <b>, <i>, <u>, <strong>, <em>, <sup>, <sub>
Lists:
o Ordered Lists (<ol>)
o Unordered Lists (<ul>)
o Nested Lists
Comments: <!-- This is a comment -->
Module 3: Links and Images
Hyperlinks: <a href="">
o Internal vs. External Links
o Anchor Links
Images: <img src="" alt="">
o Image Attributes: width, height, alt
Module 4: Tables
Table Elements:
o <table>, <tr>, <td>, <th>
Attributes: border, cellpadding, cellspacing
Advanced Table Features:
o Merging Cells: rowspan, colspan
o Adding captions: <caption>
Module 5: Forms
Form Structure: <form>, action, method
Input Types:
o Text: <input type="text">
o Password: <input type="password">
o Radio Buttons: <input type="radio">
o Checkboxes: <input type="checkbox">
o Dropdowns: <select>, <option>
Buttons: Submit, Reset, and custom buttons
Labels and Accessibility: <label for="">
Module 6: HTML5 Semantic Elements
Introduction to Semantic Tags:
o <header>, <footer>, <nav>, <section>, <article>, <aside>, <main>
Importance of semantic HTML for accessibility and SEO.
Module 7: Multimedia
Adding Audio: <audio src="" controls>
Adding Video: <video src="" controls>
Attributes for multimedia elements: autoplay, loop, muted
Module 8: Best Practices
Writing clean and readable code.
Using proper indentation and comments.
Understanding the importance of alt attributes and accessibility.
Cross-browser compatibility considerations.
Module 9: Final Project
Create a personal portfolio webpage using all the learned HTML concepts.
o Include sections like an About Me page, a Portfolio page, a Contact Form, and
links to external resources.
Assessment:
1. Quizzes: Weekly quizzes on HTML concepts (30%)
2. Assignments: Hands-on exercises for each module (30%)
3. Final Project: Comprehensive personal webpage (40%)
References:
1. Mozilla Developer Network (MDN) Web Docs
2. W3Schools HTML Tutorials
3. Recommended Textbook: HTML and CSS: Design and Build Websites by Jon Duckett
Schedule:
Duration: 8 Weeks
Weekly Sessions: 2 hours/session (Lecture + Hands-on Practice)
Final Project Presentation: Week 9
This syllabus can be customized based on the target audience’s level and the available time
frame.
