IMS ENGINEERING COLLEGE
LABORATORY MANUAL
Web Designing Lab
(BCS-353)
B.TECH – II YEAR
(ODD SEM 2023-2024)
Name
Roll No.
Section-Batch
DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING
IMS ENGINEERING COLLEGE
(Affiliated to Dr A P J Abdul Kalam Technical University, Lucknow )
Approved by AICTE - Accredited by NAAC – ‘A’ Grade
NH#24, Adhyatmik Nagar, Ghaziabad, UP, India
www.imsec.ac.in
VISION OF THE INSTITUTE
To make IMSEC an Institution of Excellence for empowering students through technical
education coupled with incorporating values and developing engineering acumen for
innovations and leadership skills for the betterment of society.
MISSION OF THE INSTITUTE
To promote academic excellence by continuous learning in core and emerging
Engineering areas using innovative teaching and learning methodologies.
To inculcate values and ethics among the learners.
To promote industry interactions and produce young entrepreneurs.
To create a conducive learning and research environment for life-long learning to
develop the students as technology leaders and entrepreneurs for addressing societal
needs.
VISION OF THE DEPARTMENT
To provide globally competent professionals in the field of Computer Science & Engineering
embedded with sound technical knowledge, aptitude for research and innovation with ethical
values to cater to the industrial & societal needs.
MISSION OF THE DEPARTMENT
M1: To provide quality undergraduate education in both the theoretical & applied
foundations of Computer Science Engineering.
M2: Conduct research to advance the state of the art in Computer Science & Engineering
and integrate the research results as innovations.
M3: To inculcate team building skills and promote life-long learning with a high societal
and ethical values.
2
DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING
PROGRAMME EDUCATIONAL OBJECTIVES (PEOs)
Graduate Will:
PEO1: Possess knowledge to enable continued professional development.
PEO2: Engage in life-long learning to foster personal & organization
growth. PEO3: Work productively as successful professionals in diverse
career paths.
PEO4: Effectively communicate ideas to promote collaboration in accordance with societal
standards & ethical practices.
PROGRAMME SPECIFIC OUTCOME (PSOs)
PSO1: To apply standard software engineering practices & strategies in real-time software
project development.
PSO2: To apply latest programming languages in creating innovative career opportunities.
3
PROGRAM OUTCOMES
Engineering Graduates will be able to:
1. Engineering knowledge: Apply the knowledge of mathematics, science, engineering
fundamentals, and an engineering specialization to the solution of complex engineering
problems.
2. Problem analysis: Identify, formulate, review research literature, and analyze complex
engineering problems reaching substantiated conclusions using first principles of
mathematics, natural sciences, and engineering sciences.
3. Design/development of solutions: Design solutions for complex engineering problems and
design system components or processes that meet the specified needs with appropriate
consideration for the public health and safety, and the cultural, societal, and
environmental considerations.
4. Conduct investigations of complex problems: Use research-based knowledge and research
methods including design of experiments, analysis and interpretation of data, and
synthesis of the information to provide valid conclusions.
5. Modern tool usage: Create, select, and apply appropriate techniques, resources, and
modern engineering and IT tools including prediction and modelling to complex
engineering activities with an understanding of the limitations.
6. The engineer and society: Apply reasoning informed by the contextual knowledge to
assess societal, health, safety, legal and cultural issues and the consequent responsibilities
relevant to the professional engineering practice.
7. Environment and sustainability: Understand the impact of the professional engineering
solutions in societal and environmental contexts, and demonstrate the knowledge of, and
need for sustainable development.
8. Ethics: Apply ethical principles and commit to professional ethics and responsibilities and
norms of the engineering practice.
9. Individual and team work: Function effectively as an individual, and as a member or
leader in diverse teams, and in multidisciplinary settings.
10. Communication: Communicate effectively on complex engineering activities with the
engineering community and with society at large, such as, being able to comprehend and
write effective reports and design documentation, make effective presentations, and give
and receive clear instructions.
11. Project management and finance: Demonstrate knowledge and understanding of the
engineering and management principles and apply these to one’s own work, as a member
and leader in a team, to manage projects and in multidisciplinary environments.
12. Life-long learning: Recognize the need for, and have the preparation and ability to engage
in independent and life-long learning in the broadest context of technological change.
4
GENERAL LABORATORY INSTRUCTIONS
1. Students are advised to come to the laboratory at least 5 minutes before (to the starting
time), those who come after 5 minutes will not be allowed into the lab.
2. Plan your task properly much before to the commencement, come prepared to the lab with
the synopsis / program / experiment details.
3. Student should enter into the laboratory with:
Laboratory observation notes with all the details (Problem statement, Aim, Algorithm,
Procedure, Program, Expected Output, etc.,) filled in for the lab session.
Laboratory Record updated up to the last session experiments and other utensils (if
any) needed in the lab.
Proper Dress code and Identity card.
4. Sign in the laboratory login register, write the TIME-IN, and occupy the computer system
allotted to you by the faculty.
5. Execute your task in the laboratory, and record the results / output in the lab observation
note book, and get certified by the concerned faculty.
6. All the students should be polite and cooperative with the laboratory staff, must maintain
the discipline and decency in the laboratory.
7. Computer labs are established with sophisticated and high end branded systems, which
should be utilized properly.
8. Students / Faculty must keep their mobile phones in SWITCHED OFF mode during the lab
sessions. Misuse of the equipment, misbehaviors with the staff and systems etc., will attract
severe punishment.
9. Students must take the permission of the faculty in case of any urgency to go out; if
anybody found loitering outside the lab / class without permission during working hours will
be treated seriously and punished appropriately.
10. Students should LOG OFF/ SHUT DOWN the computer system before he/she leaves the
lab after completing the task (experiment) in all aspects. He/she must ensure the system / seat
is kept properly.
4
DETAILS OF THE EXPERIMENTS CONDUCTED
(TO BE USED BY THE STUDENTS IN THEIR RECORDS)
INDEX
S. No TITLE OF THE EXPERIMENT DATE OF FACULTY
SUBMISSION SIGNATURE
10
11
5
EXPERIMENT NO. - 1
Design the following static web pages required for an online book store website.
Design the following static web pages required for an online book store web site.
HOME PAGE:
The static home page must contain three frames.
Top frame: Logo and the college name and links to Home page, Login page, Registration
page,Catalogue page and Cart page (the description of these pages will be given below).
Left frame: At least four links for navigation, which will display the catalogue of respective links.
For e.g.: When you click the link “CSE” the catalogue for CSE Books should be displayed in the Right frame.
Right frame: The pages to the links in the left frame must be loaded here. Initially this page contains
description of the web site.
Logo Web Site Name
Home Login Registration Catalogue Cart
CSE
ECE
Description of the
EEE Web Site
CIVIL
home. html
<html>
<head>
<title>IMS ENGINEERING COLLEGE</title>
</head>
<frameset cols="25%,75%">
<frameset rows="25%,10%,65%">
<frame name ="f11" src="D:\WDLab\logo.html">
<frame name ="f21" src="D:\WDLab\home1.html">
<frame name ="f31 "src="D:\WDLab\courses1.html">
</frameset>
<frameset rows="25%,10%,65%">
<frame name ="f12"src="D:\WDLab\name.html">
<frameset cols="18%,18%,18%,18%">
<frame name ="f22" src="D:\WDLab\login1.html">
<frame name ="f23" src="D:\WDLab\registration1.html" >
<frame name ="f24" src="D:\WDLab\catalogue1.html">
<frame name = "f25" src="D:\WDLab\cart1.html"
1 >
</frameset>
<frame name = "f32" src="D\WDLAB\home2.html">
</frameset>
</frameset>
</html>
<html>
<head>
<title>LOGO</title>
</head>
<body bgcolor="#ffcc00">
<img src="D:\WDLab\logo.jpg" height="100%" width=100%>
</body>
</html>
home1.html
<html>
<head>
<title>HOME1</title>
</head>
<body bgcolor="#ffcc99">
<a href="home.html"> HOME </a>
</body>
</html>
courses1.html
<html>
<head>
<title>home1</title>
</head>
<ul type="none">
<li ><a href="CSE.html" target="f32">CSE </a><br><br>
2
<li ><a href="ECE.html" target="f32" >ECE </a><br><br>
<li ><a href="EEE.html" target="f32" >EEE </a><br><br>
<li ><a href="CIVIL.html target="f32" ">CIVIL </a>
</ul>
</html>
name.html
<html>
<head>
<title>home1</title>
</head>
<body bgcolor="#ffcc66">
<div align="Center"> IMS Engineering College,Ghaziabad </div>
</body>
</html>
login1.html
<html>
<head>
<title>home1</title>
</head>
<body bgcolor="#ffcc99">
<a href="login.html" target="f32">Login </a>
</body>
</html>
registration 1.html
<html>
<head>
<title>home1</title>
</head>
<body bgcolor="#ffcc99">
<a href="registration.html" target="f32">Registration </a>
</body>
</html>
catalogue1.html
<html>
<head>
<title>home1</title>
</head>
<body bgcolor="#ffcc99">
3
<a href="catalogue.html" target="f32">Catalogue</a>
</body>
</html>
cart1.html
<html>
<head>
<title>home1</title>
</head>
<body bgcolor="#ffcc99">
<a href="cart.html" target="f32">Cart </a>
</body>
</html>
CSE.html
<html>
<head>
<title>home1</title>
</head>
<body>
<h1><div align = "Center">Department of Computer Science & Engineering </div> </h1>
<p align="justify">
The Department of Computer Science & Engineering, established in the year 2002 with current
intake of 240 students,
imparts quality education and believes in creating
4 new opportunities for students to meet the
challenges of
technologicaldevelopment in Computer Science & Engineering. The B. Tech. (CSE) program is
affiliated with
Dr. APJ Abdul Kalam Technical University, Lucknow, and is approved by AICTE, New Delhi.
The department has qualified faculty members, infrastructure, and state-of-the-art equipment which
help
in providing an excellent environment for teaching and learning. The department is actively
involved in
Industrial Training, Project Development and other professional activities. Department of Computer
Science
and Engineering has signed various MOUs with highly recognized organizations to provide live
projects and
Internship opportunities to our Engineering Students. Industrial visits, Workshops, Seminars,
Conferences,
and Mini Projects for students are also conducted regularly to encourage students. The major
employers of
our students are well-renowned Indian conglomerates like TCS, Infosys, Wipro, HCL, and other
multinational
companies including IBM, Accenture & HP.
</p>
</body>
</html>
ECE.html
<html>
<head>
<title>home1</title>
</head>
<body>
<h1><div align = "Center">Department of Electronics and Communication Engineering </div>
</h1>
<p align="justify">
Electronics and Communications Engineering (ECE) involves researching, designing,
developing and testing of electronic equipment used in various systems. Electronics and
Communications engineers also conceptualize and oversee the manufacturing of communications
and broadcast systems.This stream of engineering deals with analog transmission, basic electronics,
microprocessors, solid state devices, digital & analog communication, analogintegrated circuits,
microwave engineering, satellite communication, antenna and wave propagation. It also deals with
the manufacturing of electronic devices, circuits, and communications equipment.This branch of
engineering also plays a vital role ensuring fastest means of communication across the world.
</body>
</html>
5
EEE.html
<html>
<head>
<title>home1</title>
</head>
<body>
<h1><div align = "Center">Department of Electrical and Electronics Engineering </div> </h1>
<p align="justify">
The Department of Electrical and Electronics Engineering was established in year 2004 with
aim to prepare students for a successful professional career in respective field. Historically,
the field of Electrical & Electronics Engineering is one of the most versatile and has broad
applications in multidisciplinary sectors. The Department has focused towards integrating
academicswith cutting edge technologies in modern world.
</body>
</html>
CIVIL.html
<html>
<head>
<title>home1</title>
</head>
<body>
<h1><div align = "Center">Department of Civil Engineering </div> </h1>
<p align="justify">
Civil engineering is the professional practice of designing and developing
infrastructure projects. This can be on a huge scale, such as the development
of nationwide transport systems or water supply networks, or on a smaller scale,
such as the development of individual roads or buildings.
</p>
</body>
</html
6
Viva Questions
Q.1 What is HTML?
Q.2 Difference between HTML and XHTML
Q.3 Differentiate between HTML & DHTML.
Q4. Explain Radio Button. Differentiate Radio Button & Check Box.
Q.5 Define the drop down list.
