Higher Nationals

Internal verification of assessment decisions – BTEC (RQF)

INTERNAL VERIFICATION – ASSESSMENT DECISIONS
Programme title BTEC Higher National Diploma in Computing

Assessor Internal Verifier

Unit 10: Web Design and Development
Unit(s)
Online Hospital Management System
Assignment title
Student’s name
List which assessment Pass Merit Distinction
criteria the Assessor has
awarded.
INTERNAL VERIFIER CHECKLIST
Do the assessment criteria awarded match
those shown in the assignment brief? Y/N

Is the Pass/Merit/Distinction grade awarded

justified by the assessor’s comments on the Y/N
student work?
Has the work been assessed
Y/N
accurately?
Is the feedback to the student:
Give details:

• Constructive?
Y/N
• Linked to relevant assessment
criteria? Y/N

• Identifying opportunities for

improved performance?
Y/N

• Agreeing actions? Y/N

Does the assessment decision need

Y/N
amending?
Assessor signature Date

Internal Verifier signature Date

Programme Leader signature (if
Date
required)
 Confirm action completed
Remedial action taken

Give details:

Assessor signature Date

Internal Verifier
Date
signature
Programme Leader
Date
signature (if required)

St name Web Design and Development 2|Page

Higher Nationals - Summative Assignment Feedback Form
Student Name/ID

Unit Title Unit 10: Website Design & Development

Assignment Number 1 Assessor

Date Received 1st
Submission Date
submission
Date Received 2nd
Re-submission Date
submission
Assessor Feedback:

LO1. Explain server technologies and management services associated with hosting and managing websites.

Pass, Merit & Distinction P1 P2 M1 M2 D1

Descripts
LO2. Categorise website technologies, tools and software used to develop websites.

Pass, Merit & Distinction P3 P4 M3 D1

Descripts

LO3. Utilise website technologies, tools and techniques with good design principles to create a multipage
website.
Pass, Merit & Distinction P5 P6 M4 D2
Descripts

LO4. Create and use a Test Plan to review the performance and design of a multipage website.
Pass, Merit & Distinction P7 M5 D3
Descripts

Grade: Assessor Signature: Date:

Resubmission Feedback:

Grade: Assessor Signature: Date:

Internal Verifier’s Comments:

Signature & Date:

* Please note that grade decisions are provisional. They are only confirmed once internal and external moderation has taken place and grades decisions have
been agreed at the assessment board.

St name Web Design and Development 3|Page

Assignment Feedback
Formative Feedback: Assessor to Student

Action Plan

Summative feedback

Feedback: Student to Assessor

Assessor signature Date

Student signature Date

St name Web Design and Development 4|Page

 Pearson
Higher Nationals in
Computing
Unit 10: Web Design and Development
Assignment 01

St name Web Design and Development 5|Page

General Guidelines

1. A Cover page or title page – You should always attach a title page to your assignment. Use previous page as
your cover sheet and make sure all the details are accurately filled.
2. Attach this brief as the first section of your assignment.
3. All the assignments should be prepared using a word processing software.
4. All the assignments should be printed on A4 sized papers. Use single side printing.
5. Allow 1” for top, bottom , right margins and 1.25” for the left margin of each page.

Word Processing Rules

1. The font size should be 12 point, and should be in the style of Time New Roman.
2. Use 1.5 line spacing. Left justify all paragraphs.
3. Ensure that all the headings are consistent in terms of the font size and font style.
4. Use footer function in the word processor to insert Your Name, Subject, Assignment No, and Page Number
on each page. This is useful if individual sheets become detached for any reason.
5. Use word processing application spell check and grammar check function to help editing your assignment.

Important Points:

1. It is strictly prohibited to use textboxes to add texts in the assignments, except for the compulsory
information. eg: Figures, tables of comparison etc. Adding text boxes in the body except for the before
mentioned compulsory information will result in rejection of your work.
2. Carefully check the hand in date and the instructions given in the assignment. Late submissions will not be
accepted.
3. Ensure that you give yourself enough time to complete the assignment by the due date.
4. Excuses of any nature will not be accepted for failure to hand in the work on time.
5. You must take responsibility for managing your own time effectively.
6. If you are unable to hand in your assignment on time and have valid reasons such as illness, you may apply
(in writing) for an extension.
7. Failure to achieve at least PASS criteria will result in a REFERRAL grade .
8. Non-submission of work without valid reasons will lead to an automatic RE FERRAL. You will then be asked
to complete an alternative assignment.
9. If you use other people’s work or ideas in your assignment, reference them properly using HARVARD
referencing system to avoid plagiarism. You have to provide both in-text citation and a reference list.
10. If you are proven to be guilty of plagiarism or any academic misconduct, your grade could be reduced to A
REFERRAL or at worst you could be expelled from the course.
11. If you are proven to be guilty of plagiarism or any academic misconduct, your grade could be reduced to A
REFERRAL or at worst you could be expelled from the course.

St name Web Design and Development 6|Page

Student Declaration

I hereby, declare that I know what plagiarism entails, namely to use another’s work and to present it as my own
without attributing the sources in the correct way. I further understand what it means to copy another’s work.

1. I know that plagiarism is a punishable offence because it constitutes theft.

2. I understand the plagiarism and copying policy of the Pearson UK.
3. I know what the consequences will be if I plagiaries or copy another’s work in any of the assignments for this
program.
4. I declare therefore that all work presented by me for every aspects of my program, will be my own, and
where I have made use of another’s work, I will attribute the source in the correct way.
5. I acknowledge that the attachment of this document signed or not, constitutes a binding agreement
between myself and Pearson, UK.
6. I understand that my assignment will not be considered as submitted if this document is not attached to the
attached.

Student’s Signature: Date:

(Provide E-mail ID) (Provide Submission Date)

St name Web Design and Development 7|Page

Assignment Brief
Student Name /ID Number

Unit Number and Title Unit 10- Web Design and Development

Academic Year 2021/2022

Unit Tutor

Assignment Title Online Hospital Management System

Issue Date

Submission Date

IV Name & Date

Submission Format:
Part 1.
Report- Submit a professional report with approepriate report formattimg and guidelines followed. All the
research data should be referenced along with in-text citations using Hrvard referencing syste.

Part 2
A fully functional web solution

Unit Learning Outcomes:

LO1 Explain server technologies and management services associated with hosting and managing websites.

LO2 Categorise website technologies, tools and software used to develop websites.

LO3 Utilise website technologies, tools and techniques with good design principles to create a multipage website.

LO4 Create and use a Test Plan to review the performance and design of a multipage website.

Assignment Brief and Guidance:

St name Web Design and Development 8|Page

 Assignment Brief
