ITM(SLS) BARODA UNIVERSITY, VADODARA

Bachelor of Computer Application

Course Code:
Semester- I
Subject Name: Static Website Designing

Type of Course: Skill Enhancement Course

Pre-requisites: None

Rationale: The course will enable the understanding of basic principles of web design, HTML and CSS and implement
them through static Website creation

Teaching and Examination Scheme:

Course Course
Teaching Scheme Examination Scheme
Code Title
Contact Hours Credit Theory Practical Total
Interna Exter
Lecture Tutorial Practical Total External
l nal
Static 2 0 4 6 4 60 40 50 150
website
Designing

Course Content:
Unit Contents Total Hrs

Unit-1 An Overview of Web: 04

Introduction to Internet and World Wide Web; Evolution and History of World
Wide Web; Basic Features; Web Browsers; Web Servers; Hypertext Transfer
Protocol; URLs; Features of Web 2.0; Setting up UNIX and Linux Web Servers:
Logging Users, Dynamic IP

Unit-2 An Overview of Client-Server architecture 06

Structure of client-server architecture; Characteristics of client-server
architecture; introduction of HTTP; Difference between client and server;
Advantages and Disadvantages of client-server architecture.

Unit-3 Web Design: 04

Website Design Principles, Concepts of effective web design. Look and Feel of
the Website, Page Layout and linking, User-centric design, Planning the Site,
Designing effective navigation, Publishing Website
 Unit-4 Introduction to HTML: 08
An Introduction to HTML, HTML tags, Structure of an HTML document, Text
and paragraph format and Unordered lists, Hyperlinks, Images, − HTML tables,
Frames, Framesets, Designing HTML forms, Multimedia tags, Advance
Elements of HTML5:!Doctype, meta, Input Controls (number, date, time,
calendar, ranges)

Unit-5 Style Sheets: CSS: Need, introduction, inline CSS, embedded CSS, external 08
CSS; Basic syntax and structure: 3 Parts: Selectors, Properties, Values; Basic
CSS Selectors: Element, Class, ID; Hierarchy of Styling Operations; List of
selectors: Attribute selectors; List of Properties: Size, Color, Link, Font, Text,
Image, Border, Margin, Padding, etc

Total: 30

21

Books:
Text Books T1: Ivan Bayross, “Web Enabled DHTML, Javascript, Perl CGI”, BPB, 2004.
T2: Web Technologies, Black Book, Dreamtech Press

References R1: Joel Sklar, “Web Design”, Cengage Learning

R2: HTML 5 for Web Designers (By: Jeremy Keith).
R3: Internet and World Wide Web How to program, P.J. Deitel & H.M. Deitel, Pearson

Course Outcomes:
After completing this course students will be able to Marks %
weightage

CO1: Understand concept of web servers and client server architecture and apply it for any 20
domain.
CO2: Understand various HTML tags and apply it to create different kinds of web pages. 30

CO3: Understand and apply different CSS styles to the web pages. 30

CO4: Create Static website with attractive design and host it on webserver or local server. 20

Online Resources
 www.w3schools.com
 https://www.tutorialspoint.com/internet_technologies/html.htm
 https://www.javatpoint.com/html-tutorial
 https://www.tutorialspoint.com/Structure-of-a-Client-Server-System
 https://www.w3schools.in/what-is-client-server-architecture
MOOC Courses
 https://www.edx.org/professional-certificate/w3cx-front-end-web-developer
 https://www.edx.org/course/css-basics
 Practical List:
Practical Set-1 HTML
1. First website displaying “Hello World!”
2. Simple Text: Use <h1> to <h6>, <p>, <br />, <hr /> tags
 Use Text Formatting tags to format different parts of the text
 Use the style to change color of desired text, change the font size, etc
3. Ordered and Unordered Lists: Use <ol>, <li>, <ul>, <li> tags
4. Tables: <table>, <tr>, <th>, <tr>, <td> tags
 Use various attributes to change Border width & color, Background color, Cell padding, etc
 Use style to change font colors, background color, etc in selected cells of the table
5. Include images and links
6. Prepare Form containing (a) Text input, (b) Text area, (c) Radio button, (d) Checkbox, (e) Select box,
(f) File select, (g) Buttons, (h) Submit and reset buttons, (i) Hidden text (required in password entry,
etc)
7. Design web pages for BCA programme
8. Create your class timetable using table tag.
9. Create Student feedback form (use textbox, text area , checkbox, radio button, select box etc.)
10. Create a web page using frames. Divide the page into two parts with Navigation links on left hand side
of page (width=20%) and content page on right hand side of page (width = 80%). On clicking the
navigation Links corresponding content should be shown on the right hand side.
11. Create your personal website – include as many variety of tags as possible.

Practical Set-2 CSS

1. Use CSS with class and id to change color, font-family, font-variant, font-weight, font-size, font-style,
etc
2. Use other CSS properties, such as Size, Text, Margin, Padding, Border, Image, Link, etc
3. Design a web page of your home town with an attractive background color, text color, an Image, font
etc. (use internal CSS).
4. Use Inline CSS to format your resume that you created.
5. Use External CSS to format your class timetable as you created.
6. Use External, Internal, and Inline CSS to format college web page that you created.

Suggested Specification table with Marks (Theory):

Distribution of Theory Marks

K1 K2 K3 K4 K5 K6

4 8 12 8 4 4
K =>Remember K =>Understand K =>Apply K =>Analyze K =>Evaluate K =>Create
1 2 3 4 5 6

Mapping of Course outcome with Program Outcomes POs, Program Specific Outcomes PSOs,
and Knowledge Levels (As per Blooms Taxonomy)

Knowledge
CO/PO PO1 PO2 PO3 PO4 PO5 PO6 PO7 PO8 PO9 PO10 PO11 PO12 PSO1 PSO2
Levels
CO1 3 1 2 1 - - - - - - - - 1 - K2, K3
CO2 3 1 2 1 - - - - - - - - 2 - K2,K3
CO3 3 1 3 1 - - - - - - - - 2 - K2,K3
CO4 1 1 3 1 - - - - - - - - 2 - K3,K6
CO5 1 1 3 1 - - - - - - - - 3 - K3,K6
High-3 Medium-2 Low-1
K =>Remember K =>Understand K =>Apply K =>Analyze K =>Evaluate K =>Create
1 2 3 4 5 6

Course Assessment Methods:

DIRECT(75%)
1. Formative Exam(40%)
1. Continuous Evaluation Test I and II (Theory component)
2. Lab Experiments (Programs) Test/Viva; Lab Manual for each program implemented (Lab Component)

2. Summative Exam(60%)
1. End Semester Examination (Theory and lab components)

INDIRECT(25%)
1. Course-end survey