ASSIGNMENT COVER SHEET
STUDENT DETAILS
Student ID
Reg No.
Family Name
shah
Given Name
Rohit
Enrolment Year
2019
Section
F
Semester
Second
Email
rohitshah@ismt.edu.np
UNIT DETAILS
Unit Title
Unit 10: Website Design & Unit Code
Development
R/615/1633
Assessor Name
Bikul Koirala
2/21/2021
Assignment
Title
Web Solution Technology
Assignment No
1/1
Submission Date
12/11/2021
Qualification
BTEC HND IN COMPUTING
Campus
International
School
of
Management
and
Technology
Issued Date
Website Design &Development 2021
STUDENT ASSESSMENT SUBMISSION AND DECLARATION
When submitting evidence for assessment, each student must sign a declaration confirming that the work is their own.
Student Name
Rohit shah
Assessor Name
Bikul Koirala
Issue Date
02/21/2021
Submission Date
10/24/2021
Programme
BTEC HND IN COMPUTING
Unit Name
Website Design & Development
Assignment Title
Web Solution Technology
Plagiarism:
Plagiarism is a particular form of cheating. Plagiarism must be avoided at all costs and students who break
the rules, however innocently, may be penalized. It is your responsibility to ensure that you understand
correct referencing practices. As a university level student, you are expected to use appropriate references
throughout and keep carefully detailed notes of all your sources of materials for material you have used in
your work, including any material downloaded from the Internet. Please consult the relevant unit lecturer or
your course tutor if you need any further advice.
Student Declaration
I certify that the assignment submission is entirely my own work and I fully understand
the consequences of plagiarism. I understand that making a false declaration is a form of
malpractice.
Student signature:
pearson Education 2018 Higher
Education Qualification
Date:
Rohit shah (Second Semester Sec-F)
2
Website Design &Development 2021
Contents
Assignment Task – Part 1 ...................................................................................................................... 6
Introduction to Web Technology and Websites: ................................................................................... 7
Web: ....................................................................................................................................................... 7
Website: ................................................................................................................................................. 7
Web pages: ............................................................................................................................................. 7
Types of Websites: ................................................................................................................................. 7
Purpose of Domains: ............................................................................................................................ 18
Server Hardware: ................................................................................................................................. 20
Operating systems: ............................................................................................................................... 21
Web Server: ......................................................................................................................................... 22
Back-end web development: ................................................................................................................ 26
Differences between front end and back-end website technologies .................................................... 28
Website technology related to the presentation and application layer:................................................ 29
online website creation tools and custom-built sites: ...................................................................... 30
Comparison between online web creation tools and custom build sites: ....................................... 30
Assignment Task – Part 2 .................................................................................................................... 32
Design document for a branded, multipage website with medium fidelity wireframes and full set
of client and user requirements: ........................................................................................................ 33
Wireframes:.......................................................................................................................................... 33
Wireframe of Homepage: .................................................................................................................... 33
Wireframe of Login Page..................................................................................................................... 34
Wireframe of About US page .............................................................................................................. 34
Wireframe of Contact Us page ............................................................................................................ 35
Wireframe of Change the password ..................................................................................................... 36
Wireframe of Cancel Seat .................................................................................................................... 37
Wireframe of Footer ............................................................................................................................ 38
Rohit shah (Second Semester Sec-F)
3
Website Design &Development 2021
BookTicket:.......................................................................................................................................... 39
Case Tools and Techniques used: ..................................................................................................... 41
HTML: ................................................................................................................................................ 41
CSS: ..................................................................................................................................................... 42
JavaScript: ........................................................................................................................................... 42
MySQL:............................................................................................................................................... 42
Sublime Text: ...................................................................................................................................... 43
Design of the website of Bus transportation: ....................................................................................... 43
Query: .................................................................................................................................................. 44
Html-Code: ......................................................................................................................................... 44
PHP-code: ........................................................................................................................................... 45
Html code: ............................................................................................................................................ 46
Php Code: ............................................................................................................................................. 46
CSS code: ............................................................................................................................................. 47
Query: .................................................................................................................................................. 47
Html code: ............................................................................................................................................ 49
JavaScript code: ................................................................................................................................... 50
Php: ...................................................................................................................................................... 50
Html code: ............................................................................................................................................ 52
CSS: ..................................................................................................................................................... 53
Php: ...................................................................................................................................................... 54
JavaScript: ............................................................................................................................................ 54
Query: .................................................................................................................................................. 54
Html code: ............................................................................................................................................ 55
CSS code: ............................................................................................................................................. 56
Php: ...................................................................................................................................................... 56
Query.................................................................................................................................................... 56
Rohit shah (Second Semester Sec-F)
4
Website Design &Development 2021
Html code: ............................................................................................................................................ 58
JavaScript: ............................................................................................................................................ 58
Php code: .............................................................................................................................................. 58
Query: .................................................................................................................................................. 59
Html code: ............................................................................................................................................ 59
CSS code: ............................................................................................................................................. 60
Php code: .............................................................................................................................................. 60
Javascript: ............................................................................................................................................ 61
Php: ...................................................................................................................................................... 61
Html: .................................................................................................................................................... 62
Html code: ............................................................................................................................................ 62
Php code: .............................................................................................................................................. 62
Query: .................................................................................................................................................. 63
- Create test log .................................................................................................................................... 63
Bibliography ........................................................................................................................................ 74
Rohit shah (Second Semester Sec-F)
5
Website Design &Development 2021
Assignment Task – Part 1
1. Prepare a report identifying purpose and types of DNS along with how domain names are organized
and managed. You should also explain the purpose and relationships between communication
protocols, server hardware, operating systems and web server software with regards to web designing,
publishing and accessing a website. Your report should also contain the influence of search engines on
website performance along with website crawling, indexing and ranking and provide evidence-based
support for improving site’s index value and rank through search engine optimization.
2. Write an article evaluating the impact of common web development technologies and frameworks
with regards to website design, functionality and management. Also, explain the capabilities and
relationships between front-end and back-end website technologies along with their relation to
presentation and application layers. You should point out the differences between online website
creation and custom-built sites with regards to design flexibility, performance, functionality, user
experience (UX) and user interface (UI).
3. Evaluate a range of tools and techniques available to design and develop a custom-built website
along with justification to the tools and techniques chosen to realize a custom-built website
Rohit shah (Second Semester Sec-F)
6
Website Design &Development 2021
Introduction to Web Technology and Websites:
Web:
The Web, or World Wide Web (W3), is basically a system of Internet servers that support specially
formatted documents. The documents are formatted in a markup language called HTML (Hypertext
Markup Language) that supports links to other documents, as well as graphics, audio, and video files.
The world wide web, or web for short, are the pages you see when you're at a device and you're online.
But the internet is the network of connected computers that the web works on, as well as what emails
and files travel across. The world wide web contains the things you see on the roads like houses and
shops.
Website:
A website is a collection of publicly accessible, interlinked Web pages that share a single domain
name. Websites can be created and maintained by an individual, group, business or organization to
serve a variety of purposes A website is a collection of linked web pages (plus their associated
resources) that share a unique domain name. Each web page of a given website provides explicit
links—most of the time in the form of clickable portion of text-that allow the user to move from one
page of the website to another (John, 2020).
Web pages:
web page. A document which can be displayed in a web browser such as Firefox, Google Chrome,
Opera, Microsoft Internet Explorer or Edge, or Apple's Safari. These are also often called just "pages."
website. Often called a "web site" or a "site." A web page is often used to provide information to
viewers, including pictures or videos to help illustrate important topics. A web page may also be used
as a method to sell products or services to viewers. Multiple web pages make up a website, like our
Computer Hope website.
Types of Websites:
•
Static website
•
Dynamic Website
Rohit shah (Second Semester Sec-F)
7
Website Design &Development 2021
•
Static website
A static website is the most basic type of website and contains web pages with fixed content. Each
page is coded in HTML and displays the same information to every user. Examples of static web page
include about us page with a corporate website, mission, vision etc. A Static Website (sometimes called
a flat or stationary page) is displayed in a web browser exactly as it is stored. It contains web pages
with fixed content coded in HTML and stored on a web server. It does not change, it stays the same,
or "static" for every viewer of the site.
Figure 1Static Website
•
Dynamic Website
A dynamic website is a website that displays different types of content every time a user view it. This
display changes depending on a number of factors like viewer demographics, time of day, location,
language settings, and so on. A dynamic website, on the other hand, is one that can display different
content and provide user interaction, by making use of advanced programming and databases in
addition to HTML. If the content of a site is stored in a database and pulled for display on pages on
demand, dynamic URLs maybe used. In that case the site serves basically as a template for the content.
Usually, a dynamic URL would look something like this: http://code.google.com/p/google-checkoutphp-sample-code/issues/detail?id=31.
Rohit shah (Second Semester Sec-F)
8
Website Design &Development 2021
Figure 2Dynamic websites
How does web Technology work?
The browser sends an HTTP request message to the server, asking it to send a copy of the website to
the client (you go to the shop and order your goods). This message, and all other data sent between the
client and the server, is sent across your internet connection using TCP/IP. Web technology refers to
the means by which computers communicate with each other using markup languages and multimedia
packages. It gives us a way to interact with hosted information, like websites. Web technology involves
the use of hypertext markup language (HTML) and cascading style sheets (CSS).
Rohit shah (Second Semester Sec-F)
9
Website Design &Development 2021
Figure 3Web Technology
Domain name:
A domain name is your website name. A domain name is the address where Internet users can access
your website. A domain name is used for finding and identifying computers on the Internet. Because
of this, domain names were developed and used to identify entities on the Internet rather than using IP
addresses. A domain name can be any combination of letters and numbers, and it can be used in
combination of the various domain name extensions, such as .com, .net and more. The domain name
must be registered before you can use it. Every domain name is unique. No two websites can have the
same domain name. If someone types in www.yourdomain.com, A domain name is an essential part
of having a website, but it's only part of the equation. In order to launch a website, you'll also need
content and a hosting service to store your files so they can be accessed on the internet. Remember
that owning a domain does not mean hosting is also included.
Domain name system:
The Domain Name System (DNS) is the Internet's system for mapping alphabetic names to numeric
Internet Protocol (IP) addresses like a phone book maps a person's name to a phone number. Using the
www.example.com URL, example.com is the domain name, and www is the hostname. The Domain
Rohit shah (Second Semester Sec-F)
10
Website Design &Development 2021
Name System (DNS) is the phonebook of the Internet. Web browsers interact through Internet Protocol
(IP) addresses. DNS translates domain names to IP addresses so browsers can load Internet resources.
Each device connected to the Internet has a unique IP address which other machines use to find the
device.
Purpose of Domain name System
The purpose of DNS is to translate a domain name into the appropriate IP address. This is done by
looking up the dns records of the requested domain. DNS is such an integral part of the internet that
it’s important to understand how it works. Think of DNS like a phone book, but instead of mapping
people’s names to their street address, the phone book maps computer names to IP addresses. Each
mapping is called a “DNS record.” DNS clients on connected devices reach out to DNS servers to
retrieve these records. Different record types are used for different purposes. Web browsers rely on an
“A” type record, while the “MX” record points the direction towards a mail server. This is how it’s
possible to host a website with one service provider and email service at another.
Figure 4Domain name system
Rohit shah (Second Semester Sec-F)
11
Website Design &Development 2021
Types of Domains:
•
Top-Level Domains (TLDs) Each website's URL can be broken down into different parts.
•
Generic Top-Level Domain (gTLD)
•
Second-Level Domain (SLD)
•
Third-Level Second-Level Domain.
•
Premium Domain.
•
Network Domain
Top level Domain:
A top-level domain (TLD) is the part of a domain that comes after the dot, for example, com, org or
net. Generally, you can divide TLDs into two types: Generic top-level domains (gTLD) - Roughly all
domains that are not associated with a country. The most known are com, org and net. In the DNS
hierarchy, a top-level domain (TLD) represents the first stop after the root zone. In simpler terms, a
TLD is everything that follows the final dot of a domain name. For example, in the domain name
'google.com', '.com' is the TLD.
Working:
In the DNS hierarchy, a top-level domain (TLD) represents the first stop after the root zone. In simpler
terms, a TLD is everything that follows the final dot of a domain name. For example, in the domain
name 'google.com', '.com' is the TLD. Some other popular TLDs include '. A top-level domain (TLD)
is the part of a domain that comes after the dot, for example, com, org or net. Generally, you can divide
TLDs into two types: Generic top-level domains (gTLD) - Roughly all domains that are not associated
with a country. The most known are com, org and net.
Rohit shah (Second Semester Sec-F)
12
Website Design &Development 2021
Generic Top-Level Domain (gTLD)
Generic top-level domains (gTLDs) are one of the categories of top-level domains (TLDs) maintained
by the Internet Assigned Numbers Authority (IANA) for use in the Domain Name System of the
Internet. A top-level domain is the last level of every fully qualified domain name. A generic domain
is a name that defines a general category, rather than a specific or personal instance, for example, the
name of an industry, rather than a company name. Some examples of generic names are books.com,
music.com, and travel.info.
Working:
A Generic top-level domain (gTLD) is an internet domain name extension with three or more
characters. It is one of the categories of the top-level domain (TLD) in the Domain Name System
(DNS) maintained by the Internet Assigned Numbers Authority. net gTLD was originally intended for
tech-based companies and industries. It's frequently used for websites that advertise, promote, and sell
web-based services. Since fewer. net domain names have been registered than .com domain names,
companies or individuals have a higher chance of securing the. A generic domain is a name that defines
a general category, rather than a specific or personal instance, for example, the name of an industry,
rather than a company name. Some examples of generic names are books.com, music.com, and
travel.info.
•
Second-Level Domain (SLD)
Rohit shah (Second Semester Sec-F)
13
Website Design &Development 2021
A second-level domain is the part of a domain name or website address that comes before the toplevel domain (tld). A Second Level Domain (SLD) is the part of the domain name that is located
right before a Top-Level Domain (TLD). For example, in mozilla.org the SLD is Mozilla and the
TLD is org. A domain name is not limited to a TLD and an SLD. In simple terms, a second level
domain is the name just to the left of the domain extension, the .com or. net. The website
example.com was reserved for explaining the relationship between top-level domains (TLDs) and
second level domains (SLDs).
Working:
The second-level domain often plays this role; for example, in a domain name like "google.com,"
the word "google," as the second-level domain, is where domain holders put the brand name,
project name, organization name or other familiar identifier for users.
Figure 5Second level domain
•
Premium Domain.
A premium domain name is a high-quality domain that investors often buy and sell with the aim of
making a profit. These names have a variety of qualities that allow them to outperform others in the
key function of a domain, helping users find the website they're looking for. Premium domain names
are more expensive than other domain names because of what they bring to a website.This positive
Rohit shah (Second Semester Sec-F)
14
Website Design &Development 2021
history means a premium domain name has a higher page ranking in search engines and brings more
organic traffic to your website.
Working:
A premium domain name is a high-quality domain that investors often buy and sell with the aim of
making a profit. These names have a variety of qualities that allow them to outperform others in the
key function of a domain, helping users find the website they're looking for. To register a premium
domain name, you will first have to locate the owner and negotiate a selling price. Once you agree
upon a price, you need to transfer the domain name so you can link it to your web hosting platform.
There are a few ways you can check through these taken domain names to see if any of them are
available for purchase. The best names are listed as Premiums and you can search them specifically at
Name.com: Go to the Premium Domain page. Select the Premium Domains tab about the search bar.
Figure 6Premium Domain
Network Domain:
A network domain is an administrative grouping of multiple private computer networks or local hosts
within the same infrastructure. Domains can be identified using a domain name; domains which need
to be accessible from the public Internet can be assigned a globally unique name within the Domain
Name System (DNS). A domain has a domain controller that governs all basic domain functions and
Rohit shah (Second Semester Sec-F)
15
Website Design &Development 2021
manages network security. Thus, a domain is used to manage all user functions, including
username/password and shared system resource authentication and access.
Working:
Windows domains provide network administrators with a way to manage a large number of PCs and
control them from one place. One or more servers known as domain controllers have control over the
domain and the computers on it. Domains are generally made up of computers on the same local
network. When referring to an Internet address or name, a domain or domain name is the location of a
website. For example, the domain name "google.com" points to the IP address "216.58. 216.164".
Generally, it's easier to remember a name rather than a long string of numbers.
Figure 7Network Domain
There are Different Types Domain are as follows:
Generic Domain Name
Domain Name
Purpose/Meaning
.com
For Commercial
Rohit shah (Second Semester Sec-F)
16
Website Design &Development 2021
.edu
For education
.net
For network organization
.gov
For Government organization
.org
For non-profit organization
.com: If the domain you want is available with .com, it's usually worthy using it, because it's a safe,
reliable, and trusted option. However, if it isn't available, or if you want something different, you have
plenty of TLD options that are easy to remember and have their own unique advantages.com domain
highlights the credibility of your brand. Search engines sometimes prefer .com more than any other
domain. 46% of website use a .com domain name. Having .com shows that your well-established
company. ... The .com has no any specific requirements related to TLDs.
.edu: "edu" is one of the top-level domain names that can be used when choosing a domain name. It
generally describes the entity owning the domain name as a four-year college or similar educational
institution. edu domain is one of the seven generic top-level domains created originally in the Internet's
Domain Name System (DNS). Edu is short for “education” since it was created for the U.S. educational
and academic institutions such as universities, colleges, or research institutions.
.gov: gov domain name to serve the public on the internet, they make it easy to know that their services
are official. That's because every request for a. gov domain name is carefully examined by the DotGov
program to ensure it is from a genuine U.S.-based government or public sector organization.
.org: The domain name org is a generic top-level domain (gTLD) of the Domain Name System (DNS)
used on the Internet. The name is truncated from organization. t is commonly used by non-profit
Rohit shah (Second Semester Sec-F)
17
Website Design &Development 2021
organizations, open-source projects, and communities, but is an open domain that can be used by
anyone.
.np: .np domain is the Internet country code top-level domain (ccTLD) for Nepal. Domain registrations
under. NP ccTLD is free of cost and are registered on a first-come-first-serve basis but terms and
conditions apply.
Purpose of Domains:
.com:
. Com is the only domain that shows the site is authentic and credible. As a site owner, if you see any
brand with .com domain name, it automatically brings credibility to the site. If the domain you want
is available with .com, it's usually worthy using it, because it's a safe, reliable, and trusted option.
However, if it isn't available, or if you want something different, you have plenty of TLD options that
are easy to remember and have their own unique advantages.com domain highlights the credibility of
your brand. Search engines sometimes prefer .com more than any other domain. 46% of website use
a .com domain name. Having .com shows that your well-established company. ... The .com has no any
specific requirements related to TLDs.
.edu:
"edu" is one of the top-level domain names that can be used when choosing a domain name. It generally
describes the entity owning the domain name as a four-year college or similar educational institution.
edu domain is one of the seven generic top-level domains created originally in the Internet's Domain
Name System (DNS). Edu is short for “education” since it was created for the U.S. educational and
academic institutions such as universities, colleges, or research institutions.
.gov:
gov domain name to serve the public on the internet, they make it easy to know that their services are
official. That's because every request for a. gov domain name is carefully examined by the DotGov
program to ensure it is from a genuine U.S.-based government or public sector organization. "gov" is
Rohit shah (Second Semester Sec-F)
18
Website Design &Development 2021
one of the top-level domain names that can be used when choosing a domain name. It generally
describes the entity owning the domain name as a branch or an agency of the U.S. Federal government.
(Other U.S. government levels are encouraged to use the geographic top-level domain name of "us".)
.np:
.np domain is the Internet country code top-level domain (ccTLD) for Nepal. Domain registrations
under. NP ccTLD is free of cost and are registered on a first-come-first-serve basis but terms and
conditions apply.
Communication protocol:
A communications protocol is a set of formal rules describing how to transmit or exchange data,
especially across a network. A standardized communications protocol is one that has been codified as
a standard. A communication protocol is a system of rules that allows two or more entities of a
communications system to transmit information via any kind of variation of a physical quantity. The
protocol defines the rules, syntax, semantics and synchronization of communication and possible error
recovery methods.
Types of protocols:
1. File Transfer Protocol (FTP): FTP allows users to transfer files from one machine to another. Types
of files may include program files, multimedia files, text files, and documents, etc. FTP means "File
Transfer Protocol" and refers to a group of rules that govern how computers transfer files from one
system to another over the internet. Businesses use FTP to send files between computers, while
websites use FTP for the uploading and downloading of files from their website's servers.
2. Simple mail transport Protocol (SMTP): SMTP is designed to send and distribute outgoing E-Mail.
The Simple Mail Transfer Protocol (SMTP) is used for sending and receiving e-mail between e-mail
clients and servers. When an SMTP server receives an e-mail from a mail client, the SMTP server
will then check the MX records for the domain in the e-mail address in order to exchange the mail
with the remote SMTP server.
3. Hyper Text Transfer Protocol (HTTP): HTTP is designed for transferring a hypertext among two or
more systems. HTML tags are used for creating links. These links may be in any form like text or
images. HTTP is designed on Client-server principles which allow a client system for establishing a
Rohit shah (Second Semester Sec-F)
19
Website Design &Development 2021
connection with the server machine for making a request. The server acknowledges the request
initiated by the client and responds accordingly.
4. Hyper Text Transfer Protocol Secure (HTTPS): HTTPS is abbreviated as Hyper Text Transfer
Protocol Secure is a standard protocol to secure the communication among two computers one using
the browser and other fetching data from web server. HTTP is used for transferring data between the
client browser (request) and the web server (response) in the hypertext format, same in case of
HTTPS except that the transferring of data is done in an encrypted format. So, it can be said that https
thwart hackers from interpretation or modification of data throughout the transfer of packets.
5. Pop3: POP3 is a one-way client-server protocol in which email is received and held on the email
server. The "3" refers to the third version of the original POP protocol. A recipient or their email
client can download mail periodically from the server using POP3.
Server Hardware:
Item
Web
server Web
(minimal)
server Combined Web & Combined Web &
(recommended)
Database
Server Database
Server
(minimal)
(recommended)
Processor
1,6 GHz CPU
2 x 1,6 GHz CPU
2 x 1,6 GHz CPU
4 x 1,6 GHz CPU
RAM
1,75 GB RAM
3,5 GB RAM
3,5 GB RAM
7 GB RAM
HDD
1x 40 GB of free space or more is recommended for the Travel data (non-system
drive
is
preferred)
1x 40 GB of free space or more is recommended for the software that is listed in
the software requirements (system drive)
Recommended
Microsoft
Virtual
Azure
Machine
Basic Small VM Basic Medium VM Basic Medium VM
Basic Large VM
Configuration
There is no official minimum for the hardware requirements that are needed to host the Travel. The
hardware specifications will change under the influence of different factors that should be taken into
account. To make the best estimation of the hardware specifications for the web and database server
where Sana Commerce will be hosted the following questions should be answered: High-traffic or
low-traffic Travel Number of visitors per day/month Maximum number of simultaneous visitors
Rohit shah (Second Semester Sec-F)
20
Website Design &Development 2021
Maximum number of order lines in the shopping basket Number of simultaneous orders Size and
complexity of the products catalog (number of products, product categories, attributes) Number of
articles in the Travel Number of search queries Size of the database These are only those questions
that should be considered first of all to make a more precise estimation regarding the hardware
requirements that are needed for hosting and management of the Sana Commerce Travel. However,
you should also take into account the software that is listed in the software requirements and should
be installed on the server. This leads to the extra hardware requirements that should be also taken into
account.
Operating systems:
An Operating System (OS) is an interface between a computer user and computer hardware. An
operating system is a software which performs all the basic tasks like file management, memory
management, process management, handling input and output, and controlling peripheral devices such
as disk drives and printers. Microsoft Windows, also called Windows and Windows OS, computer
operating system (OS) developed by Microsoft Corporation to run personal computers (PCs).
Featuring the first graphical user interface (GUI) for IBM-compatible PCs, the Windows OS soon
dominated the PC market. Apple's newest Mac operating system is macOS 12.0, also known as macOS
Monterey. This is the eighteenth major release of the Mac operating system. macOS 12.0 Monterey
drops support for some Macs that ran macOS 11.0 Big Sur. Choose Apple menu
> About This Mac.
This opens an overview of your Mac, including your Mac model, processor, memory, serial number,
and version of macOS. To see the greater detail provided by the System Information app, click the
System Report button. Linux® is an open-source operating system (OS). An operating system is the
software that directly manages a system's hardware and resources, like CPU, memory, and storage.
The OS sits between applications and hardware and makes the connections between all of your
software and the physical resources that do the work. From its very inception, security has been a
cornerstone of the Linux operating system. Each user has to be walled off from others, and a password
and user ID are required for an individual to use Linux. Users also have lower automatic access rights,
which makes it harder for them to perpetuate the spread of malware by accessing a wide range of files
on the computer. The open source format with many different operating environments, system
architectures, and components — such as different email clients — also makes it more difficult for
malware to sweep through it.
Rohit shah (Second Semester Sec-F)
21
Website Design &Development 2021
Figure 8Operating System
Web Server:
A web server is software and hardware that uses HTTP (Hypertext Transfer Protocol) and other
protocols to respond to client requests made over the World Wide Web. The main job of a web server
is to display website content through storing, processing and delivering webpages to users. A web
server is a computer hosting one or more websites. "Hosting" means that all the web pages and their
supporting files are available on that computer. The web server will send any web page from the
website it is hosting to any user's browser, per user request. A web server is also known as an
Internet Server. A web server consists of a physical server, server operating system (OS) and
software used to facilitate HTTP communication. A web server helps in running a website
by returning HTML files over an HTTP connection. Web server is an integral part of internet
and it serves many purposes. The main purpose of web server is to serve email, download
requests for file transfer protocol (FTP) files, and building and publishing Web pages. The
web servers work well combined with the operating system and other servers. Moreover, the
web servers have the ability to handle server-side programming, security characteristics, and
the particular publishing, search engine and site building tools that come with. Apache web
server is the popular and widely used web server which is an open-source software and can
be installed on almost all operating systems including Linux, UNIX, Windows, FreeBSD,
Mac OS X and more. About 60% of the web server machines run the Apache Web Server.
Therefore, it can be said that web server is an integral software that respond to the request by
web clients for web resources.
Rohit shah (Second Semester Sec-F)
22
Website Design &Development 2021
Figure 9Web server
Front End Developer:
A front-end developer is a type of computer programmer that codes and creates the visual front-end
elements of a software, application or website. He or she creates computing components/features that
are directly viewable and accessible by the end user or client. A front-end developer has one general
responsibility: to ensure that website visitors can easily interact with the page. They do this through
the combination of design, technology and programming to code a website's appearance, as well as
taking care of debugging. Front end development manages everything that users visually see first in
their browser or application. You manage what people first see in their browser. As a front-end
developer, you are responsible for the look, feel and ultimately design of the site. Front-end developers
are responsible for a website's user-facing code and the architecture of its immersive user experiences.
In order to execute those objectives, front-end devs must be adept at three main languages: HTML,
CSS, and Javascript programming.
Html:
HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the
meaning and structure of web content. Other technologies besides HTML are generally used to
describe a web page's appearance/presentation (CSS) or functionality/behavior (JavaScript). HTML
(Hypertext Markup Language) is the code that is used to structure a web page and its content. For
example, content could be structured within a set of paragraphs, a list of bulleted points, or using
images and data tables. HTML Multiple choice questions (MCQ's) Explanation: HTML is an acronym
that stands for HyperText Markup Language, which is used for creating web pages and web
Rohit shah (Second Semester Sec-F)
23
Website Design &Development 2021
applications. A markup language is a computer language that is used to apply layout and formatting
conventions to a text document.
Examples:
Figure 10HTML codes in Sublime
CSS:
CSS stands for Cascading Style Sheet. CSS can format the document content (written in HTML or
other markup language) and CSS is the language for describing the presentation of Web pages,
including colors, layout, and fonts. It allows one to adapt the presentation to different types of devices,
such as large screens, small screens, or printers. CSS is independent of HTML and can be used with
any XML-based markup language. It is a style sheet language which is used to describe the look and
formatting of a document written in markup language. It provides an additional feature to HTML. It is
generally used with HTML to change the style of web pages and user interfaces. CSS stands for
Cascading Style Sheets with an emphasis placed on “Style.” While HTML is used to structure a web
document (defining things like headlines and paragraphs, and allowing you to embed images, video,
and other media), CSS comes through and specifies your document's style—page layouts, colors, and
fonts. What is CSS explain the features of CSS? CSS allows users to view documents with their own
preferred fonts, colors, etc. by specifying them in a user style sheet. CSS provides support for
Rohit shah (Second Semester Sec-F)
24
Website Design &Development 2021
automatically generated numbers, markers, and other content that can help users stay oriented within
a document.
Examples:
Figure 11CSS codes in Sublime
Javascript:
JavaScript is a dynamic programming language that's used for web development, in web applications,
for game development, and lots more. It allows you to implement dynamic features on web pages that
cannot be done with only HTML and CSS It is well-known for the development of web pages, many
non-browser environments also use it. JavaScript can be used for Client-side developments as well as
Server-side developments. JavaScript is a text-based programming language used both on the clientside and server-side that allows you to make web pages interactive. Incorporating JavaScript improves
the user experience of the web page by converting it from a static page into an interactive one. To
recap, JavaScript adds behavior to web pages. JavaScript is commonly used for creating web pages. It
Rohit shah (Second Semester Sec-F)
25
Website Design &Development 2021
allows us to add dynamic behavior to the webpage and add special effects to the webpage. On websites,
it is mainly used for validation purposes. JavaScript helps us to execute complex actions and also
enables the interaction of websites with visitors.
Examples:
Figure 12Javascript codes in Sublime
Back-end web development:
Backend Development is also known as server-side development. It is everything that the users don't
see and contains behind-the-scenes activities that occur when performing any action on a website. It
focuses primarily on databases, backend logic, APIs, and Servers. Thus, it is known as the backend .
The back- end of a website consists of a server, an application, and a database. A back-end developer
builds and maintains the technology that powers those components which, together, enable the userfacing side of the website to even exist in the first place.
Php:
Rohit shah (Second Semester Sec-F)
26
Website Design &Development 2021
PHP (Hypertext Preprocessor) is known as a general-purpose scripting language that can be used to
develop dynamic and interactive websites. It was among the first server-side languages that could be
embedded into HTML, making it easier to add functionality to web pages without needing to call
external files for data. PHP is a server-side scripting language that is embedded in HTML. It is used
to manage dynamic content, databases, session tracking, even build entire e-commerce sites. It is
integrated with a number of popular databases, including MySQL, PostgreSQL, Oracle, Sybase,
Informix, and Microsoft SQL Server. PHP is acronym of Hypertext Preprocessor (PHP) is a
programming language that allows web developers to create dynamic content that interacts with
databases. PHP is basically used for developing web-based software applications.
Examples:
Figure 13Php code in subline code
Mysql:
MySQL is an open-source relational database management system (RDBMS). A relational database
organizes data into one or more data tables in which data types may be related to each other; these
relations help structure the data. MySQL is a relational database management system based on SQL –
Structured Query Language. The application is used for a wide range of purposes, including data
warehousing, e-commerce, and logging applications. The most common use for mysql however, is for
Rohit shah (Second Semester Sec-F)
27
Website Design &Development 2021
the purpose of a web database. MySQL is a relational database management system (RDBMS)
developed by Oracle that is based on structured query language (SQL). A database is a structured
collection of data. It may be anything from a simple shopping list to a picture gallery or a place to hold
the vast amounts of information in a corporate network. One of the reasons MySQL is the world's most
popular open-source database is that it provides comprehensive support for every application
development need. MySQL also provides connectors and drivers (ODBC, JDBC, etc.) that allow all
forms of applications to make use of MySQL as a preferred data management server.
Examples:
Differences between front end and back-end website technologies
S. N
Front-End
Back-End
1.
Front end development is programming
Back-end development focuses on the side of a
which focuses on the visual elements of a website user can't see (the server side).
website or app that a user will interact
with (the client side)
2.
It is the part of the website users can see It constitutes everything that happens behind the
and interact with.
Rohit shah (Second Semester Sec-F)
scenes.
28
Website Design &Development 2021
3.
It typically includes everything that It generally includes a web server that
attributes to the visual aspect of websites. communication with a database to server
requests that the frontend presents.
4.
It forms the basis of what users can touch It is the brain of the website that is never visible
and experience on their web browser.
5.
The
essential
of
Front-End
to the end users.
web The essential of Back-end web development
development includes HTML, CSS, and includes Java, Python .Net and Ruby.
JavaScript.
Website technology related to the presentation and application layer:
The frontend of a website is the part that is presented to the user; the parts that you see and interact
with when you browse the web. The backend is the technology behind that presentation layer that
makes everything work, i.e., the server, application and database. The presentation layer is the lowest
layer at which application programmers consider data structure and presentation, instead of simply
sending data in the form of datagrams or packets between hosts. What is presentation and application
layer? The Application Layer (which is the highest layer in the OSI model) makes available network
services to actual software application programs. The presentation layer is responsible for formatting
and converting data and ensuring that the data is presentable for one application through the network
to another application. The Presentation Layer is the front-end layer of the application. Its main
component is a graphical user interface (GUI) that allows users to interact with the application,
accessing its functions and services. The application layer is used by end-user software such as web
browsers and email clients. It provides protocols that allow software to send and receive information
and present meaningful data to users. The four big players (in terms of technology) in the presentation
layer are as follows: HTML. CSS. JavaScript. And the (in terms of technology) in the application layer
are as follows: Php c# mysql and so on. Presentation only visible the designs part and hence the Back
end part is hidden the Application layer.
Rohit shah (Second Semester Sec-F)
29
Website Design &Development 2021
Figure 14Web Technology
online website creation tools and custom-built sites:
Comparison between online web creation tools and custom build sites:
Online Web Creation tools
Custom Built Sites
Design Flexibility:
The online website building tools gives a generic With custom built sites, uniqueness can be maintained
website template for the user. The same design, layouts as the new design, layout and themes can be created as
and themes are used by many users thus, there is no per the requirements of the website. That’s why this
uniqueness. Also, the activities are limited that’s why approach is considered flexible and activities can be
this approach is not considered as flexible.
customized as per the requirement.
Performance:
Rohit shah (Second Semester Sec-F)
30
Website Design &Development 2021
The online website creation tools provide pre-built In case of custom built websites, more time is needed to
websites themes that can be edited and customized make the website ready but the custom built website
within the frame of the website. This helps to design allow developers to optimize the site and provide a
the website in less time and easily with built-in better ranking than online built websites.
functions. However, the webpage loading speed and
thus SEO performance are comparatively low.
Functionality:
There is limitation in graphic design and navigation However, in custom built website, there is no limitation
capability. Similarly, adding custom applications or in graphics and functionalities can be added as per the
functionalities is difficult or impossible.
needs.
User Experience (UX):
Since the functionality are limited in online built However, the custom built sites are developed with the
website tools, the user’s needs and expectations are not continuous feedbacks and involvement of users and
satisfied. Not all the functionalities are present in the thus, their requirements and expectations are met. All
built-in tools and also they might not be
the designs and functionalities are added as per
compatible with the server.
the desire of the users.
User Interface (UI):
In case of online built websites, the user interaction is In case of custom built websites, there is direct
very less with the GUI of the website as the website is involvement of users from the beginning to the
designed using free templates and the functionalities deployment of the website.
are pre-built so, there is not much interaction with the
users about the website.
Other differences are:
This approach is relatively cheaper.
More expensive as various functionalities are to be
added.
The time for development of website is relatively
The time for development of custom websites is
less.
relatively high as everything needs to be customized.
Rohit shah (Second Semester Sec-F)
31
Website Design &Development 2021
Assignment Task – Part 2
1. From the requirements above create a proposal document for the multipage website with fidelity
wireframes with full set of client and user requirements. This must be convincing to them and should
contain exactly what they want.
2. After the requirements specification phase, develop a website with above all functionalities. The
website must contain at least 10 web pages. Should have the CRUD functionality i.e. create, retrieve,
update and delete.
3. Finally, write a report comparing the multipage website created to the design document and critically
evaluate the design and development process against your design document analyzing any technical
challenges.
4. Create a suitable test plan to test your developed website identifying key performance areas and use
it to review the overall functionality and performance of the website. Evaluate the Quality Assurance
(QA) process and review how it was implemented during your design and development stages and
finally critically evaluate the result of your test plan and include the review of the overall success of
your website, use this to explain any areas of success and provide justified recommendations for areas
that require improvement.
Rohit shah (Second Semester Sec-F)
32
Website Design &Development 2021
Design document for a branded, multipage website with medium fidelity wireframes
and full set of client and user requirements:
Wireframes:
Wireframing is a way to design a website service at the structural level. A wireframe is commonly
used to layout content and functionality on a page which takes into account user needs and user
journeys. Wireframes serve multiple purposes by helping to: Connect the site's information
architecture to its visual design by showing paths between pages. Clarify consistent ways for
displaying particular types of information on the user interface. Determine intended functionality in
the interface. A wireframe is a schematic or blueprint that is useful for helping you, your programmers
and designers think and communicate about the structure of the software or website you're building.
Developers use wireframes to get a more tangible grasp of the site's functionality, while designers use
them to push the user interface (UI) process. User experience designers and information architects use
wireframes to show navigation paths between pages.
Wireframe of Homepage:
A website wireframe is a visual prototype of a web page that focuses on content, layout, and behavior.
A wireframe is constructed using basic boxes, lines, and other shapes to create an outline of the
functional parts of a web page without wasting time creating an intricate, polished design. There is no
any cascading color design need of wireframes. In the Homepage Introduction of the Bus reservation
of the home page and so on.
Rohit shah (Second Semester Sec-F)
33
Website Design &Development 2021
Wireframe of Login Page
After clicking on login button a user can login with the username and password. If the username and
password are correct then the dashboard will be appearing otherwise it display Username or Password
are incorrect.
Figure 15Wireframes of Login.
Wireframe of About US page:
In this page header and footer are same as a Homepage but the content is different and before the
content page, we are able to see a text which is moving from right to left.
Rohit shah (Second Semester Sec-F)
34
Website Design &Development 2021
Figure 16Wireframes of About.
Wireframe of Contact Us page:
In this page header and footer are same as a Homepage but in the content phase you will get a Google
map where the Travel is located.
Rohit shah (Second Semester Sec-F)
35
Website Design &Development 2021
Figure 17Wireframes of Contact.
Wireframe of Change the password:
After clicking on login button a user can login with the username and password. Then you see that
Change the password of the Users like that and here like fill up the forms Old password means that
you had set in previous password of the users and then you will written New password of the users
and again save you and you will written in Confirm Password the Finally You change the password.
Figure 18Wireframes of Changes the Password.
Wireframe of Banner:
After clicking on login button a user can login with the username and password. Now, you can see that
Change the Banner enter the new page where you can see that Upload New banner here you can click
the Choose File and now you upload where is the banner of the Travel and select the Banner and now,
You can upload the new banner of the travel.
Rohit shah (Second Semester Sec-F)
36
Website Design &Development 2021
Figure 19Wireframes of Banner.
Wireframe of Cancel Seat:
After clicking on login button a user can login with the username and password. Now, you can see The
Cancel the seat press the Cancel the seat and you enter next page i.e. Cancel seat where there is id,
Destination Id Seat Number Book date and Cancel Button of the following items. If you are selecting
number 7, 5,10,25,27 and son on end time you can decide you can cancel the following number where
you can select number 15number will be cancel and click the Cancel Button the Ticket will be Cancel
Successfully.
Rohit shah (Second Semester Sec-F)
37
Website Design &Development 2021
Figure 20Wireframes of Cancel The Seat.
Wireframe of Footer:
After clicking on login button a user can login with the username and password. Now, you can see
Change the Footer and click the button. And you can Go to the next page Footer Page and here like
You can see Discription and Their message Whatever you want Discription of related or whatever you
want discription and save the description that description display all the page like contact Homepage
About Book Ticket And So on.
Rohit shah (Second Semester Sec-F)
38
Website Design &Development 2021
Figure 21Wireframes of footer.
BookTicket:
After clicking the BookTicket There is display showing the content the Select the destination where
you want the destination Pokhara, Hetauda anywhere you want to do and now you can fill the forms
like your name Your contact, date, your address and now you can choose the seat and confirm the book
you can click the book button respectively and there is no cascading no color showing in the website.
Rohit shah (Second Semester Sec-F)
39
Website Design &Development 2021
Figure 22BookTicket
Dashboard:
A wireframe dashboard is essentially a pictorial representation of an actual admin dashboard that will
eventually be used to manage an application or its users. The dashboard wireframe itself is not fully
functional but a representation of the functionality that the actual dashboard will eventually contain. if
the username and password are correct then the dashboard will be appearing otherwise it display
Username or Password are incorrect and there is no cascading no color showing in the website.
Rohit shah (Second Semester Sec-F)
40
Website Design &Development 2021
Figure 23Dashboard
Case Tools and Techniques used:
CASE tools are software application programs, which are used for automating the website
development. CASE tools are used by project managers, analysts and engineers for the
development of the software system. Some of the types of CASE tools that we have used for
making this website are:
HTML:
HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the
meaning and structure of web content. Other technologies besides HTML are generally used to
describe a web page's appearance/presentation (CSS) or functionality/behavior (JavaScript). HTML
(Hypertext Markup Language) is the code that is used to structure a web page and its content. For
example, content could be structured within a set of paragraphs, a list of bulleted points, or using
images and data tables. HTML Multiple choice questions (MCQ's) Explanation: HTML is an acronym
that stands for HyperText Markup Language, which is used for creating web pages and web
Rohit shah (Second Semester Sec-F)
41
Website Design &Development 2021
applications. A markup language is a computer language that is used to apply layout and formatting
conventions to a text document.
CSS:
CSS stands for Cascading Style Sheet. CSS can format the document content (written in HTML or
other markup language) and CSS is the language for describing the presentation of Web pages,
including colors, layout, and fonts. It allows one to adapt the presentation to different types of devices,
such as large screens, small screens, or printers. CSS is independent of HTML and can be used with
any XML-based markup language. It is a style sheet language which is used to describe the look and
formatting of a document written in markup language. It provides an additional feature to HTML. It is
generally used with HTML to change the style of web pages and user interfaces. CSS stands for
Cascading Style Sheets with an emphasis placed on “Style.” While HTML is used to structure a web
document (defining things like headlines and paragraphs, and allowing you to embed images, video,
and other media), CSS comes through and specifies your document's style—page layouts, colors, and
fonts. What is CSS explain the features of CSS? CSS allows users to view documents with their own
preferred fonts, colors, etc. by specifying them in a user style sheet. CSS provides support for
automatically generated numbers, markers, and other content that can help users stay oriented within
a document.
JavaScript:
we have used JavaScript to view image, click function, validation which are very important while
developing a website. JavaScript is an object-based scripting language for website development.
The main reason behind using JavaScript is that it works with most of the browser and its main
purpose is to detect and react to instructions that happen as a document is being loaded, rendered
and used. Also, because it is the most common client-side language which is used to create rich,
dynamic web properties. It is already embedded in the latest versions of the popular browsers and
allows executables to run from the browser.
MySQL:
I have used MySQL for database of the website which is an Oracle-backed open source relational
database management system (RDBMS) based on Structured Query Language (SQL). The main
reason behind using MySQL is that it runs on virtually all platforms, including Linux, Unix and
Rohit shah (Second Semester Sec-F)
42
Website Design &Development 2021
Windows. Also, because MySQL is now the world’s most popular open-source database. MySQL
has become the leading database choice for web-based applications with its proven performance,
reliability and ease of use. MySQL is used by high profile web applications including Facebook,
Twitter, YouTube and many more. That is why we have used MySQL.
Sublime Text:
For development of my project of developing a website for Bus transportation as required
according to the context of scenario, we had used Sublime Text. Sublime Text is a powerful text based software tool which is one of the most popular and widely in use code editors available for
custom website design and development. we preferred Sublime because of it's speed, simplicity,
and rich plugin ecosystem. We chose Sublime Text since it is easy to install, download, and
update packages or plugins into Sublime Text. It also supports many programming languages and
markup languages, and functionalities can be added with plugins. Due to simplicity and flexibility
of Sublime Text, we have used Sublime Text.
Design of the website of Bus transportation:
It is crucial to design and develop an effective and attractive website in order to pull amount of
traffic to our website. As according to the context of scenario, we are working as a web developer
and we are required to design a fully functional interactive and appealing website DigiTek
Solution has hired you as a Web Developer for developing a solution for Bus Company. The website
is custom built and includes a wide range of functionalities such as offers, services, contacts,
gallery etc. The client requirement for the Reservation system are We can login the system we
can here the homepage, Contact and Book ticket and adminpannel of the system. about Check the
availability of tickets, book and confirm the ticket. Additionally, there must be an admin section to
control or input the overall system Here is the website design that we have designed for Bus
transportation:
Homepage:
This is multipage website. A website wireframe is a visual prototype of a web page that focuses on
content, layout, and behavior. A wireframe is constructed using basic boxes, lines, and other shapes to
create an outline of the functional parts of a web page without wasting time creating an intricate,
polished design. There is no any cascading color design need of wireframes. In the Homepage
Introduction of the Bus reservation of the home page and so on. In the Home here is multipage website
here cascading CSS is using so attractive website.
Rohit shah (Second Semester Sec-F)
43
Website Design &Development 2021
Query:
Html-Code:
Rohit shah (Second Semester Sec-F)
44
Website Design &Development 2021
PHP-code:
CSS:
About:
This is multipage of the website. In this page header and footer are same as a Homepage but the content
is different and before the content page, we are able to see a text which is moving from right to left. .
In the About here is multipage website here cascading CSS is using so attractive website.
Rohit shah (Second Semester Sec-F)
45
Website Design &Development 2021
Html code:
Php Code:
Rohit shah (Second Semester Sec-F)
46
Website Design &Development 2021
CSS code:
Query:
Contact:
In this page header and footer are same as a Homepage but in the content phase you will get a Google
map where the Travel is located. A contact page is a common web page on a website for visitors to
contact the organization or individual providing the website. The page contains one or more of the
following items: an e-mail address. Contact us pages are often the go-to for a new visitor on a mission.
Rohit shah (Second Semester Sec-F)
47
Website Design &Development 2021
It's where they go when they have a question and truly want to speak to an individual at your
organization. They exist to serve the user with the purpose of providing them with information on how
they can get in touch with you. In the contact here is multipage website here cascading CSS is using
so attractive website.
Rohit shah (Second Semester Sec-F)
48
Website Design &Development 2021
CSS:
Html code:
Rohit shah (Second Semester Sec-F)
49
Website Design &Development 2021
JavaScript code:
Php:
Rohit shah (Second Semester Sec-F)
50
Website Design &Development 2021
BookTicket:
This is the multipage website. After clicking the BookTicket There is display showing the content the
Select the destination where you want the destination Pokhara, Hetauda anywhere you want to do and
now you can fill the forms like your name Your contact, date, your address and now you can choose
the seat and confirm the book you can click the book button respectively and there is cascading color
showing in the website. In the contact here is multipage website here cascading CSS is using so
attractive website.
Rohit shah (Second Semester Sec-F)
51
Website Design &Development 2021
Html code:
Rohit shah (Second Semester Sec-F)
52
Website Design &Development 2021
CSS:
Rohit shah (Second Semester Sec-F)
53
Website Design &Development 2021
Php:
JavaScript:
Query:
Rohit shah (Second Semester Sec-F)
54
Website Design &Development 2021
Admin:
This is the multipage of the website. After clicking on login button a user can login with the username
and password. If the username and password are correct then the dashboard will be appearing otherwise
it display Username or Password are incorrect.
Html code:
Rohit shah (Second Semester Sec-F)
55
Website Design &Development 2021
CSS code:
Php:
Query
Rohit shah (Second Semester Sec-F)
56
Website Design &Development 2021
Change the banner:
This is the multipage of the bus reservation. After clicking on login button a user can login with the
username and password. Now, you can see that Change the Banner enter the new page where you can
see that Upload New banner here you can click the Choose File and now you upload where is the
banner of the Travel and select the Banner and now, you can upload the new banner of the travel.
Rohit shah (Second Semester Sec-F)
57
Website Design &Development 2021
Html code:
JavaScript:
Php code:
Rohit shah (Second Semester Sec-F)
58
Website Design &Development 2021
Query:
Change the password:
This is the multipage of Bus reservation system. After clicking on login button, a user can login with
the username and password. Then you see that Change the password of the Users like that and here
like fill up the forms old password means that you had set in previous password of the users and then
you will write new password of the users and again save you and you will write in Confirm Password
the Finally You change the password.
Html code:
Rohit shah (Second Semester Sec-F)
59
Website Design &Development 2021
CSS code:
Php code:
Cancel seat:
This is the multipage of the website of bus reservation system. After clicking on login button a user
can login with the username and password. Now, you can see The Cancel the seat press the Cancel the
seat and you enter next page i.e. Cancel seat where there is id, Destination Id Seat Number Book date
and Cancel Button of the following items. If you are selecting number 7, 5,10,25,27 and son on end
Rohit shah (Second Semester Sec-F)
60
Website Design &Development 2021
time you can decide you can cancel the following number where you can select number 15number will
be cancel and click the Cancel Button the Ticket will be Cancel Successfully.
Javascript:
Php:
Rohit shah (Second Semester Sec-F)
61
Website Design &Development 2021
Html:
Footer:
Html code:
Php code:
Rohit shah (Second Semester Sec-F)
62
Website Design &Development 2021
Query:
- Create test log
1. Admin
Rohit shah (Second Semester Sec-F)
63
Website Design &Development 2021
Tested
Tested
date:
by:
11/12/2021
Rohit
shah
Tested
Expected
data
output:
Admin
User:
Result:
Remarks
success
admin
Pass:
admin
must
be
logged in
and Jump
To
the
dashboard
page
2. About
Rohit shah (Second Semester Sec-F)
64
Website Design &Development 2021
Tested
Tested by:
date:
Rohit shah
11/12/2021
Tested
Expected output:
data
The
About
successfully carried out
Test
Result:
was
which
showed
positive
result.
Remarks
success
a
Bus
Ticket Booking System
is to manage the details
of
Bus,
Ticket,Booking,ASeats.
It
manages
all
the
information about Bus,
Customer, Seats, Bus
3. Contact
Rohit shah (Second Semester Sec-F)
65
Website Design &Development 2021
Tested
Tested by:
date:
Rohit
11/12/202 shah
1
Tested
Expected
Result:
data
output:
s
Contact
The
success
Test
Remark
was
successfull
y
carried
out which
showed a
positive
result. All
the about
of the page
fetch
contact
section so
in order to
fetch
the
data there
is no bugs
and
error
of contact
pages.
Rohit shah (Second Semester Sec-F)
66
Website Design &Development 2021
Rohit shah (Second Semester Sec-F)
67
Website Design &Development 2021
4. BookTicket
Tested
Tested by:
date:
Rohit shah
11/12/202
1
Tested
Expected
data
output:
ks
BookTick
The Test was
success
et
successfully
carried
Result:
Remar
out
which showed a
positive
result. All the
BookTicket
of
the page fetch
BookTicketsecti
on so in order to
fetch the data
there is no bugs
and
error
of
BookTicket
pages.
Rohit shah (Second Semester Sec-F)
68
Website Design &Development 2021
5. Footer
Tested
date:
Tested by:
Rohit shah
11/12/202
1
Tested
Expected
Result
data
output:
s
Fotter
The
Success.
Test
Remark
was
successfull
y
carried
out which
showed
a
positive
result. The
expected
output and
actual
output
was
matched as
the Footer
in my case
footer
is
@Copy
Right 2021
DigiTek
Solution ||
ISMT ||
Rohit shah (Second Semester Sec-F)
69
Website Design &Development 2021
6. Home
Tested
date:
Tested by:
Rohit
11/12/2021 shah
Tested
Expected
data
output:
Home
The
Result
Remarks
Success.
Test
was
successfully
carried out
which
showed
a
positive
result. The
expected
output and
actual
output
was
matched as
the
is
Home and
so on.
7. Change the password
Rohit shah (Second Semester Sec-F)
70
Website Design &Development 2021
Tested date:
Tested by:
11/12/2021
Rohit shah
Tested data
Expected
Change the
password
Result
output:
Remarks
Success.
The
Test
was
successfully
carried out
which
showed
a
positive
result. The
expected
output and
actual
output
was
matched as
the Change
the
password
here
is
button
Firstly, type
the
old
password
and
new
password
type the and
again
the
same
password
we type in
Rohit shah (Second Semester Sec-F)
71
Website Design &Development 2021
new
password
type in Repassword
and click on
the
button
Save and the
password is
successfully
reset.
8. Upload Banner
Rohit shah (Second Semester Sec-F)
72
Website Design &Development 2021
Tested
date:
Tested by:
Nikesh Ojha
10/11/2021
Tested
data
Expected output: Result
The
Test
was
Upload
successfully
banner
carried out which
Remarks
Success.
showed a positive
result.
The
expected
output
and actual output
was matched as
the
Upload
the
new Banner here is
button
click
Firstly,
on
the
Choose the file and
select the photo
what you want in
it.
Here is in my case
file
is
(uploadbanner.jpg)
And the last you
submit the button
and
successfully
upload the banner
Rohit shah (Second Semester Sec-F)
73
Website Design &Development 2021
Bibliography
Available
at:
https://study.com/academy/lesson/what-is-web-technology-definition-
trends.html#/related
[Accessed 5 March 2020].
Available at: https://whatis.techtarget.com/definition/Web-server [Accessed 7 MAcrh 2020].
Available at: https://searchoracle.techtarget.com/definition/MySQL [Accessed 2020].
Available at: https://searchsoftwarequality.techtarget.com/definition/stress-testing
Anon., 2020. Web server [Online]
Available at: https://www.softwaretestinghelp.com/web-application-testing/
[Accessed 10 March 2020].
Rouse, M., 2020. TechTarget. [Online]
Available at: https://whatis.techtarget.com/definition/Web-server
[Accessed 7 MAcrh 2020].
Rouse, M., 2020. TechTarget. [Online]
Available at: https://searchoracle.techtarget.com/definition/MySQL
[Accessed 2020].
Rohit shah (Second Semester Sec-F)
74