Scenario.
‘Apex Design Works’ is a leading web design and marketing company. They are focusing on helping
businesses communicate more effectively and build their business through a creative design. Assume
that, you work as an apprentice web developer for Apex Web Design and marketing company. As part of
your role, you have been asked to create a Website for the following organization .
Arogya Health Care hospital currently uses a manual system for the management and maintenance of
critical information. The current system requires numerous paper forms, with data stores spread
throughout the hospital management infrastructure. Often information (on forms) is incomplete, or does
not follow management standards. Multiple copies of the same information exist in the hospital and may
lead to inconsistencies in data in various data stores. There are number of documents to be maintained in
the Health Care hospital and this information typically involves; patient personal information and medical
history, staff information, room and ward scheduling, staff scheduling, operating theater scheduling and
various facilities waiting lists. All of this information must be managed in an efficient and cost wise fashion
so that the resources can be managed effectively. The reception module handles various inquiries about
the patient's admission and discharge details, and the patient's movements within the hospital.
Assume that you are the web developer hired by the Health Care Hospital, to propose, and engineer a low
cost but yet powerful and complete Hospital Management System (HMS) for the scenario given above.
Suggest and implement important functionalities and features to the system by identifying system
functionalities.

The new system is to control the following information

• patient information
• room availability
• staff and operating room schedules
• patient invoices

Develop a web based solution for the above scenario and produce a report covering the following tasks.

Task 1 - Server technologies and management services associated with hosting and managing websites (LO1)

1.1 Explain and differentiate the different web technologies such as communication protocols, server hardware,
operating systems and web server software with regards to designing, publishing and accessing the Hospital
Management System (HMS).
1.2 Identifry and define the types of DNS and the uses of it, with clarifications on how domain names are
structured. Review the effect of search engines on website performance . Provide evidence-based support for
improving a site’s index value and rank of the Hospital Management System (HMS) through search engine
optimization.
1.3 Identify and explain the common web development technologies and frameworks. Explain the tools and
techniques chosen to develop the above web application and justify your choice by providing valid evidences.

Task 2 - Categories website technologies, tools and software used to develop websites (LO2)

St name Web Design and Development 9|Page

 2.1 Considering the requirments given in the above scenario define the relationships between front-end and
back-end website technologies and discuss how the front-end and the back-end relate to presentation and
application layers.
2.2 Discuss the differences between online website creation tools and custom-built web sites by considering the
design flexibility, performance, functionality, User Experience (UX) and User Interface (UI). Evaluate the tools
and techniques available to design the web application gicven in the scenario.
.
Task 3 - Utilize website technologies, tools and techniques with good design principles to create a multipage
website (LO3)

3.1 Design a suitable web application solution for the given scenario using PHP, JS and MySQL (Screenshots of
important code lines with proper comments and user interfaces filled with sample data must be attached to
the documentation). Apply a database design for the proposed system and provide the well normalized
database design of the proposed system. Provide evidences of the design, multipage website supported with
fidelity wireframes and a full set of client and user requirements.
3.2 Compare and contrast the multipage website created to the design document. Use your design document
with appropriate principles, standards and guidelines to produce a branded, multipage website supported
with realistic content and Critically evaluate the web design ,development process against your design
document analyisng any technical challenges you faced during the development.

Note - Synthesize client and the server-side functionalities in the proposed design.

Task 4 - Create and use a Test Plan to review the performance and design of a multipage website (LO4)

4.1 QA process is expected to discover design issues and development errors while testing a product’s user
interface (UI) and gauging the user experience (UX). Evaluate the Quality Assurance (QA) process and
review how it was implemented during your design and development stages.

4.2 Create a suitable test plan for the developed system and critically evaluate the results of your Test Plan .
Include a review of the overall success of your multipage website; use this evaluation to explain any areas
of success and provide justified recommendations for areas that require improvements.

St name Web Design and Development 10 | P a g e

 Grading Rubric
Grading Criteria Achieved Feedback

LO1 Explain server technologies and management services associated with

hosting and managing websites

P1 Identify the purpose and types of DNS, including explanations on how

domain names are organized and managed.

P2 Explain the purpose and relationships between communication protocols,

server hardware, operating systems and web server software with regards to
designing, publishing and accessing a website.
M1 Evaluate the impact of common web development technologies and
frameworks with regards to website design, functionality and
management.
M2 Review the influence of search engines on website performance and
provide evidence-based support for improving a
site’s index value and rank through search engine optimization.
D1 Justify the tools and techniques chosen to realize a custom built
website.

LO2 Categories website technologies, tools and

software used to develop websites

P3 Discuss the capabilities and relationships between front-end and back-end

website technologies and explain how these relate to presentation and
application layers.
P4 Discuss the differences between online website creation tools and custom
built sites with regards to design flexibility, performance, functionality, User
Experience (UX) and User Interface (UI).

M3 Evaluate a range of tools and techniques available to design and develop

a custom built website.
LO3 Utilize website technologies, tools and techniques
St name Web Design and Development 11 | P a g e
with good design principles to create a multipage
website

P5 Create a design document for a branded, multipage website supported

with medium fidelity wireframes and a full set of client and user
requirements.
P6 Use your design document with appropriate principles, standards and
guidelines to produce a branded, multipage website supported with realistic
content.
M4 Compare and contrast the multipage website created to the design
document.

D2 Critically evaluate the design and development process against your

design document and analyse any technical challenges.

LO4 Create and use a Test Plan to review the

performance and design of a multipage website

P7 Create a suitable Test Plan identifying key performance areas and

use it to review the functionality and performance of your website.
M5 Evaluate the Quality Assurance (QA) process and review how it was
implemented during your design and development stages.
D3 Critically evaluate the results of your Test Plan and include a review of
the overall success of your multipage website; use this evaluation to
explain any areas of success and provide justified recommendations for
areas that require improvement.

St name Web Design and Development 12 | P a g e

 Observation Sheet

Activity Activity Learning Outcome Feedback

No (Pass/ Redo)
1 Explain server technologies and LO1
management services associated with
hosting and managing websites.
2 categorize website technologies, tools and LO2
software used to develop
websites.
3 Utilize website technologies, tools and LO3
techniques with good design
principles to create a multipage website.
4 Create and use a Test Plan to review the LO4
performance and design of a
multipage website.

Comments:

Assessor Name :…………………………………………….

Date :…………………………………………….
Assessor Signature :…………………………………………….

St name Web Design and Development 13 | P a g e

 Task 1 - Server technologies and management services associated with hosting and managing websites
(LO1)

1.1 Explain and differentiate the different web technologies such as communication protocols, server
hardware, operating systems and web server software with regards to designing, publishing and
accessing the Hospital Management System (HMS).

Communication protocols are recognized reports of digital message formats and rules. They are needed to
exchange messages on or between computer systems and are necessary in communications.

Connection protocols include error detection, error correction, authentication, and signalling. They can also
explain the semantics, syntax, and synchronization of digital and analogue connections. Communication
protocols are implemented in software and hardware. Thousands of communication protocols are used
throughout analogue and digital communications. Computer networks cannot exist without them.

Transmission control protocol (TCP)

The Transmission Control Protocol (TCP) is a network communication protocol designed to send packets
over the Internet, called a TCP / IP group.

TCP is the transport layer protocol of the OSI layer used to establish communication between remote
computers through the transfer and guarantee of message delivery via support networks and the Internet.

