Template for Practical Course and if AEC is a practical Course Annexure-V

Web Technology Lab Semester 5

Course Code BCSL504 CIE Marks 50
Teaching Hours/Week (L:T:P: S) 0:0:2:0 SEE Marks 50
Credits 01 Exam Hours 100
Examination type (SEE) Practical
Course objectives:
● Learn HTML 5 elements and their use.
● Use of CSS for enhanced user interface presentation.
● Gain knowledge of JavaScript, AJAX and jQuery for dynamic presentation.
● Use of PHP to build Web applications.
● Design and develop Websites and Web applications.
Sl.NO Experiments
1 Develop the HTML page named as “Myfirstwebpage.html”. Add the following tags with relevant content.
1. Set the title of the page as “My First Web Page”
2. Within the body use the following tags:
a) Moving text = “Basic HTML Tags”
b) Different heading tags (h1 to h6)
c) Paragraph
d) Horizontal line
e) Line Break
f) Block Quote
g) Pre tag
h) Different Logical Style (<b>, <u>, <sub>, <sup> etc.)
2 Develop the HTML page named as “Table.html” to display your class time table.
a) Provide the title as Time Table with table header and table footer, row-span and col-span etc.
b) Provide various colour options to the cells (Highlight the lab hours and elective hours with different
colours.)
c) Provide colour options for rows.
3 Develop an external style sheet named as “style.css” and provide different styles for h2, h3, hr, p, div, span,
time, img & a tags. Apply different CSS selectors for tags and demonstrate the significance of each.
4 Develop HTML page named as “registration.html” having variety of HTML input elements with background
colors, table for alignment & provide font colors & size using CSS styles.
5 Develop HTML page named as “newpaper.html” having variety of HTML semantic elements with
background colors, text-colors & size for figure, table, aside, section, article, header, footer… etc.
6 Apply HTML, CSS and JavaScript to design a simple calculator to perform the following operations: sum,
product, difference, remainder, quotient, power, square-root and square.
7 Develop JavaScript program (with HTML/CSS) for:
a) Converting JSON text to JavaScript Object
b) Convert JSON results into a date
c) Converting From JSON To CSV and CSV to JSON
d) Create hash from string using crypto.createHash() method
8 a. Develop a PHP program (with HTML/CSS) to keep track of the number of visitors visiting the web
page and to display this count of visitors, with relevant headings.
b. Develop a PHP program (with HTML/CSS) to sort the student records which are stored in the
database using selection sort.

12082024
 Template for Practical Course and if AEC is a practical Course Annexure-V

9 Develop jQuery script (with HTML/CSS) for:

a. Appends the content at the end of the existing paragraph and list.
b. Change the state of the element with CSS style using animate() method
c. Change the color of any div that is animated.
10 Develop a JavaScript program with Ajax (with HTML/CSS) for:
a. Use ajax() method (without Jquery) to add the text content from the text file by sending ajax request.
b. Use ajax() method (with Jquery) to add the text content from the text file by sending ajax request.
c. Illustrate the use of getJSON() method in jQuery
d. Illustrate the use of parseJSON() method to display JSON values.
Programming Assignment (5 marks):
Construct a Website (multiple Web pages) containing ‘Resume’ and Bio -data by using relevant HTML elements and
appropriate styling for presentation with CSS/jQuery/JavaScript. Host the Website on a cloud platform.
Programming Assignment (5 marks): Build a Web application with HTML, CSS, JavaScript, jQuery and PHP for
online application/registration form. Form should accept the information and print/display on a browser with
formatting/styling upon submission (Button click) on success. Host the application on a cloud platform.
Course outcomes (Course Skill Set):
At the end of the course, the student will be able to:
● Design the experiment for the given problem using HTML, Javascript and CSS.
● Develop the solution for the given real-world problem using jQuery, Ajax and PHP.
● Analyze the results and produce substantial written documentation.

