1. Course Description
This course introduces students to web technologies, encompassing HTML, CSS, and JavaScript. Students learn web basics, HTML structure, CSS styling, JavaScript programming, and advanced topics. The course emphasizes responsive design, DOM manipulation, asynchronous programming, and practical implementations. Practical sets reinforce skills in creating web content, styling layouts, and enhancing interactivity, culminating in a website project. The course includes understanding the fundamental concepts of web technology, including the Internet, Intranet, and World Wide Web (WWW), and demonstrating proficiency in designing and structuring web content using HTML, creating both static and dynamic web pages. The course explores advanced JavaScript topics, including scope, closures, error handling, DOM manipulation, and asynchronous programming, and develops hands-on experience by creating interactive web interfaces and responsive layouts through practical exercises.
2. General Objectives
- To understand the core concepts of web technology, including the Internet, Intranet, and World Wide Web (WWW).
- To acquire proficiency in designing and structuring web content using HTML, encompassing static and dynamic pages.
- To develop expertise in applying CSS for styling and layout, including typography, colors, backgrounds, and responsive design.
- To master the principles of client-side scripting with JavaScript, covering variables, control flow, functions, arrays, and objects.
- To explore advanced JavaScript topics, including scope, closures, error handling, DOM manipulation, and asynchronous programming.
- To gain hands-on experience with practical exercises to create interactive web interfaces and responsive layouts.
- To apply best practices in coding, optimization, and organization to enhance web development efficiency and performance.
- To cultivate a foundation in modern web technologies, enabling the creation of dynamic and engaging web applications.
3. Method of Instructions
General Instructional Technique: Lecture, Discussion, Readings, Question Answer
Specific Instructional Technique: Practical works, Project Based Learning, Self-Directed Learning, Industry Insights and Case Study
4. Content in Detail with Specific Objectives
| Specific Objectives | Contents |
|---|---|
| Unit I: Introduction to web technology [3 Hrs.]
|
| Specific Objectives | Contents |
| Unit 2: Hyper Text Markup Language [8 Hrs.]
|
| Specific Objectives | Contents |
| Unit 3: HTML5 [7 Hrs.]
|
| Specific Objectives | Contents |
| Unit 4: Cascading Style Sheets [8 Hrs.]
|
| Specific Objectives | Contents |
| Unit 5: Advance Topics on CSS [7 Hrs.]
|
| Specific Objectives | Contents |
| Unit 6: Client Side Scripting with JavaScript [8 Hrs.]
|
| Specific Objectives | Contents |
| Unit 7: Advance Topics on JavaScripts [7 Hrs.]
|
5. Laboratory Work
It builds the foundation for how to write a program using any high-level language. Hence, this course requires a lot of programming practice so that students will be able to develop good logic building and program developing capability which is essential throughout the course.
Some important contents that should be included in lab exercises are as follows:
- Creating a simple static web site with 4 pages, using HTML5 (include all tags included in HTML and HTML 5
- Create a simple image gallery using CSS
- Create a responsive web page using box model
- Create a form with all the elements and validate it using client-side scripting
- Using JavaScript create a simple calculator
- Create a user registration form using HTML 5 and validate it using JavaScript
- Creating jQuery Slider and Image Gallery
- Use jQuery date picker and sort
- Work with JSON data and make AJAX requests using fetch API or XMLHttpRequest
- General concept of React, Angular, or Vue.js for building web applications
Note:
- Motivate students to create small project work integrating all of the above concepts.
- Each of the above lab session should cover more than 4 hours of practical work.
6. Evaluation system and Student’s Responsibility
In addition to the formal exam(s), the internal evaluation of a student may consist of quizzes, assignments, lab reports, projects, class participation, etc. The tabular presentation of the internal evaluation is as follows.
| External Evaluation | Marks | Internal Evaluation | Weight | Marks |
|---|---|---|---|---|
Semester-End examination |
50 | Theory |
30 | |
| Attendance & Class Participation | 10% | |||
| Assignments | 20% | |||
| Presentations/Quizzes | 10% | |||
| Internal Assessment | 60% | |||
| Practical | ||||
| Attendance & Class Participation | 10% | 20 | ||
| Lab Report/Project Report | 20% | |||
| Practical Exam/Project Work | 40% | |||
| Viva | 30% | |||
| Total External | 50 | Total Internal | 50 | |
| Full Marks: 50 + 50 = 100 | ||||
7. Student’s Requirements
Each student must secure at least 45% marks separately in both internal assessment and practical evaluation with 80% attendance in the class in order to appear in the Semester End Examination. Failing to get such a score will be given NOT QUALIFIED (NQ) to appear in the Semester-End Examinations. Students are advised to attend all the classes, formal exams, tests, etc., and complete all the assignments within the specified time period. Students are required to complete all the requirements defined for the completion of the course.
8. Prescribed Books and References
Prescribed Text Books:
- Robbins, J. N. (2018). Learning Web Design: A Beginner’s Guide to HTML, CSS, JavaScript, and Web Graphics. O’Reilly Media.
Reference Books:
- Holzner, S. (2000). HTML Black Book. John Wiley & Sons.
- Inc, K. L. S. (2009). Web Technologies: Html, Javascript, Php, Java, Jsp, Asp.Net, Xml And Ajax, Black Book (With Cd). Wiley India
- Knuckles. (2006). Web Applications: Concepts & Real World Design. John Wiley & Sons.
- Deitel, P. J., Deitel, H. M., & Deitel, A. (2012). Internet and world wide web: How to Program. Prentice Hall.