Hypertext Transfer Protocol (HTTP)

Hypertext Transfer Protocol (HTTP) is the application layer protocol that is mainly used on the Web
(iplocation, 2018). HTTP uses the client server form where the Web browser is the client and communicates
with the web server that hosts the site. It uses HTTP, which is transmitted over TCP / IP to connect to the
server and retrieve the user's web content. HTTP is a widely used protocol that has been adopted quickly
over the Internet because of its simplicity. It is a protocol without case and without connection.

Hypertext Transfer Protocol (HTTPS)

Hypertext Transfer Protocol (HTTPS) is an alternative to standard Web transport (HTTP) that adds a
layer of security to transient data through Secure Sockets Layer (SSL) or Transport Layer Security (TLS).
(ibm, 2018)

St name Web Design and Development 14 | P a g e

 HTTPS allows encrypted communication and a secure connection between the remote user and the main
Web server.

Post office protocol (POP)

Post Office Protocol (POP) is a type of computer network and the standard Internet protocol that retrieves
and retrieves e-mail messages from the remote e-mail server so that the host computer can access them.

POP is an application layer protocol of the OSI model that provides users with access and receipt of e-mail.

File Transfer Protocol (FTP)

File Transfer Protocol (FTP) is a client / server protocol used to transfer files or share files with a host
computer. It can be documented with usernames and passwords. Anonymous FTP allows users to access
programs, files and other Internet data without having to obtain a user ID or password. Sometimes, websites
are designed to allow users to use "Anonymous" or "Guest" as the username and email address of the
password.

Secure File Transfer Protocol (SFTP)

Secure FTP (SFTP) is a secure version of File Transfer Protocol (FTP), which makes it easy to access and
transfer data via the Secure Shell (SSH) data stream. This is part of the SSH protocol. This term is also
called SSH file transfer protocol.

Simple Mail Transfer Protocol (SMTP)

The Simple Mail Transfer Protocol (SMTP) is the standard protocol for messaging services in a TCP /
IP network (omnisecu, 2018). SMTP offers the possibility to send and receive email messages. SMTP is
an application layer protocol that allows you to send and distribute email over the Internet.

Server hardware

A computer that provides data to other computers is called as a server. The data can be provided to the
systems in a local area network (LAN) or in a wide area network (WAN) over the Internet.

There are many types of servers, including web servers, mail servers and file servers. Each type executes
specific programs for the purpose of the server. For an example, your mail server can run a program such as
Exim or iMail, which provides SMTP services to send and receive email. The Samba file server or the file
sharing services included in the operating system can be used to share files across a network.

St name Web Design and Development 15 | P a g e

 Web server

A web server is a web based computer system which hosts websites on the internet. It runs a web server
program, such as Microsoft IIS or Apache, which provides access to web pages hosted online. The most
web servers are connected to the Internet through a high-speed connection, providing faster OC-3 or data
transfer speeds. Fast Internet connection allows web servers to support multiple connections at the same
time without deceleration.

File server

File Server provides access to files. This server works as a central storage location for files that multiple
systems can access. File servers are commonly found in business environments, such as corporate networks,
but they are also used in schools, small businesses, and even home networks.

Mail server

A mail server is a computer system that sends and receives emails. In many cases, web servers and mail
servers are integrated into a machine. However, large Internet service providers and public e-mail services
(such as Gmail and Hotmail) can use dedicated devices to send and receive e-mail.

Proxy server

Most large companies, institutions and universities are serving as agents. This is a server that must pass all
the computers on the LAN before accessing the information on the Internet. With a proxy server, the
organization will be able toincrease network performance and filter which users can access the network.

Application server

An application server is a type of server which is designed to install, run and host applications and services
related to end users, IT services and organizations. This facilitates the hosting and delivery of consumer
applications or sophisticated jobs, used by local or remote users and connected at the same time.
(techopedia, 2018)

St name Web Design and Development 16 | P a g e

Operating systems and Web server softwares

Operating system

An operating system, or "OS", is a program that communicates with the devices and allows other programs to
be executed. It consists of basic system software or files that your computer needs to boot and work. Each
desktop, servers, tablet and smart phone have an operating system which provides basic functionality for the
device.

Common desktop and web server operating systems are Windows, OS X and Linux. Although each operating
system is unique, most of them provides a graphical user interface (GUI), which includes a desktop and the
ability to manage folders and files in the system. It also allows us to install and run programs which were
written for the operating system. Windows and Linux can be installed on the standard computers and web
servers while OS X is designed to run on Apple systems.

Web server software

Apache Web Server

Apache Web Server is designed to create web servers that can host one or more HTTP sites. Features
include the ability to support multiple programming languages, server-side scripts, authentication
mechanisms, and the database. Apache Web Server can be improved by manipulating the base code or by
adding several extensions / extensions..

NGINX server

NGNIX is open source software for web servers, reverse agents, caching, load balancing, streaming media,
and more. It started as a web server designed to optimize performance and stability. In addition to HTTP
server functionality, NGINX can also function as mail proxy (IMAP, POP3 and SMTP), reverse proxy and
load balancer for HTTP, TCP and UDP servers.

Lighttpd server
Lighttpd is a secure, fast, compatible and highly flexible web server optimized for high performance
environments. It has a very low memory compared to other web servers and is interested in CPU load. The
set of advanced functions (FastCGI, CGI, Auth, OutputCompression, URL-Rewriting and many more)
makes lighttpd ideal for a web server for each server with load problems.

St name Web Design and Development 17 | P a g e

1.2 Identifry and define the types of DNS and the uses of it, with clarifications on how domain names are
structured. Review the effect of search engines on website performance. Provide evidence-based support
for improving a site’s index value and rank of the Hospital Management System (HMS) through search
engine optimization.

Domain Name System (DNS)

DNS is a distributed directory that resolves the names of hostnames that are readable by humans, such as
www.example.com, to computer readable IP addresses such as 55.18.83.103. DNS is also a directory of
important information about domain names, such as email servers (MX records), sending verification
(DKIM, SPF, DMARC), TXT record verification for domain ownership and even SSH (SSHFP). (dyn,
2018)

Intelligent DNS services can handle DNS responses and determine which IP addresses are returned to ensure
the best performance and reliability of the clients.

Importance of DNS

DNS is similar to an Internet phone book. If you know someone's name but do not know their phone
number, you can simply search their directory. DNS provides the same service on the internet.

When you visit https://example.com in a browser, your computer uses DNS to retrieve the IP address of the
website 55.18.83.103. Without DNS, you can only visit the websites by only visiting its IP address directly,
such as http://50.16.85.103.

How does DNS work

When you visit an area such as dyn.com, the computer follows a series of steps to convert the readable web
address to a machine-readable IP address. This happens every time you use a domain name, whether you are
viewing websites, sending emails or listening to Internet radio stations.

Types of Domain Names

TLD - Top Level Domains

These are the highest levels in the Internet's DNS structure. There are several different types of TLD, where:

St name Web Design and Development 18 | P a g e

 1 ccTLD - country code Top Level Domains

Two character fields have been created for geographic locations, for example, .au indicates Australia. When
originally established, residents in a country can usually register their own ccTLDs; however, over the years
some countries have allowed various parties outside their coasts to register the names of the websites. An
example is Tuvalu (.tv).

In the case of .au domain names, strict rules still apply. For example, registered .com.au must be registered
with Australians or have registered businesses in Australia. The eligibility criteria of the UA mean that .au is
still strongly associated with Australia and has increased confidence in local and even foreign online buyers.

1 gTLD - generic Top Level Domain

The most popular generic types of TLDs are .com, .net, .biz, .org and .info; They can be registered by
anyone anywhere in the world. However, some of the new gTLDs launched have multiple limitations

2 IDN ccTLD - internationalised country code top-level domains

The top-level name is in a specially encoded format whichis displayed as a non-Latin character set.

Second Level Domain

The second-level domain is a specific part of the website, the domain name of the page or the URL that
completes the top-level domain. One of the easiest ways to define a second-level domain is to consist of that
part of the domain name to the left of ".com" or any other similar extension, called the top-level domain.
The analysis of the top-level and second-level domains helps analyze the URL or the title of the page.

In addition to these common second-level domains, there is also an idea of the second-level domain code
(ccSLD) (techopedia, 2017). Here, the second level domain is actually to the right of the decimal route. For
example, in a domain such as "google.co.uk", the top-level domain of the country code is the "uk" part,
while ccSLD is ".co".

Third Level Domain

Directly below the second level in the DNS hierarchy. Ex. Domain.com.au

The difference between the second and third level can be a bit confusing. For example, hotmail.com is
considered a second level domain, but hotmail.com.au can be classified as a third level.

St name Web Design and Development 19 | P a g e

 Subdomain

Part of a top-level domain name in the DNS hierarchy, for Ex. example.domain.com.au.

Some services offer a "registration" subdomain, but this is generally not ideal for businesses, and
should probably be avoided to create a business website where the principal name registrar controls the
address hierarchy. Getting your name can also help

Figure 1 Domain name

you gain credibility.

Every domain consists of at least two parts: the actual domain name and the TLD or Top Level Domain. In
our domain.me example, “.ME” is the TLD of Montenegro and the “domain” part is a domain name or
domain label we chose for our site. You’ve surely heard of some other top-level domains like .COM, .NET,
.ORG, .INFO, .US etc. (Krajacic, 2016)

St name Web Design and Development 20 | P a g e

1.3 Identify and explain the common web development technologies and frameworks. Explain the tools and
techniques chosen to develop the above web application and justify your choice by providing valid
evidences.

Search engine optimization

Search engine optimization (SEO) is used to increase traffic to a website by increasing the rank of the search
engine page.

Search engine optimization often involves improving the quality of the content, ensuring that it is rich in
related keywords and organizing them using subtitles, dots and symbols in bold italics. SEO also ensures
that HTML is optimized on the site so that the search engine can determine what is on the page and display
it as a result of searching related searches. These criteria include the use of metadata, including the title tag
and the meta description. Linking within the site is also important. Below are some techniques to follow in
order to optimize your website.

1 In‐Depth Topic Coverage

The keyword search is one of the first things that we should know in SEO and is still very effective on these
days. However, keyword research is developing due to the evolution of the semantic search and the
advancement of Google's knowledge graph. These technologies allow Google to understand the search,
regardless of how it is classified. They are not perfect at all (yet), but they become much better.

Traditionally, when searching for keywords, you can try to find keywords with a high search volume and
little competition. You can then create a page targeted to that keyword and try to use the keyword in your
article to confirm that the page is about that keyword.

2 Re‐Optimizing Existing Content

If you are a regular blogger or your website is a content creator, you may be sitting on an undeveloped gold
mine. Once an article is published, many people forget about it and move on to the next article, ignoring the
potential of the current content of their site.

Every time in a moment (quarterly, semiannual, yearly) you have to check the content of your
website. Content verification is an audit that optimizes, merges, or even deletes articles.

St name Web Design and Development 21 | P a g e

 03 Linkable Asset Development And Promotion
A linkable item is part of the content that effectively attracts backlinks from other websites. Creating and
promoting linkable resources is a great way to optimize search engine optimization by using backlinks.

04 Accelerated Mobile Pages (AMP)

Nowadays, we are moving towards the first mobile world. Accelerated Mobile Pages (AMP) is an open
source framework for creating pages for high-speed mobile pages. AMP improves the mobile experience by
improving location measurements, such as bounce rate. The Google app likes fast-loading sites and tends to
rank download sites faster in the SERPs.

Figure 2 SEO

St name Web Design and Development 22 | P a g e

Task 2 -

Considering the requirments given in the above scenario define the relationships between front-end and
back-end website technologies and discuss how the front-end and the back-end relate to presentation and
application layers.

Front - End web development

HTML and CSS are the basic components of Web development. Their frameworks, such as Bootstrap and
Materialize, are widely used in Web development. Twitter Bootprap is famous for its responsive design, the
Flexbox system and the CSS grid system. They are also CSS-oriented and are used without any framework
to develop responsive websites.

Motion UI is another widely used development technology. It maintains the simplicity of the site. Since
many people are tired of GLFs and flashing ads. Web developers use their animated graphics to add design
and make their site unique among thousands of other users of the fixed user interface.

JavaScript and its front-end frameworks such as Angular, React and Vue.js are currently the most commonly
used frameworks in project.

CSS frameworks like SASS or LESS. SASS is the best and the least used.

Photo editors - Photoshop, Gimp.

Back - End web development

1 Languages / Server-side technologies:-

The JS, Python and PHP nodes are the most used languages for web development. The other
languages used in web development are Ruby, C # and ASP.NET.
2 Database:-

MongoDB is currently popular, with its non-relational database, MySQL is a popular relational
database. Oracle, SQL Server, PostgreSQL, and Firebase are other database systems used in Web
development. (thoughtwavesoft, 2018)

St name Web Design and Development 23 | P a g e

 3 Back-End Frameworks:-
Express is a known framework for JavaScript. Adonis and Hapi.js are also the best frameworks in
JavaScript. PHP frameworks such as Laravel, CodeIgniter, Symphony and Yii2 are popular. The
Python, Django, Flask, Web2py frameworks are widely used, for Ruby - Ruby on Rails and for C # -
. NET are the best frames used.
For mobile apps, Native React, NativeScript, Ionic, PhoneGap are the main frameworks.
Other popular technologies