12082024
 Template for Practical Course and if AEC is a practical Course Annexure-V

Assessment Details (both CIE and SEE)

The weightage of Continuous Internal Evaluation (CIE) is 50% and for Semester End Exam (SEE) is 50%.
The minimum passing mark for the CIE is 40% of the maximum marks (20 marks out of 50) and for the
SEE minimum passing mark is 35% of the maximum marks (18 out of 50 marks). A student shall be
deemed to have satisfied the academic requirements and earned the credits allotted to each subject/
course if the student secures a minimum of 40% (40 marks out of 100) in the sum total of the CIE
(Continuous Internal Evaluation) and SEE (Semester End Examination) taken together

Continuous Internal Evaluation (CIE):

CIE marks for the practical course are 50 Marks.
The split-up of CIE marks for record/ journal and test are in the ratio 60:40.
● Each experiment is to be evaluated for conduction with an observation sheet and record
write-up. Rubrics for the evaluation of the journal/write-up for hardware/software
experiments are designed by the faculty who is handling the laboratory session and are
made known to students at the beginning of the practical session.
● Record should contain all the specified experiments in the syllabus and each experiment
write-up will be evaluated for 10 marks.
● Total marks scored by the students are scaled down to 30 marks (60% of maximum
marks).
● Weightage to be given for neatness and submission of record/write-up on time.
● Department shall conduct a test of 100 marks after the completion of all the experiments
listed in the syllabus.
● In a test, test write-up, conduction of experiment, acceptable result, and procedural
knowledge will carry a weightage of 60% and the rest 40% for viva-voce.
● The suitable rubrics can be designed to evaluate each student’s performance and learning
ability.
● The marks scored shall be scaled down to 20 marks (40% of the maximum marks).
The Sum of scaled-down marks scored in the report write-up/journal and marks of a test is the
total CIE marks scored by the student.
Semester End Evaluation (SEE):
● SEE marks for the practical course are 50 Marks.
● SEE shall be conducted jointly by the two examiners of the same institute, examiners are
appointed by the Head of the Institute.
● The examination schedule and names of examiners are informed to the university before
the conduction of the examination. These practical examinations are to be conducted
between the schedule mentioned in the academic calendar of the University.

12082024
 Template for Practical Course and if AEC is a practical Course Annexure-V

● All laboratory experiments are to be included for practical examination.

● (Rubrics) Breakup of marks and the instructions printed on the cover page of the answer
script to be strictly adhered to by the examiners. OR based on the course requirement
evaluation rubrics shall be decided jointly by examiners.
● Students can pick one question (experiment) from the questions lot prepared by the
examiners jointly.
● Evaluation of test write-up/ conduction procedure and result/viva will be conducted
jointly by examiners.
● General rubrics suggested for SEE are mentioned here, writeup-20%, Conduction procedure
and result in -60%, Viva-voce 20% of maximum marks. SEE for practical shall be evaluated
for 100 marks and scored marks shall be scaled down to 50 marks (however, based on
course type, rubrics shall be decided by the examiners)
Change of experiment is allowed only once and 15% of Marks allotted to the procedure part
are to be made zero.
The minimum duration of SEE is 02 hours
Suggested Learning Resources:
Books:
1. Randy Connolly and Ricardo Hoar, Fundamentals of Web Development, 3 rd edition, Pearson, 2021
2. Robert W Sebesta, Programming the World Wide Web, 8th Edition, Pearson Education, 2020.

Web Links:
● https://www.w3schools.com/html/default.asp
● https://www.w3schools.com/css/default.asp
● https://www.w3schools.com/js/js_examples.asp
● https://www.geeksforgeeks.org/javascript-examples/
● https://www.w3schools.com/php/default.asp
● https://www.w3schools.com/jquery/default.asp
● https://www.w3schools.com/js/js_ajax_intro.asp
● https://www.geeksforgeeks.org/jquery-tutorial/

12082024