Course Objectives:
The course will enable the students to design websites/web applications using HTML, CSS and JavaScript. Students will develop necessary skills for entry into web development careers.
Course | Learning outcome (at course level) | Learning and teaching strategies | Assessment Strategies | |
Course Code | Course title | |||
24CCAI 202 |
WEB TECHNOLOGIES (PRACTICAL)
| CO19. Determine the principles of creating an effective web page using HTML 5, CSS and JavaScript. CO20. Implement advanced CSS properties such as dimensions, transition, positioning to design static web pages. CO21. Apply external, internal and inline style sheets in the web pages. CO22. Develop visually appealing websites for different applications. CO23. Build dynamic web pages using the concepts of scripting languages. CO24. Contribute effectively in course-specific interaction
| Approach in teaching: Interactive Lectures, Lab Sessions, Discussion, Lab assignments, Demonstration.
Learning activities for the students: Self-learning assignments, Effective questions, Giving tasks. | Exercise-based test, Semester end examinations, Quiz, practical Assignments, Viva voce, Presentation of Assignments. |
HTML
Introduction to HTML 4 and HTML 5
● Heading, paragraphs, HTML Formatting, Quotations, comments, colors, images, tables, lists, block and inline elements
● HTML Links
● Semantic elements:<article>, <aside>, <figcaption>, <figure>, <footer>, <header>, <main>, <nav>, <section>, <summary>, <time>
● Introduction to HTML Forms: Form Object, Text element, Password element, Button element, submit button, reset button, Checkbox element, Radio element, Text area, Select and option element. New attributes for <input>: autofocus, form action, form method, form no validate, height and width, list, min and max, multiple, pattern (regexp), placeholder, required, step, input types, input attributes
● Introduction to HTML API: HTML Geolocation: Locate the User’s Position, Handling Errors and Rejections, Displaying the Result in a Map, HTML Drag/Drop: Making an Element Drag gable
CSS
● Developing Style Sheets: inline, internal and external
● Styling Backgrounds, Styling borders, Styling Text, Styling Fonts, Styling Links, Styling Lists, Styling Tables, Margin, Outline, Transition: transition, transition-delay, transition-duration, transition-property.
● CSS Grouping/Nesting, Box Model CSS Dimension, CSS Display, CSS Positioning, CSS Floating, CSS Align, CSS Pseudo-class, CSS Pseudo-element, CSS Navigation Bar, CSS Image Gallery, CSS Image Opacity, CSS Attribute Selectors
JAVASCRIPT
● Comparison between client-side and server-side scripting.
● Data Types and Literals, creating variables, Operators (Arithmetic, Logical, Comparison, String and Assignment operator and special operators: delete, new and void) and Expressions in JavaScript. JavaScript Programming Constructs: Conditional checking (if-then-else statement), Loops (for loop and While loop).
Suggested Text Books:
Suggested Reference Books:
Reference Journals:
e-Resources including links