4 Git :-
Git is used to control the source / project version. It is a very used technology. Unlike Git, SVN-
Subversion is also a control system available in a famous version.
5 Command Line Interfaces:-
If you use front-end windows such as Angular and React, you need to know the CLI to manage
folders and create files and services. NPM (Package Manager) is a package manager for JavaScript
and its own frameworks. It uses the CLI to manage the files.
6 HTTPS:-
The security of the website will remain in the foreground. By using the SSL (Secure Socket Layer)
and Hypertext Transfer Protocol (HTTPS) protocols, we can protect our data by transferring the
Secure TLS layer and gain the following benefits:
The transferred data will be encrypted.
Data cannot be modified or damaged during detection when moving
The data can be authenticated to demonstrate that users are using the intended website.
HTTPS gives you the advantage in terms of security and Google SEO ranking when
comparing HTTP. HTTPS will control it in the coming years because Google prefers the
most secure sites.
7 API:-
REST API, JavaScript Retrieval API and Angular HTTP are the most famous APIs.
8 Implementation tools :-
FTP client implementation tools, such as FileZilla and WinSCP, and SSH tools such as Putty and
Bitvise SSH Client are the most widely used implementation tools.

St name Web Design and Development 24 | P a g e

 Suitability of a web based application for the given scenario

Web applications have many advantages since they do not require the installation or updating of the process,
which saves a lot of administrative work for large companies.

Here are some of the benefits of using web based applications:

1 Work from anywhere, anytime. You can access Web programs from any device connected to
the Internet. The data is available anywhere after the user login. It's a real reward for
productivity.

2 There are no real programs to download, install, update or manage. The software is always
updated and download times are reduced with redundant backup systems.
3 A web program compatible with any device or platform. The program is provided via the
user's selection browser.
4 Extensibility with a Web program, you can easily add multiple user licenses in seconds.
More facilities and configurations in every workstation or laptop.
5 Mobile apps provide access to the program when you leave the place. Productivity remains high
where employees can get the work done they need.

When we considering about these advantages the most suitable application for the Hospital Management
System (HMS). is a web based application because the student or the professors can reserve their books,
edit their account details view books and etc through online from anywhere, anytime. The librarian also
can handle the entire stuffs trough online by just sign in to the web application. For the new registrations
they don’t even want to come to the library. They can register themselves through online web application
by simply
visiting to the Hospital Management System (HMS). website. So, these are the main reasons to choose a
web based application to the Hospital Management System (HMS)..

St name Web Design and Development 25 | P a g e

 Two terms widely used in the web industry are front-end and back-end. It can be a bit frustrating, since the
difference between the front-end and the back-end is not always perfectly clear. They are terms that are
often used to describe aspects of the web industry. The front end is also referred to as the client's name and
is sometimes referred to as Web Design. The end of the web industry is often called the server name. Often
when someone says he is a "web developer", they say they are working on the back end of the sites. Even
though the explanation was simple most probably the line between both will be blurred.

Front-End Development

Front End Users manage everything visible first in their browser or app. Front-end developers are
responsible for the appearance of the site. Front end website development is the same how to create a user
interface for a web application. Typically, it refers to the Hypertext Markup Language (HTML), Cascading
Style Sheets (CSS) and JavaScript portion of web site production as different to the server-side
programming or to the database. (quora, 2016) The front-end developers will participate in the analysis of
code, design and restoring applications, as well as ensuring a perfect user experience.

Back-End Development

Back-end development is everything that communicates between the database and the browser. Back-end
development is the server side of the development that focuses primarily on how the site works.
(brightskywebdesign, n.d.) In addition to the web site monitoring function, your primary responsibility is to
make updates and changes. A server, database and an application are the three parts contains in the back –
end development. And also these types of developer positions are called as web developers or programmers.

St name Web Design and Development 26 | P a g e

 Front-end and the back-end relate to presentation and application layers.

Front - end works with the presentation layer

The front - end refers to all actions / items executed / displayed in the client's browser

Presentation (UI)

The front - end is designed using HTML, CSS, JavaScript and several Js libraries such as Ajax and Jquery.
This is where you can use a window (such as Angular, React, Vue.js, etc.) to manipulate your user interface
and connect it to the server.

Back - end works with the application layer

The back - end refers the languages / programs that will run on the server. Back - end is used to get
flexibility and personalisation in the web application.

1 Database

In the database the data from the web application will store. (Ex. MySQL, Oracle)

2 Logic and API

Create your web application with server-side language. (Ex. Node.js, PHP, Python, Ruby, etc.)

Figure 3 Front-end and Back-end relationship

St name Web Design and Development 27 | P a g e

 2.2 critically compare the different between online website creation tools and custom-built sites.
Consider Followings: design flexibility, performance, functionality, User Experience (UX)
and User Interface (UI).

developed using content management system (CMS). It allows companies easily and quickly to update
their websites without technical support. Most popular are WordPress, Open Source Blogging Tool, and
CMS, which increases by 50-60% in the global CMS market during last year. The system which a
developer uses for a particular site depends on a variety of factors, including the technical requirements of
its server and its own level of experience in the different platforms.

The system used by the developer for one Web site depends on the technical requirements of the server and
various factors, including its experience in different platform

Websites created with WordPress or other CMS platforms can be downloaded or downloaded for free or you
can download your requirements and brand, traditional model, or "theme".

Thought all sites are not similar there are so many advantages and disadvantages in these both
methods but also it depends according to your needs, budget and goals.

There are main two simple ways of building a website.

1. By using online website creation tools

2. By creating custom-built site yup
Online website creation

There are many options for those who want to create their own websites. A more common place for setting
up a WordPress site theme is called a website. That provides its appearance and function. Sites like Theme
Forest and elegant themes provide a library of few people. It also can be purchased and implemented on
their site to get a purchase or to provide different features.

The benefits of website templates

1 Less expensive than custom sites

The use of a form is that there are many coding websites without raising your finger. The reason why
it is easier to access than most websites besides the sites that are created is that your processor will
need to change the settings and take time to run the content.
2 Template sites are quit fast to device

St name Web Design and Development 28 | P a g e

 Much of the coding is done in template sites. If the content is ready to go soon it can mostly be
launched in a matter of weeks. Expressively a custom site will take longer.
3 Templates are getting more complex
The best templates are well designed. And also it allows for a reasonable customization.
The disadvantages of website templates

Your site might look same like others.

You are limited in your graphics and navigation capabilities.
Some templates are especially well maintained or well made.
The function will be limited in the web site template.
There ca be security issues in website templates.

Custom web design

Your brand will be much stronger when a site is designed for you, instead of trying to get a template that fits
your brand. And also the most important thing about a custom website is that your website is designed and
built in accordance with your established brand.

Advantages of custom web design

1 There’s no limits in graphics and functionality :-

If you can imagine it, you can program a custom web site.
2 Flexible :-
If you are working with a template web site, you may want to start the major changes. But adding
new features to a custom site is easier than that.
3 As WordPress is updated custom websites are easy to update :-
As you update WordPress, your developer will be able to change the coding of the site.
4 This site is needed for e commerce :-
If you need an online store that you want to have more than a few items, the website's model is not
sufficient.
5 Unique design :-
As it is created only for your business it looks different than others Website.

Disadvantages of custom web design

Custom web site is more expensive

It takes a long time to design a custom web site.
It is difficult to maintain and manage

St name Web Design and Development 29 | P a g e

 Figure 4 Wix web design tool

