Mid Term Exam
Web System and Technologies (WST) Course
Paper Pattern
- There will be FIVE questions.
- Each question carries 05 marks.
- All questions will be code-based; there will be no theoretical questions.
- Questions will be based on tasks and practical work covered in class and lab sessions.
- Possible question types:
- Write code for a given statement.
- Find and correct errors in a given code.
- Determine the output of a given code.
Understanding of questions is also a part of the exam. Therefore, don't call teacher for explanation of the questions. If there is misprinting in the question-paper, then you can ask the invigilator. If question is wrong in the quetion-paper, then the teacher will be responsible for giving you grace marks.
Course Contents for the Exam
Following topics are included for the Exam. These are categorized on base of different parts of the course. The course (WST) is combination of HTML, CSS and Tailwind CSS. Therefore, all topics are listed below related to different parts of the course.
Hypertext Markup Language (HTML)
| Lesson # | Title | Description | Controls |
|---|---|---|---|
| 1 | Basic Structure and Run Code | Tags like Doctype, html, head, title and body. How to run the code. | |
| 2 | Text Elements | Heading, Paragraph, Line break, Bold, Italic, Emphasize, Underline, Deleted, Inserted, Subscript and Superscript, Abbreviation and Citation | |
| 3 | Lists | Ordered, unordered and descriptive lists | |
| 4 | Link using Anchor Tag | Use only Anchor tag <a>, for internal-links and external-link | |
| 5 | Images | <img> tag to display images on web pages, including best practices for attributes like src, alt, width, height, and responsive image handling for better performance and design. | |
| 6 | Inline and Block Elements | List of inline and block elements in HTML. Explanation of their behavior | |
| 7 | Tables | Use <table>, <tr>, <th>, and <td> elements, along with <thead> and <tbody> | |
| 8 | Website Layouts | Components like header, navigation, content area, sidebar, and footer, along with common layout types such as 1-column, 2-column, and 3-column designs for responsive web development. |
Cascading Style Sheets (CSS)
| Lesson # | Title | Description | Controls |
|---|---|---|---|
| 1 | Basic Structure | Inline, internal, and external CSS, along with concepts like classes, IDs, CSS precedence, and the :hover pseudo-class for interactive styling. | |
| 2 | Display as flex | Flexible and responsive layouts using properties like display: flex, flex-direction, justify-content, align-items, and flex-wrap for efficient alignment and positioning of elements. | |
| 3 | Responsive Web Designing | Use flexible layouts, media queries, and scalable elements, providing a consistent user experience and mobile-friendliness |
JavaScript DOM
| Lesson # | Title | Description | Controls |
|---|---|---|---|
| 1 | Change HTML Element | Update content, attributes, and styles for dynamic and interactive web pages. |