Compare and contrast the tools and techniques available to design and develop a custom-built web Applications

St name Web Design and Development 30 | P a g e

2.2 Discuss the differences between online website creation tools and custom-built web sites by considering

1. Sublime text -

Advantages

1 There are multiple cursors such as inserting codes at the same time or making multiple edits.

2 There are so many sublime texts for commands that don’t exist in Dreamweaver.
3 It has over Dreamweaver
4 This allows you to instantly view and select your code based on the quality and structure of
your code.
Disadvantages

1 There’s no toolbar.

2 It takes a long time to load big files in windows

3 Cause disturbance while working.

2. Vim

Advantages

1 Super-fast editor

2 You can change the color scheme fonts their size etc.
3 This runs in all possible platforms.
Disadvantages

1 When you are fluent in using, you would want to use it for everything.

2 You get a habit of using Esc button easily.

St name Web Design and Development 31 | P a g e

 3. Atom

Advantages

1 Smart auto complete, integrated spell check, find and replace are some special features in atom
text editor.

2 There is a inbuilt command palette

3 Easy to customize the UI
4 For quickly opening files there is a fuzzy finder
Disadvantages

1 Slow

2 Cannot handle a file more than a MB

3 There’s no Corona package yet.

4. Komodo edit

Advantages

1 Can save time on editing

2 There’s a colour coded feature for certain word that are used.
3 There’s a web browser built in.
4 Healthy language detection
5 Complete automatically
6 Allows the user to browse the window
Disadvantages

1 Need more 70mb to run.

2 Bigger program
3 It takes longer time to load
4 Need training to use.

5. Wix

St name Web Design and Development 32 | P a g e

 Advantages

1 This interface is practical and useful.

2 No need of staying in the long-term plan.

3 If you have an issue with your site for some reason, you need to connect to Wix to get the solution
you need.
Disadvantages

1 Plans are limited

2 The opening plan does not remove ads from your site.
3 The creativity that can be carried out can be limited

6. Word press

Advantages

1 Easy to use

2 You can manage from any computer connected to internet.

3 Extend your site's functionality with the plugin
4 No need to wait any longer for your web designer to make simple updates to your site
5 Does not require HTML editing or FTP software

Disadvantages

1 It’s an open source.

2 WordPress sites have many common code and add-ons to include the functionality of the site, so it
may be slow to respond to the site, it decreases the load time.
3 The plugins are there to improve the functionality of the site, but they could also work the other way
around.

St name Web Design and Development 33 | P a g e

 7. Notepad++

Advantages

1 Translate the editor.

2 Automatically emphasizes each rule with its colors automatically, which facilitates the
identification or search of different types of elements.
3 It is an open source
4 It can be changed when the user need.
Disadvantage

1 An error occurred while writing longer than the resolution of the Notepad ++

2 Coding program is limited.

3 Internet connection is compulsory.

St name Web Design and Development 34 | P a g e

 design flexibility, performance, functionality, User Experience (UX) and User Interface (UI).
Evaluate the tools and techniques available to design the web application gicven in the
scenario.

In the simplest terms, UX design is about making the user’s experience with the product the best it
can be. It aims to attract people to a site they are interested in; then, once they are there, to make
their journey from the homepage to purchasing the product as easy and fun as possible.

In recent years, the term User Interface has become synonymous with technology and software, but
this wasn’t always the case.

Despite how we use the terminology now, user experience was a term that simply applied to how a
person feels about using a system.

The term ‘user experience design’ was first coined by  Don Norman in 1995 while he was the vice
president of the Advanced Technology Group at Apple. He said:

“I invented the term because I thought human interface and usability were too narrow. I wanted to
cover all aspects of the person’s experience with the system including industrial design, graphics,
the interface, the physical interaction, and the manual.”

Norman also authored the book ‘The Design of Everyday Things’ which pioneered the
prioritization of usability and function over aesthetics and remains highly influential in design
circles today.

As interest in the field has grown, “UX” has become more of an umbrella term for a number of
different fields, such as User Research, Information Architecture, Usability Engineering, Service
Design, and so on.

Web Design and Development 1

What Is Usability

Usability is the ease of use and learnability of a human-made object.

This concept ties in directly with part one of why we use UX design—because it improves the
experience a user has with a product. The easier a product is to use and learn, the better the user’s
experience with it.

However, before a product is easy to use, it has to actually solve a user’s problem. More often than
not, this is also the job of the UX designer: to figure out what users actually need.

To find out more, check out this guide to usability by CareerFoundry student, Tim Gaertner.

Web Design and Development 2

When learning about the core principles of UX design, it can help to get into the head of a working
UX designer and understand how they see the world.

Allison House, visual artist, designer, and speaker told us how she approaches her work:

“My design mantra is go wide, prioritize, go deep. Get a lay of the land, use that to figure out
what’s important, and start knocking things out in order of priority.”

UX design is primarily a people-orientated profession, and therefore a key UX design skill is the
ability to understand the needs and behaviors of the user of the site, application, or product. The UX
designer then seeks to align those needs and desires to the business goals of the company they are
working for. And, as we mentioned earlier, the UX designer is always seeking to make each
action useful, usable, and delightful for the user.

Web Design and Development 3

 Task 3

Design a suitable web application solution for the given scenario using PHP, JS and MySQL
(Screenshots of important code lines with proper comments and user interfaces filled with
sample data must be attached to the documentation). Apply a database design for the
proposed system and provide the well normalized database design of the proposed system.
Provide evidences of the design, multipage website supported with fidelity wireframes and a
full set of client and user requirements

Figure 5 Login

Web Design and Development 4

 Figure 6 Login cade

Figure 7 login code 02

Web Design and Development 5

Figure 8 admin menu

Figure 9 admin menu code 02

Web Design and Development 6

Figure 10 admin menu

11 desi pat

Web Design and Development 7

Figure 12 admit patient

Figure 13 admit patient code

Web Design and Development 8

Web Design and Development 9
Figure 15 word room bed ava code

Web Design and Development 10

Figure 16 word room bed ava

Web Design and Development 11

\

Figure 17 staff inf code

user requirements

As per the designed websiteArogya Health Care hospital has a different types of users namely;
admin, receptionist, Doctor and nurce, each staff having a different User Id and unique passwords.
According to the need following function are distributed among the users for the effective
management. Such as Admit patient, Staff Schedule, Movement patient , Staff and patient Details
View etc...
Following are the functions of distributed among the users;

i. menu receptionist
Web Design and Development 12
 1. Add patient
2. admit patient
3. distarge pateint
4. patient bed reservation
5. patient ward,Room and Bed Distributed function among the
users

ii. menu Admin

1. Medcine History
2. Scan History
3. Staff Information
4. Staff Shadule
5. ward,Room and Bed Availablity

Web Design and Development 13

Attributes of the web pages

Table 1 Attributes of the web pages

Web Pages Attributes
Add patient Full Name, Address, NIC, Date of birth, Age, Phone
Number, Gender

admit patient patient ID, Admit Date, distarge Date,Diseasc,

NIC

distarge pateint patient ID, distarge Date

patient bed reservation patient ID, ward number, Room number, Bed number,
Place
patient ward,Room and Bed patient ID, ward number, Room number, Bed number,
Place
Medcine History patient ID, Medcine 01, Medcine 02, Medcine 03,
Medcine 04, Medcine 05
Scan History patient ID, Scan 01, Scan 02, Scan 03, Scan 04, Scan 05,

Staff Information Staff ID, Staff name, NIC, Phone Number, type,
Password
Staff Shadule Staff ID, Ward number, operation theater, ETU, date

ward,Room and Bed Availablity ID, ward number, Room number, Bed number,
Availeble

Web Design and Development 14

Normalized database design

Database normalization is a database schema design approach that involves modifying an existing
schema to reduce data redundancy and reliance. To improve the clarity of data organization,
normalization divides a huge table into smaller tables and defines relationships between them.

Figure 18 SQL

Figure 19 SQL 02

Web Design and Development 15

Figure 20 SQl

Figure 21
22 SQL 05
03

Web Design and Development 16

Figure 23 SQl 06

Web Design and Development 17

Figure 24 SQl 07

Figure 25 SQl 08

Web Design and Development 18

Figure 26 SQL 06

Web Design and Development 19

 3.2 Compare and contrast the multipage website created to the design document. Use your design
document with appropriate principles, standards and guidelines to produce a branded, multipage
website supported with realistic content and Critically evaluate the web design ,development
process against your design document analyisng any technical challenges you faced during the
development.

Development timescales

Phase 1: Requirement collection and analysis:

The first stage of the SDLC process is the requirement. It is organized by senior team members with input
from all industry stakeholders and domain specialists. At this point, the quality assurance requirements are
planned for, as well as the hazards associated. This stage provides a clearer understanding of the project's
overall scope as well as the anticipated difficulties, opportunities, and instructions that prompted it.

Requirements Gathering stage need teams to get detailed and precise requirements. This helps companies
to finalize the necessary timeline to finish the work of that system.

Phase 2: Feasibility study:

The next step after completing the requirement analysis phase is to develop and document software
requirements. The 'Software Requirement Specification' document, also known as the 'SRS' document,
was used to carry out this process. It encompasses everything that needs to be conceived and developed
during the project life cycle. There are five different kinds of feasibility checks:

1. Economic: Can we complete the project within the budget or not?

2. Legal:Can we handle this project as cyber law and otherregulatory

framework/compliances.

3. Operation feasibility: Can we create operations which is expected by the client?

4. Technical: Need to check whether the current computer system can support the software

5. Schedule: Decide that the project can be completed within the given schedule or not.

Web Design and Development 20

Phase 3: Design:

The system and software design documents are prepared in this third phase according to the requirement
specification document. This aids in the definition of the overall system architecture. This design step is
used as input for the model's following phase. During this phase, two types of design documents are
created

High-Level Design (HLD)

1. Brief description and name of each module

2. An outline about the functionality of every module

3. Interface relationship and dependencies between modules

4. Database tables identified along with their key elements

5. Complete architecture diagrams along with technology details

6. Low-Level Design (LLD)

7. Functional logic of the modules

8. Database tables, which include type and size

9. Complete detail of the interface

10. Addresses all types of dependency issues

11. Listing of error messages

12. Complete input and outputs for every module

Phase 4: Coding:

Web Design and Development 21

 After the system design phase, the coding step begins. Developers begin building the entire system in
this phase by developing code in the programming language of choice. Tasks are separated into sections
or modules and given to different developers during the coding phase. It is the most time-consuming step
of the Software Development Life Cycle. During this phase, the developer must adhere to a set of
predetermined code principles. They must also produce and implement code using programming tools
such as compilers, interpreters, and debuggers.

Phase 5: Testing:

When the software is finished, it is put into the testing environment. The testing team begins testing the full
system's functionality. This is done to ensure that the entire application functions as expected by the
customer. QA and testing teams may discover flaws or defects at this phase, which they report to developers.
The development team fixes the issue and sends it back to QA for another round of testing. This procedure is
repeated until the program is bug-free, stable, and meets the system's business requirements.

Phase 6: Installation/Deployment:

The final deployment procedure begins after the software testing step is completed and there are no
defects or errors remaining in the system. The final software is released and tested for deployment faults,
if any, based on the project manager's feedback.

Phase 7: Maintenance:

Once the system is deployed, and customers start using the developed system, following 3 activities
occur

1. Bug fixing - bugs are reported because of some scenarios which are not tested at all

2. Upgrade - Upgrading the application to the newer versions of the Software

3. Enhancement - Adding some new features into the existing software

The main focus of this SDLC phase is to ensure that needs continue to be met and that the system
continues to perform as per the specification mentioned in the first phase.

The Total time duration taken to complete HMS is 3 months.

Cost benefit analysis

Web Design and Development 22

A cost-benefit analysis is a decision-making technique used by businesses. The benefits of a situation or
action are added up, and then the costs of doing that action are subtracted. Some consultants or analysts
create models to put a monetary value on intangible elements like the benefits and expenses of living in a
certain area.

Table 2 Cost benefit analysis

Description Amount

Web page designing 10,500.00

Style of design 8,500.00

Responsive design 1500.00

Database integration 4,500.00

CMS features 3,500.00

Hosting at HostGator 5,800.00

Copy rights of pages 3,650.00

SEO Optimization 8,300.00

Total estimated quote 46,250.00

Web Design and Development 23

Web layout design

Client-side:

1. HTML- Create webpages and layouts.

2. JAVA Script- Dynamic functions.

3. CSS- Styling purposes

Server-side:

1. PHP- Interconnect with server side

2. MySQL- Database integration

Web Design and Development 24

 Task 04

1.1 QA process is expected to discover design issues and development errors while testing a
product’s user interface (UI) and gauging the user experience (UX). Evaluate the Quality
Assurance (QA) process and review how it was implemented during your design and
development stages.

Quality Assurance

Quality assurance (QA) is any systematic process of determining whether a product or service
meets specified requirements.

QA establishes and maintains set requirements for developing or manufacturing reliable

products. A quality assurance system is meant to increase customer confidence and a company's
credibility, while also improving work processes and efficiency, and it enables a company to
better compete with others.

QA Process and Development Steps

Initially, QA helps design and control the development process in a way that prevents
serious issues during the project. To make this happen, QA engineers work on the project
together with other team members (product owner, project manager, business analyst,
and dev lead) throughout the complete software development cycle. The number and the
order of QA activities may vary from project to project, depending heavily on the scope of
the work and the project aims.

Development process

1. Analysis of requirements

2. Design

3. Implementation

4. Verification or testing

5. Maintenance

Web Design and Development 25

Steps to be process in QA

1. Review of requirements

2. Test planning / writing test cases

3. Unit testing

4. Integration testing

5. System testing

6. Performance testing

7. Security testing

8. Cross-browser testing / cross-platform testing

9. Updating test cases

10. Regression testing

Figure 27 Steps to be process in QA

Web Design and Development 26

STEP ONE: REVIEW REQUIREMENTS AND DOCUMENTATION.

QA engineers start their work on the project in parallel with documentation generation. They
review the requirements and documentation for:

1. completeness

2. redundancies

3. clarity

4. consistency

5. executability

6. verifiability

The aim is to analyze system architecture and technologies for discrepancies.

For this step, think about using specialized software for documentation review, like Confluence.
You can gather all related documentation which is used throughout the whole project, and
maintain an internal knowledge base. Every team member can see any changes as soon as any
requirements or documents are changed, added, updated, or deleted.

STEP TWO: PLAN AND PREPARE TEST CASES

When the requirements have been established, it is time to start planning test cases, i.e. - describe the
actions QA engineers perform to make sure the piece of software functions as planned. In case the
volume of such cases turns to be really significant, you can also use special tools
like TestRail or Zephyr for writing test cases. Both pieces of software allow creation and modification of
tests, and track results using metrics.

Web Design and Development 27

1. Smoke testing comes first. QA engineers lightly check that the software, or its module, functions as
planned. When passed, further investigation begins. 

2. Integration testing – verify that different components work as a single system. 

3. Performance testing that includes: 

Load testing – check system behavior for normal and expected peak load 
Stress testing – determine critical load after which the system breaks down 

4. Security testing – ensure the solution has a sufficient protection level. 

5. Cross-browser testing/cross-platform testing – check that the software works smoothly on different
browsers (Chrome, Mozilla, Safari) or platforms (Android, iOS, Windows Phone). This is especially
important for web and hybrid apps. 

6. Regression testing – detect bugs in the code that was tested previously. Usually needed when adding
new features or making any updates to an existing system. 

STEP FOUR: REPORT AND MEASURE

When a QA engineer discovers a bug, he/she records it in a bug tracking system which is also a project
management system. For this purpose, you may use Jira or Redmine, both being highly configurable
software. They enable easy tracking of issues of any level, from a broken login form to security
problems, and all team members can see real-time task updates. This simplifies communication inside
the team and helps keep a clear overview of the improvement process.

Each issue gets a priority level from urgent to low, which the development team then resolves based on
time and people available.

STEP FIVE: VERIFYING FIXES

When a developer fixes an issue he/she informs the responsible QA engineers, who verify it. The ticket
in the bug tracking system is closed when no issue is detected. This rule applies: no bug can be marked
as fixed until it is verified.

Web Design and Development 28

Conclusion

Website quality assurance specialist is responsible for making sure all our websites are pixel perfect in
design, functioning as they should and meet the brief. You will also be reviewing print content to make
sure formatting, and files specs are as they should be, while making sure browser and device
compatibility has been done.

Web Design and Development 29

1.2 Create a suitable test plan for the developed system and critically evaluate the results of your
Test Plan . Include a review of the overall success of your multipage website; use this
evaluation to explain any areas of success and provide justified recommendations for areas
that require improvements.

Software testing is defined as an activity to check whether the actual results match the expected
results and to ensure that the software system is Defect free. It involves execution of a software
component or system component to evaluate one or more properties of interest. Software testing
also helps to identify errors, gaps or missing requirements in contrary to the actual requirements.
It can be either done manually or using automated tools. Some prefer saying Software testing as
a White Box and Black Box Testing. In simple terms, Software Testing means Verification of
Application Under Test.

Typically Testing is classified into three categories.

1. Functional Testing

2. Non-Functional Testing or Performance Testing

3. Maintenance (Regression and Maintenance)

Web Design and Development 30

 Table 3 Testing is classified into three categories

Testing Category Types of Testing

Functional Testing Unit Testing Integration Testing Smoke

UAT (User Acceptance Testing) Localization

Globalization

Interoperability

Non-Functional Testing Performance Endurance Load Volume Scalability

Usability

Maintenance Regression Maintenance

Web Design and Development 31

Testing Plan

Table 4 Testing Plan

Web Design and Development 32

Test case No Objective

1 Opening the loginpage

To check if Admit patient.

To check if distarge patient.

To check if user/member login validation works or

not when wrong details are provided.

Opening the homepage

Web Design and Development 33

 able 5 Test Case 1

Test Case No.: 1

Objective:

Opening the loginpage

Input Opening the loginpage

Desired Output: Site be opened

Figure 28 login page

Actual Output: Site be opened.

Comments: Test case succeeded.

Web Design and Development 34

Test Case No.: 2

Objective:

To check if Admit patient

Input Admit patient Details

Admit patient should be added in the system.

Desired Output:

Admit patient_insert added in the system.

Actual Output:

Comments: Test case succeeded.

Web Design and Development 35

Figure 29 admit patient page

Web Design and Development 36

Figure 30 admit patient sql
Web Design and Development 37
 Table 6 Test Case 3

Test Case No.: 3

Objective: To check if distarge patient.

Input distarge patient Details

Desired Output: distarge patient should be added in the system

Actual Output: distarge patient _insert added in the system

Comments: Test case succeeded.

Web Design and Development 38

 Figure 31 distrage patient page

Figure 32 distrage patient sql

Web Design and Development 39

Web Design and Development 40
 Test case 4

Table 7 Test case 4

Test Case No.: 4

Objective: To check if user/member login validation works or

not when wrong details are provided.

Input Wrong Details

Desired Output: A message that says

‘Login Failed. Please check your Details'.

Actual Output: User/ menu admin with the message saying to

provide a valid email

Comments: Test case succeeded.

Figure 33 login error page

Web Design and Development 41
Table 8 Test case 5

Web Design and Development 42

Test Case ID 5

Description Opening the homepage

Action Opening homepage

Expected results Site must be opened by using localhost

Actual Result Site was successfully opened from localhost

Status Pass

Web Design and Development 43

Figure 34 menu admin page

Figure 35 menu reception page

Web Design and Development 44

Web Design and Development 45
 References

Eyerys-2019, Communication Protocol used in web designing,[ONLINE]

https://www.eyerys.com/articles/web-communication-protocols
[Accessed]

Techtarget.com, 2018, Server Hardware and its type [Online] Available at:
https://searchdatacenter.techtarget.com/feature/Learn-the-major-types-of-server-hardware-
and-their-pros-and-cons [Accessed]

invensis.net-2017, Relationship between front end and back end, [Online]

[Accessed on] : https://www.invensis.net/blog/it/difference-between-front-end-and-back-end-
development/

damngooddegital.ie,2017, Comparison of custom made and website creation tool [Online]

https://www.damngooddigital.ie/blog/web-design/custom-vs-template/
[Accessed on]

medium.com,2018, evaluate the web design and development process [Online]

https://medium.com/@cjhawkings/building-a-website-from-the-perspective-of-an-amateur-
website-builder-7d82275c4642 [Accessed on]

marutitech.com,2016, Quality Assurance, [Online] https://www.marutitech.com/5-challenges-in-

web-application-development/ [Accessed on]

Web Design and Development 46