You are on page 1of 150

lOMoARcPSD|19670363

E126643 WDD Niluksha - WDD Assignment

HND in Computing (ESOFT Metro Campus)

Studocu is not sponsored or endorsed by any college or university


Downloaded by udesh ishanka (udeshedu@gmail.com)
lOMoARcPSD|19670363

Page 1 of 149

Higher Nationals
Internal verification of assessment decisions 3 BTEC (RQF)

INTERNAL VERIFICATION – ASSESSMENT DECISIONS

Programme title BTEC Higher National Diploma in Computing

Assessor Mr. Abdur Rahman Internal


Verifier
Unit(s) Unit 10: Web Design and Development

Assignment title Online Hospital Management System

Student’s name Niluksha Dulmina

List which assessment criteria the Pass Merit Distin


Assessor has awarded. ction

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 student work?
Y/N

Has the work been assessed accurately?


Y/N
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 amend?


Y/N

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 2 of 149

Assessor signature Date

Internal Verifier signature Date


Programme Leader signature(if required)
Date

Confirm action completed


Remedial action taken

Give details:

Assessor signature Date

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

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 3 of 149

Higher Nationals - Summative Assignment Feedback Form

Student Name/ID Niluksha Dulmina / E126643


Unit Title Unit 10: Website Design & Development
Assignment Number 1 Assessor Mr. Abdur Rahman
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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 4 of 149

Assignment Feedback
Formative Feedback: Assessor to Student

Action Plan

Summative feedback

Feedback: Student to Assessor

Assessor signature Date

Student signature Date

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 5 of 149

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

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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 6 of 149

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 people9s 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.

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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 7 of 149

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 aspect 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: ndulmina99@gmail.com Date: 23-09-2022


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

Assignment Brief
Student Name /ID Number Niluksha Dulmina / E126643

Unit Number and Title Unit 10- Web Design and Development

Academic Year 2021/2022

Unit Tutor

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 8 of 149

Assignment Title Online Hospital Management System

Issue Date

Submission Date

IV Name & Date

Submission Format:

Part 1.
Report- Submit a professional report with appropriate report formatting and guidelines followed. All the
research data should be referenced along with in-text citations using Harvard referencing system.

Part 2
A fully functional web solution

Unit Learning Outcomes:

LO1 Explain server technologies and management services associated with hosting and managing
websites.
LO2 Categorize website technologies, tools and software used to develop websites.
LO3 Utilize 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:

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 9 of 149

Assignment Brief Scenario.


8Apex Design Works9 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 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)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 10 of 149

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 Identify 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 evidence.

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

2.1 Considering the requirements 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
given 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

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 11 of 149

web design, development process against your design document analysing 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.

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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 12 of 149

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
site9s 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
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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 13 of 149

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 analyze 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 area 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.

Observation Sheet

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 14 of 149

Activity Activity Learning Feedback


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

Comments:

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


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

Pearson Higher Nationals in


Computing
Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 15 of 149

Unit 10: Web Design & Development


Assignment 01

Assignment Name : Assignment 01

Student Name : Niluksha Dulmina

Student ID : E126643

Batch No : HND-COM SEP/OCT WEEKDAYS

Lecturer Name : Mr. Abdur Rahman

Name of Institute : ESoft Metro Campus

Date of Submission : 2022-09-23

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 16 of 149

Table of Contents
1 Task ............................................................................................................................ 18
Server technologies and management services associated with hosting and managing
websites (LO1) ................................................................................................................... 18
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)........... 18
1.1.1 What are web technologies? ........................................................................ 18
1.1.2 About Communication Protocols ................................................................. 18
1.1.3 About Server Hardware ............................................................................... 28
1.1.4 About Operating systems ............................................................................. 34
1.1.5 About Web Server Software ........................................................................ 44
1.1.6 About Web Browsers ................................................................................... 49
1.1.7 Uniform Resource Locator (URL) ............................................................... 52
1.1.8 PC Hardware and Server Hardware ............................................................. 62
1.1.9 Publishing the Application ........................................................................... 63
1.2 Identify 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.
64
1.2.1 What is the DNS?......................................................................................... 64
1.2.2 How Does DNS Work? ................................................................................ 64
1.2.3 How domain names are structured ............................................................... 69
1.2.4 Search engine optimization .......................................................................... 70
1.2.5 Web Development Technologies ................................................................. 81
1.3 Web Development Framework ........................................................................... 89
1.3.1 Web Development Techniques .................................................................... 91
1.3.2 Web Development Tools ............................................................................. 93
1.3.3 Why we would Develop Web Applications? ............................................... 95
1.3.4 Web Application advantages ....................................................................... 95
2 Task ............................................................................................................................ 98
2.1 Considering the requirements 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. ............... 98
2.1.1 Difference between Frontend and Backend ............................................... 101
2.1.2 PRESENTATION LAYER ....................................................................... 101

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 17 of 149

2.1.3 Aplication Layer ........................................................................................ 102


2.1.4 Custom Built Website ................................................................................ 104
2.1.5 Custom Built Website vs Template Website ............................................. 105
3 Task .......................................................................................................................... 106
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 desig for the proposed system and provide the well normalized database
design of the proposed system. Provide evidence of the design, multipage website
supported with fidelity wireframes and a full set of client and user requirements. ..... 106
3.1.1 Client and User Requirements ................................................................... 106
3.1.2 ER Diagram ............................................................................................... 108
3.1.3 WIRE FRAME........................................................................................... 109
3.2 Technical challenges you faced during the development.................................. 126
4 Task .......................................................................................................................... 126
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. ................................................................................... 126
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. .............................................. 127
4.2.1 Testing criteria ........................................................................................... 133
4.2.2 User Guide ................................................................................................. 140
5 Referents .................................................................................................................. 148

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 18 of 149

1 Task

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.1.1 What are web technologies?

• Network technologies refer to the various tools and techniques used in


communication between different types of devices on the Internet. A web browser
is used to access web pages. A web browser can be defined as a program that
displays text, data, images, animations, and videos on the Internet. Hyperlinks on
the World Wide Web can be accessed through programming interfaces provided
by web browsers.

We can see the 3 technologies of the web


• HTML, CSS, and JavaScript.

1.1.2 About Communication Protocols

• Computers are like humans in that they communicate through rules and protocols.
These protocols are designed for efficiency and are based on computer-specific
conventions and regulation. Each rule is defined in its own way and has its own
name. These protocols define and define communication standards. Data Transfer
Operations: There are many different protocols, and some more examples of these
various protocols include, but are not limited to, TCP/IP, PPP, SMTP. Protocols

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 19 of 149

such as HTTP, HTTPS, FTP, SNMP, RTP, and IMAP are common
communication protocol.

• Protocol: A set of rules and regulations is called a protocol.


• Communication: Exchange of information from one system to another system
with a medium is called communication.
• Communication Protocol: A set of rules and regulations that allow two
electronic devices to connect to exchange the data with one and another.

TCP/IP Protocol
• The communication protocol known as TCP enables applications and computing
devices to exchange messages over a network. TCP stands for Transmission
Control Protocol. It is made to effectively move data and messages through
networks and send data packets over the Internet. Is one of the key standards
established by the Internet Engineering Task Force that establishes the regulations
of the Internet (IETF). It is one of the most popular protocols for end-to-end data
transport on digital networks.
• Data is organized by TCP for transmission between servers and clients. It ensures
the accuracy of data transmitted through the network. TCP establishes a

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 20 of 149

connection between the source and destination before sending data and makes
sure that the connection is kept open until data is sent. Then, in order to maintain
data integrity throughout the process, it separates huge volumes of data into
smaller packets.

How Does TCP/IP Work?


• Data communication on the Internet is typically done using the TCP/IP protocol.
For the purpose of enabling precise and reliable data transmission between
equipment, the US Department of Defense developed it. In order to avoid sending
the complete message again during the event of a transmission error, it divides
messages into packets. Upon arrival at their destination, packages are
automatically reassembled. Depending on whether the initially chosen route
becomes overloaded or unavailable, every packet may travel a different path
between the source and destination computers.
• TCP/IP separates communication activities into layers to maintain process
standardization without requiring hardware and software vendors to handle
management responsibilities directly. Before reaching the destination device, the
data packets must pass through four levels. TCP/IP then traverses through the
layers in reverse order to regain the message to its original format.
• The TCP establishes and maintains a connection between applications or devices
as a connection-based protocol until the data exchange is complete. It decides how
the original message should be divided into packets, numbers and reassembles the
packet data, and then transmits them across switches, routers, security gateways,
and other network devices before sending them to their final destination.
Additionally, TCP sends and receives packets from the network layer, manages
flow control, handles the transmission of any missed packets, and makes sure all
packets arrive at their intended locations.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 21 of 149

HTTP Protocol

• An application-layer protocol for distributed, collaborative hypermedia


information systems is called the Hypertext Transfer Protocol (HTTP). Since
1990, it has served as the foundation for data transmission on the Internet (or
World Wide Web). The stateless, general-purpose protocol known as HTTP can
be used for a variety of tasks and supports request methods, error codes, and
header extensions.
• Hypertext Transfer Protocol (HTTP) is basically a TCP/IP-based communication
protocol used to deliver data (HTML files, image files, query results, etc.) to the
World Wide Web. It provides a standardized way for computers to communicate
with each other. The Hypertext Transfer Protocol specification defines how client
request data is constructed and sent to the server, and how the server responds to
those requests.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 22 of 149

What is the purpose of HTTP?

• The first text-based, interactive web browser, the original World Wide Web, was
developed alongside HTML. The protocol is still one of the main ways to access
the Internet today.

How does HTTP work?


• Through the transmission of hypertext messages between clients and servers,
HTTP provides users with a method of interacting with web resources like HTML
files. To communicate with servers, HTTP clients typically establish Transmission
Control Protocol (TCP) connections. Specific request methods are used by HTTP
to accomplish a variety of activities. All HTTP servers are using the GET and
HEAD methods, however not all of them allow requests using the other methods
listed below:

❖ GET requests a specific resource in its entirety


❖ HEAD requests a specific resource without the body content
❖ POST adds content, messages, or data to a new page under an existing web
resource
❖ PUT directly modifies an existing web resource or creates a new URI if
need be
❖ DELETE gets rid of a specified resource
❖ TRACE shows users any changes or additions made to a web resource

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 23 of 149

FTP Protocol

• FTP stands for <File Transfer Protocol" and refers to a set of rules that govern
how computers transfer files from one system to another over the Internet.
Businesses use his FTP to send files between computers, while websites use his
FTP to upload and download files from his website's servers.
File transfer protocols allow individuals and businesses to share electronic files
with others even when they are not in the same location. This can be done using
an FTP client or the cloud. Both sides require an active internet connection
regardless of the option.

There are two types of connections in FTP:

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 24 of 149

• Control Connection: The communication rules used by the control


connection are basic. We can transmit one line of command or one line of answer
at a time via control link. The control processes are connected through means of
control. Throughout the whole interactive FTP session, the control connection is
active.

• Data Connection: Because data types might vary, The Data Connection
employs highly complicated rules. Between data transmission operations, a data
link is created. When a command to transfer a file is received, the data connection
begins, and it shuts when the file has been sent.

Advantages of FTP

❖ Speed: FTP has a lot of benefits, including speed. One of the quickest
methods for transferring files from one computer to another is using FTP.
❖ Efficient: We don't have to finish all the procedures to retrieve the whole
file, therefore it is more efficient.
❖ Security: To access the FTP server, we need to login with the username
and password. Therefore, we can say that FTP is more secure.
❖ Back & forth movement: We can move files back and forth via FTP.

Assume you are the firm management, and you transmit information to all
of the employees, who then send information back to you on the same
server.

Disadvantages of FTP

❖ All FTP transfers must adhere to the industry norm of being encrypted.
But not all FTP providers are created equal, and not all providers support
encryption. We must thus keep an eye out for FTP services that offer
encryption.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 25 of 149

❖ FTP performs both sending and receiving huge files over a network, or
two actions. The maximum size of the file that may be delivered is 2GB,
though. Additionally, you are unable to send transfers to numerous
receivers at once.
❖ Clear text transmission of passwords and file contents makes unauthorized
listening possible. It is therefore extremely possible for attackers to use a
brute strength assault to attempt to guess the FTP password.

SMTP Protocol

• Email is sent and received via SMTP, which is occasionally used in conjunction
with IMAP or POP3 to handle incoming messages. SMTP generally transmits
messages to servers for forwarding. Although SMTP can transmit and receive
mail, it is typically delegated to other protocols because of its poor queuing
capabilities. Although proprietary systems like Gmail use their own servers and
have their own mail exchange protocol, they nonetheless transmit email via the
tried-and-true SMTP standard.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 26 of 149

• The SMTP model is of two types: End-to-end method & Store-and- forward
method

How SMTP Works

• The client/server concept underlies the three-step procedure that makes up


SMTP's operation. A message is sent over SMTP from an email client, such as
Gmail, Outlook, etc., to an email server in the first step, and then that email server
transmits the message to the receiving email server in the second step. The
recipient server's third step involves downloading incoming mail over IMAP using
an email client and putting it in the recipient's inbox.

Advantages of SMTP
• It enables mail messages sent from one computer to another to be sent across the
internet.
• It is a trustworthy way to communicate. It resends unsuccessfully sent messages
until the recipient gets them.
• Additionally, it enables bulk email marketing, which enables the simultaneous
sending of emails to a huge number of recipients.

PPP Protocol

• PPP is a protocol often used to provide SLIP-like functionality. It is the most


reliable protocol and can carry different types of packets along with IP packets.
This may also be required for dial-up and leased router-to-router lines. It usually
supports frame methods to display frames.
• It can transmit graphics over serial links as an encapsulation protocol for IP traffic
on point-to-point connections. It covers IP address responsibilities and
enforcement, asynchronous and bitwise synchronous encapsulation, network

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 27 of 149

protocol multiplexing, link configuration, and more. Extensible Link Control


Protocol (LCP) and Network Control Protocol (NCP) are supported.

Components of PPP

▪ Encapsulation Component
▪ Link Control Protocol
▪ Authentication Protocols
▪ Network Control Protocols

Services provided by PPP

• It establishes the frame format used during transmission.


• It outlines the procedure for creating links. The PPP protocol handles "how this
link establishes" whenever a user creates a connection to a server.
• It outlines the data exchange procedure, including the pace at which data will be
sent.
• The encapsulation is the PPP protocol's key component. It specifies how
information in the payload and network layer is contained in the data link frame.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 28 of 149

1.1.3 About Server Hardware


• A server is a computer used to store and process data for other computers. Servers
are typically used by businesses to handle high-end processing, such as hosting
databases or centralized file storage. They can be software servers running on
software or hardware servers with physical components.

• Some server hardware decisions you will need to make include the following:

❖ Form Factor: The ideal option for small organizations is a tower-shaped


dedicated entry-level server.
❖ Processor: To increase performance and data throughput, use a processor
designed specifically for servers.
❖ Memory: Purchase the most RAM you can afford, and check for expansion
slots so you may add more later.
❖ Storage: Instead of IDE, go for SATA or SCSI hard drives.

• Another implication could be that the machine has special hardware designed for
servers that are more reliable than normal computer hardware, plus additional
monitoring tools that are useful for managing/maintaining/monitoring servers but
completely useless for normal computers (Generally) computer. Tower servers,
rack servers, and blade servers are the three types of server hardware available.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 29 of 149

Rack Servers
• A rack server, also known as a rack server, rack server, or rack computer, is a
computer designed to fit in a rectangular structure called a server rack.
• Advantages of server racks include space savings in rack servers, increased
expandability, maximum airflow when combined with cooling systems, and ease
of routine computer maintenance and diagnostics. put them out. Rugged rack
servers are often used to support military and industrial applications.

These are some of top Rack Servers:

Cisco UCS C240 M6

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 30 of 149

Dell EMC PowerEdge R750

Fujitsu PRIMERGY RX4770 M5

HPE Proliant DL380 Gen10

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 31 of 149

Tower Servers

• A server form factor known as a tower server resides in a standalone tower


cabinet, also known as a chassis configuration. Tower servers, similar to
traditional desktop tower computers, are considered the cheapest type of server.
Tower servers are great for small businesses that don't need a full data centre.
• Tower servers use minimal components and software, making it easier for
organizations to customize specific tasks, keep overhead low, and maintain an
upgrade strategy. Rack and blade server mounting capabilities make it a more
convenient option in terms of space and expandability. However, most
organizations don't need the equivalent of an entire metal frame of servers.
• Tower Server can support most basic applications and can be configured for
network purposes such as file management, communications, system security, and
web hosting.

Maintenance and usage


• Owner Servers may collaborate and accomplish a variety of functions. Because of
their autonomous nature, they are simple to integrate into existing networks.
Tower Servers require less upkeep than other servers since the data is kept in a

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 32 of 149

single tower rather than spread across several workstations. However, they could
need extensive cabling in addition to a personal display and a KVM for
administration.
• Since tower servers have the processing ability to handle a range of activities,
from managing corporate networks to general database administration, small
organizations typically choose them. While Dual CPU (two-socket) Tower
Servers offer a wider range of functionality to support more demanding
operations, Single CPU (one socket) Tower Servers are a more cost-effective
solution to handle basic office workload.

Benefits of a Tower Server

• Component density is lower than other servers due to the simplified architecture.
Tower Servers become simpler to cool as a result, lowering the risk of damage
from overheating.
• Tower Servers may be added in an endless number to a current network and are
easily recognized on the network. Businesses, for instance, may easily add more
servers to accommodate growth or rising demand.
• Customisable / upgradable. Tower Servers are easy to update if new features are
needed. Alternatively, you may configure your server to precisely meet your
requirements based on those demands.
• Compared to rack servers, tower servers are quieter. Again, this is a result of a
lesser frequency and less fans.

Blade Servers
• Blade servers are designed to overcome the space and energy constraints of a
typical data centre environment. Blade enclosures, also called enclosures, serve
the power, cooling, networking, and management needs of each blade. Each blade
server in an enclosure can be dedicated to one application.

A blade server can be used for this task:


▪ File sharing
▪ Database and application hosting

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 33 of 149

▪ SSL encryption of Web communication


▪ Hosting virtual server platforms
▪ Streaming audio and video content

• Basic components of server and personal computer hardware. Of course, they all
start from the motherboard. A system that connects all the organs of the human
body and communicates information between them. The central processing unit is
the brain.

• The nervous system is pictured as the main board, and the brain is unable to
separate the pulsing electrons that make up the human body into meaningful data,
instructions, and rules and transfer them to other components as needed. works
when it's impossible to remember keys or general knowledge. Use the user manual
to your advantage. As a result, every server, computer, and other device has a
memory device. The static or persistent storage component is the final crucial
element. This memory is a hard disk or other type of hard disk storage that is
present in computers. Use a man as an example; it's comparable to someone
holding a notebook in their hand. Refer it if necessary. These are the distinctions
between the hardware of servers and other computers.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 34 of 149

1.1.4 About Operating systems

This Is the main simple definition of operating system

• Software that controls computer operations and guides program handling (as
by assigning storage space in memory and controlling input and output
functions)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 35 of 149

What are the functions of the operating system?

Security: In order to safeguard user data, the operating system employs password
protection. It also guards against unwanted access to applications and user data. However,
in order to use external functionality, we must install virus protection software.

Control over system performance: The operating system keeps track of the
configuration of the entire system to aid in performance improvement. It also keeps track
of how quickly the system responds to service calls so that it can get a full picture of the
system. Through the provision of critical data required for problem-solving, this can assist
in enhancing performance.

Job Accounting: Operating systems always keep track of time and resources that are
used by various tasks and users, this information can be used to track resource usage for a
particular user or a group of users.

Error detecting aids: Operating systems continuously monitor the system, enabling
us to both identify flaws and prevent computer system failure.

Coordination of users' actions and other software: Operating systems assist


in arranging and allocating interpreters, compilers, assemblers, and other software to the
various computer systems' users.

Memory Management: The main memory, or primary memory, is controlled by the


operating system. Primary memory is a huge collection of words or bytes, where each
word or byte is given a specific location. It is a quick store, and the internal CPU of the
device may access it directly. A program must first be loaded in the main memory before
it can be run.

Processor Management: The OS controls which programs access the CPU first and
how long each process must remain in the multi - programming environment to do its
work. It's known as process scheduling.

Device Management: Device communication is controlled by an OS using the


appropriate drivers.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 36 of 149

File Management: For easy navigation and use, a file system is organized into
directories. These folders include additional directories and files.

We can see 5 types of Operating System:

1. Batch Operating System: With the assistance of an operator, related jobs


are grouped together into batches in a batch operating system, and these batches
are then carried out one at a time. Let's say, for illustration purposes, that there
are ten programs that need to be run. C++, C, and Java are all used to create
different types of programs. Now, each time we run these programs separately,
we must first load the compiler for that specific language before running the
program's code. What if, however, we produced a batch of these 10
programmers. The advantage of this method is that you only need to load the
compiler once for the C++ batch.
The advantage of this method is that you only need to load the compiler once for
the C++ batch. The compiler just needs to be loaded once for Java and C, and the
entire batch is then executed. The operation of a batch operating system is shown
in the following image.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 37 of 149

Advantages of Batch Operating System

• The system will take less time overall to complete all the programs.
• Multiple users can share the Batch Operating System.

Disadvantages of Batch Operating System

• Between two batches, manual interventions are required.


• Because batch loading and unloading takes much longer than execution
time, there is poor CPU utilization.

2. Time-Sharing Operating System: With the aid of the time-sharing idea,


many processes can run simultaneously in a multi-tasking operating system.
Therefore, in a time-sharing environment, we choose a time period, or "time
quantum," and when a process begins running, the execution only lasts for that
time period. Thereafter, other processes are given a chance to run for that time
period alone. The initial process will return to be performed in the following
cycle, but only for that time quantum before the next process arrives. This
procedure will carry on. The operation of a time-sharing operating system as
shown in the following figure.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 38 of 149

Advantages of Time-Sharing Operating System

• Each process is given an equal amount of time, which means that each process
has an equal chance of succeeding.
• Most of the time, the CPU will be busy, which is a good thing.

Disadvantages of Time-Sharing Operating System

• Because each process is given an equal chance to be run, processes with


greater priority will not have the opportunity to accomplish this.

3. Distributed Operating System: A distributed operating system consists of


several systems, each of which has its own CPU, primary memory, secondary
memory, and resources. A shared communication network is used to link these
systems together. Each system may do its duty on its own in this situation. One
user can access the data of some other machine and work accordingly, that is the
best feature of these distributed operating system. Therefore, these distributed
operating systems allow for remote access. The functioning of a distributed
operating system is shown in the following figure.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 39 of 149

Advantages of Distributed Operating System

• The effectiveness of the host machine is improved either by distribution of the


load.
• The failure of one system cannot halt the execution of operations because
other systems can manage it because the platforms are interconnected.
• Resources are shared between each other.

4. Embedded Operating System: An embedded operating system is made to


perform a particular task for a specific device that is not a computer. For
instance, the software utilized in elevators is solely focused on operating
elevators. So, this may serve as an illustration of an embedded operating system.
The software that is running on top of the embedded operating system. is
available to device hardware through the embedded operating system.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 40 of 149

Advantages Embedded Operating System

• It is quick because it is focused to a certain task.


• These require less memory and other resources to operate.

Disadvantages Embedded Operating System

• Only one job can be performed.


• It is difficult to upgrade or is nearly scalable.

5. Real-time Operating System: In situations when we are dealing with real-


time data, we employ real-time operating systems. So, as soon as the data arrives,
the process should be completed and there should be no dealy, i.e. no buffer
waits. Real-time OS is a time-sharing system based on the clock interrupt idea.
So, anytime you need to handle a huge number of requests in a short period of
time, Real-time Operating System should be used. For example, temperature
details in the petroleum business are critical, and this should be done in real-time
and in a very short amount of time. A minor hiccup can result in a life-or-death
catastrophe.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 41 of 149

• Hard Real-time: In this case, even a minor delay might result in significant
change. As a result, when time is of the essence, we employ Hard Real-time.
• Soft Real-time: The time limitation is not as critical here, but we are dealing with
real-time data.

Advantages Real-time Operating System


• There is maximum utilization of devices and resources.
• These systems are almost error-free.

Disadvantages Real-time Operating System

• The algorithms used in Real-time Operating System is very complex.


• Specific device drivers are used for responding to the interrupts as soon as
possible.

Examples for Operating Systems

Microsoft Windows: Since the 1980s, the Windows operating system has gone through
various iterations and upgrades (including Windows 95, Windows Vista, Windows
7/8/10, and so on). Microsoft Windows is a popular operating system that comes standard
with most new PCs. Microsoft continues to focus on enhancing its customers' experience,
hardware, and software with each new Windows update or release, making Windows
more accessible and simpler to use.

Microsoft Windows has a control panel, a desktop and desktop assistant, disk cleanup, an
event viewer, and other features. Many customers favor Microsoft Windows because it is
said to be compatible with a wide range of other software. Because Microsoft develops
many computer programs, they work best on Microsoft Windows.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 42 of 149

Apple macOS: Apple's macOS competes head-to-head with Microsoft Windows. Both
macOS and Windows are instances of proprietary operating systems, which denote that
the business created, developed, and is now selling its own OS. They are created and
marketed by the businesses; users are not supposed to mess with or modify them. The
exclusive macOS and OS X operating systems, the first of which was released 20 years
ago, power Apple and Macintosh computers. There are also earlier iterations or revisions,
such as:
Kodiak (OS X 10 Beta)
Lion (OS X 10.7)

• Mountain Lion (OS X 10.8)


• Mavericks (OS X 10.9)
• Yosemite (OS X 10.10)
• El Capitan (OS X 10.11)
• Sierra (macOS 10.12)
• High Sierra (macOS 10.13
• Mojave (macOS 10.14)
• Catalina (macOS 10.15)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 43 of 149

Google's Android OS: Based on the Linux operating system and other free and open-
source software, Google and other businesses use this OS to power their Android
smartphones and tablets. The main operating system for Google's mobile devices,
including tablets and smartphones, is Android. Since its debut as a competitor to Apple's
iOS for smartphone users, Android has grown in popularity and is still growing thanks to
new upgrades and intriguing features.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 44 of 149

Linux Operating System: Linux is distinct from Windows and Apple in that it is a
family of open-source systems rather than a proprietary one. In other words, it is open to
modification and distribution. Although it may not be the most well-known option on our
list, Linux is free and has a variety of open-source variants. Linux is well-liked because
it's simple to customize and gives users who know how to use it a wide range of
possibilities. Linux is a great option if you know how to alter and work with operating
systems. And if you find programming and back-end work intriguing, it could be a good
idea to get a Linux machine and start playing around with it.

1.1.5 About Web Server Software

• A web server is software and hardware that responds to client requests over the
World Wide Web using HTTP (Hypertext Transfer Protocol) and other protocols.
A web server's primary function is to show website content by storing, processing,
and distributing webpages to users. Web servers, in addition to HTTP, support
SMTP (Simple Mail Transmission Protocol) and FTP (File Transfer Protocol),
which are used for email, file transfer, and storage.
• Web server hardware is linked to the internet and allows data to be transferred
with other connected devices, whilst web server software regulates how a user

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 45 of 149

accesses hosted content. The web server process is an example of the client/server
concept. Web server software must be installed on all machines that host websites.

How to work web servers

• Web server software is accessed via website domain names and guarantees that
the site's content is delivered to the requesting user. There are various components
on the software side, including at least an HTTP server. The HTTP server
understands HTTP and URLs. A web server is a machine that holds web server
software as well as other website-related items such as HTML texts, pictures, and
JavaScript files.
• When a web browser, such as Google Chrome or Firefox, requires a file housed
on a web server, the browser will send an HTTP request to the server. When the
web server receives the request, the HTTP server will accept it, retrieve the
content, and provide it to the browser through HTTP.
• More specifically, when a browser requests a page from a web server, several
actions will occur. First, a URL will be entered into a web browser's address bar.
The IP address of the domain name will then be obtained by the web browser
either by translating the URL through DNS (Domain Name System) or by
searching in its cache. This directs the browser to a web server.

There is many different web server software are available and some of
different web server software include Apache http server, Apache tomcat
server, Lighttptd server, Jigsaw server:

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 46 of 149

• Apache http server: The Apache HTTP Server is a free and open-source web
server that distributes online content across the internet. It is often referred to as
Apache, and it soon became the most used HTTP client on the web following its
inception. It is often assumed that the term Apache comes from its development
history and method of improvement through patches and modules, although this
was corrected in 2000. The term was discovered to have arisen from the Native
American tribe's reverence for its tenacity and longevity.

• Apache tomcat server: Apache Tomcat is a web server. It enables users to run
Servlet and JAVA Server Pages based web applications. It may function as an
HTTP server. The Tomcat server's performance is inferior to that of the specified
web server. It is a standalone product with its own internal Web server. It may
also work in tandem with other Web servers such as Apache, Microsoft Internet
Information Server, and Microsoft Personal Webserver.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 47 of 149

• Lighttpd server: Lighttpd is an open-source web server. It is particularly suited


for areas with low resources since it utilizes very little CPU and RAM. It is also
compatible with both Windows and Linux operating systems.
Jan Kneschke, a German software engineer, first produced Lighttpd in 2003.
Kneschke originally created the program to demonstrate that a single server could
handle 10,000 concurrent connections, sometimes known as the c10k challenge.
Lighttpd, like other web server software, makes your content available online. When a user's
browser requests that your website be seen, the program receives the request, obtains the content of
your site, and displays it in HTML format.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 48 of 149

Jigsaw server: Jigsaw 2.0 is intended for technological demonstration purposes


only; it is not a full-fledged, ready-to-use web server. It is intended as a project to
demonstrate new technological breakthroughs for future HTTP and object-
oriented web servers.

Jigsaw is developed in the Java programming language, which is intended to


function in an object-oriented environment. The Java programming language is
utilized in practically all new-generation web servers. As a result, it is compatible
with all operating systems that support the Java development kit. Jigsaw has been
successfully implemented on Windows 95/98 NT, Windows 2000, and Solaris 2.x,
but it also works on AIX, OS/2, BeOS, and Mac OS. Jigsaw's development in
Java allows it to run on a variety of server systems.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 49 of 149

1.1.6 About Web Browsers

Types Of Web Browsers

Mozilla Firefox: Mozilla was originally the code name for Netscape Navigator, the
company's initial alligator-like mascot. Mozilla stood for "Mosaic Killer," since Netscape
desired to be the dominant browser, which it was for a while. In 1998, the whole
Netscape Communicator package's source code was made accessible to developers, and
Mozilla.org was established to serve as a clearing house for contributions. With the
assistance of AOL's Netscape business, it was transformed into the Mozilla Foundation in
2003 to give support for open-source initiatives. See also Firefox, Netscape Navigator,
and Netscape Communicator.

Importance of Mozilla Firefox

Mozilla Firefox is known for its speed. Though the Firefox browser needs a lot of
memory for operating efficiently. It may limit the multiple tasking of computers.
However, it provides better network security. It has advanced security options that protect
your system from spyware and malwares. It has strong popup broker and authentication
protocols which makes it safe from potential attackers using any unauthorized codes.
Further to enhance security users can use enhanced security options like No Script and
Flash block. It enables user to execute advanced code so that certain new features which
can make the browser more Intuitive.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 50 of 149

Google Chrome: The open-source Chromium project serves as the foundation for the
Google Chrome Web browser. Google Chrome was introduced in 2008, and it receives
numerous upgrades each year. It is compatible with Windows, Mac OS X, Linux,
Android, and iOS. The Google Chrome browser approaches Web security through
sandboxing. Each open webpage operates as its own process, preventing harmful malware
from influencing other pages (or the computer operating system at large). HTML5 and
cascading style sheets are also supported by the browser.

Google designed Chrome OS, an operating system for Web-based apps, to appear like the
Chrome Web browser. Chrome was the first major Web browser to integrate the search
box with the address bar, a feature that has subsequently been copied by other
competitors. Users may also sign in using their Google accounts, allowing them to sync
bookmarks and open Web sites across various devices. Google established the Chrome
Web Store in 2010, an online marketplace where users can purchase and install Web-
based programs that run within the browser. These programs are accessible as browser
extensions or as website links.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 51 of 149

Apple Safari: Safari first appeared in Mac OS X Panther in January 2003, and as of
2021, it had gone through fifteen major versions. The third iteration (January 2007) added
iPhone connectivity through iPhone OS 1, while the Macintosh edition boasted the
quickest browser performance at the time. The fifth edition (June 2010) added a less
distracting page reader, extensions, and development tools, as well as being the final
version for Windows. It gained functionality for Intelligent Tracking Prevention in the
eleventh version (September 2017). The thirteenth edition introduced several privacy and
application upgrades, including FIDO2 USB security key authentication and online Apple
Pay compatibility.

Op
era Mini: The Opera Mini web browser was derived from the Opera web browser.
Opera Mini accesses web pages using the compression proxy server provided by Opera
Software. Before transferring requested web pages to the mobile phone, the compression
server analyzes and compresses them. The compression ratio is 90%, and as a result, the
transfer speed is boosted by two to three times. The pre-processing improves
interoperability with web pages that are not optimized for mobile phones. However,
interactive sites that rely on a JavaScript-processing device do not function properly.
Opera Software announced in July 2012 that Opera Mini has 168.8 million users as of
March 2012. Opera announced 300 million unique Opera Mini active users and 150
billion page views supplied in February 2013. This represented a 25 million gain.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 52 of 149

1.1.7 Uniform Resource Locator (URL)

About URL

• A URL (Uniform Resource Locator) is a unique identifier used on the Internet to


find a resource. It is also known as a web address. URLs are made up of many
components, including a protocol and a domain name, that instruct a web browser
how and where to find a resource.

How is a URL structured?


• The URL includes both the name of the protocol used to access a resource and the
name of the resource itself. The initial portion of a URL specifies the principal
access medium protocol. The second portion specifies the IP address or domain
name 3 and perhaps subdomain 3 of the resource.
• HTTP (Hypertext Transfer Protocol) and HTTPS (HTTP Secure) for online
resources, mail to for email addresses, FTP for files on a File Transfer Protocol
(FTP) server, and telnet for a session to access distant computers are examples of
URL protocols. Most URL protocols are separated by a colon and two forward
slashes; "mail to" is separated by a colon alone.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 53 of 149

A URL can optionally include the following information after the domain:

▪ a URL that points to a specific page or file inside a domain.


▪ a network port for making the connection.
▪ a specific reference point within a file, such as a named anchor in an HTML
page; and query or search parameters, which are typically encountered in
URLs for search results.

URL history

• Data retention for Web activity has become a major privacy problem. The public
has increasing pressure on search engine and application service providers to be
honest about the information they gather, keep, and sell.
• For example, Google modified its Chrome privacy policy in March 2019. It
mentions that the search engine keeps information locally on your machine in its
basic browser mode. This data comprises browsing history, including URLs of
visited pages, as well as a cache of text, pictures, and other resources from those
pages. Google, on the other hand, captures and stores data for varying amounts of
time.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 54 of 149

Examples for Operating Systems

• Servers are the heart of every data center. These modular, boxy components have
all the computing power required to route and store data for each imaginable use
case.
• Depending on the size of the data center, organizations use blade, rack, or tower
servers. This allows managers to scale up the number of servers as needed,
maintain the hardware effectively, and keep them cool.
• Whether a data center utilizes rack, blade, or tower servers, the fundamental
server hardware components are the same and help to allow concurrent data
processing at any size. Here is a quick reminder of a server's essential components
and how they help move data from point A to point B.

Processor: The logic circuitry that reacts to and executes the fundamental commands
that power a computer is known as a processor (CPU). Given that it interprets the
majority of computer orders, the CPU is regarded as the primary and most important
integrated circuits (IC) chip in a computer. The majority of fundamental operations in
logic, I/O, and arithmetic are carried out by CPUs, which also distribute commands to
other processors and parts of the computer.

Although technically speaking, the central processing unit (CPU) is not the sole processor
in a computer, the terms processor and CPU are frequently used interchangeably. The
graphics processing unit (GPU) is the most prominent example, although a computer's
hard disk and other components also carry out some processing on their own. However,
the CPU is typically considered to be the processor when the phrase is used. PCs,
smartphones, tablets, and other devices all have processors. Intel and AMD are the two
primary rivals in the CPU business.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 55 of 149

Motherboard: The primary printed circuit board (PCB) of a computer is called the
motherboard. All components and external peripherals connect to a computer's
motherboard, which serves as its main communications hub.

Virtually all computers, notably desktop and laptop PCs, include motherboards. They link
to chipsets, central processing units (CPU), and memory, among other components. Wi-
Fi, Ethernet, and graphics cards with the graphics processing unit, or GPU, are examples
of external peripherals.

Acer, ASRock, Asus, Gigabyte Technology, Intel, and Micro-Star International are some
of the motherboard makers.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 56 of 149

Random Access Memory (RAM): One of the key factors affecting the performance of
your system is computer random access memory (RAM). RAM provides apps with a
location to temporarily store and access data. It saves the data that your computer is now
utilizing so that it may be readily accessible.

You'll need more the more apps your machine is executing. Solid state drives, or SSDs,
are additional crucial parts that will aid in maximizing the performance of your system.

Your system's performance and speed are closely correlated with the amount of installed
RAM. Your system may be sluggish and slow if it lacks insufficient RAM. On the other
hand, installing too much might have little to no extra advantage. There are methods for
determining whether your computer needs extra memory and for ensuring that the
memory you buy is compatible with the other parts of your system. Components are often
made to the best standards possible at the time of manufacturing, but with the
understanding that technology may evolve over time.

Modules for each generation of memory technology are physically distinct to prevent
users from putting incompatible memory. These physical variations are typical across the
memory sector.

What does RAM stand for?

Random access memory, or RAM, is one of the most basic components of computers.
RAM is a short-term memory pool where your computer keeps information it needs to
access fast. RAM maintains information readily available so that your processor may
swiftly access it and carry out urgent processing operations without first accessing long-
term storage.

Every computing device, including desktop computers running Windows, MacOS, or


Linux, tablets and smartphones running Android or iOS, and even Internet of Things
(IoT) devices, includes RAM (like a smart TV). Almost all computers have a method of
storing data for later access. But your computer's RAM stores and provides access to the
memory needed to perform the task you are now working on.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 57 of 149

Hard Disk Drive: All digital material is stored on a computer's hard drive, which is a
non-volatile piece of hardware. It stores data like as music, films, photographs,
documents, and program files.

Hard drives are non-volatile, thus even if power is removed, no data is lost. As long as
they aren't destroyed or corrupted, they enable computers to store files and other data for
extended periods of time. n this article, I will cover the different types of hard drives so
you can choose the best for your computer.

Types of Hard Drives

• Parallel Advanced Technology Attachment (PATA)


• Serial Advanced Technology Attachment (SATA)
• Small Computer System Interface (SCSI)
• Solid State Drive (SSD)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 58 of 149

Network connection: Network connection is the complex process of joining different


components of a network together, such as through the use of routers, switches, and
gateways.

Another type of measure for discussing how well network components link to one another
is network connectivity. The structure and composition of the network as a whole are
described by the term "network topology," which is related.

There are several distinct network topologies, such as hub, linear, tree, and star
configurations, each of which is set up in a particular way to ease communication
between computers or devices. Each has advantages and disadvantages about network
connectivity.

Why is networking important?

• One of the easiest methods to discover a new job or even a new role in your
present firm is to use your network. Why is networking crucial? It frequently boils
down to one word: recommendations.

• One-third of job searchers discover ads through contacts in the industry,


particularly recommendations. By networking, you may have access to fresh
possibilities that might otherwise be inaccessible.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 59 of 149

• Additionally, a solid business connection could encourage someone to hand-


deliver your résumé to the recruiting manager. This might help you stand out from
the competition and one day obtain the job of your dreams.

Power supply: In order to deliver electricity, a power supply must convert one voltage
to another, more practical value. From the output back to the input, power supplies are
created. Since they were created after the amplification stages, it is tempting to consider
them an afterthought; in fact, several commercial goods exhibit this mentality. Realizing
that an amplifier is just a modulator that regulates the energy flow from the power supply
to the load is crucial. The most exquisitely constructed amplifier will be worthless if the
power source is subpar and does not have enough energy to fulfill the peak demands of
the amplifier.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 60 of 149

GPU: For both consumer and corporate computers, the graphics processing unit, or
GPU, has emerged as one of the most significant categories of computing technology.
The GPU, which was created for parallel processing, is employed in a variety of tasks,
including generating images and videos. Despite being best recognized for their gaming
capabilities, GPUs are being used in artificial intelligence and creative output (AI).

GPUs were first created to speed up 3D visual rendering. They improved their capacities
as they become more adaptable and programmable. This made it possible for graphic
designers to produce more eye-catching visual effects and realistic scenarios using
cutting-edge lighting and shadowing methods. In order to significantly speed up extra
tasks in high performance computing (HPC), deep learning, and other areas, other
developers also started to take advantage of GPU capability.

GPU vs. Graphics Card: What’s the Difference?

• Although the phrases graphics card (or video card) and GPU are sometimes used
interchangeably, there is a little difference between the two. Like how a
motherboard houses the CPU, a graphics card is an add-in board that houses the

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 61 of 149

GPU. The vast array of parts needed for the GPU to operate and link to the rest of
the system are also included on this board.

• There are two main categories of GPUs: integrated and discrete. An integrated
GPU is built right into the CPU, rather than being provided on a separate card. An
individual chip installed on its own circuit board and commonly connected to a
PCI Express slot is known as a discrete GPU.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 62 of 149

1.1.8 PC Hardware and Server Hardware

Parameters of Server Hardware PC Hardware


Comparison
Performance Heavy workloads are For smaller applications,
handled by many CPUs. a single CPU is typically
used.
Speed Some servers' hard drives Due to many factors, data
may spin more quickly, retrieval and storage rates
which results in a quicker are often lower.
pace of data saving and
retrieval.
Flexibility The PC is simpler to use. The server is intricate and
uses cutting-edge
technologies.
Cost Your demands for speed, As a result, the price is
security, storage, and relatively lower.
bandwidth will all affect
the price, which may be
greater.
Security By sending internet Computers may be
traffic through the server, susceptible to malware
you may prevent access and viruses on an
to malicious websites and individual basis.
malware.
Storage Terabyte-scale to Peta Fewer terabytes of
scale Large Storage storage as opposed to
gigabytes

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 63 of 149

1.1.9 Publishing the Application

• Applications that have been published operate virtually but have the same features
as those that have been installed locally.
• Application remoting is the technique of distributing published programs, in
which the application is physically placed on a different device, such a server in a
data center, and virtualization software displays it on an endpoint. Depending on
the endpoint operating system being used, this software, such as Citrix XenApp or
VMware Horizon, can offer published apps for both Windows and Linux.
• Users can use published applications in the same manner they use native ones to
start and access them. IT can distribute published apps to consumers' Windows,
Linux, and mobile devices. Users of Windows PCs can access the published
programs via shortcuts or the Start menu. Although published apps are more
prevalent with RDSH, both Remote Desktop Session Host (RDSH) and VDI
technologies support application remoting.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 64 of 149

1.2 Identify 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.2.1 What is the DNS?

• The public IP addresses linked to the names of the websites that an IP address
directs a user to are stored in a database on a computer known as a DNS server.
DNS functions as an online phonebook. The DNS determines the correct IP
address whenever users input domain names like Fortinet.com or Yahoo.com into
the address bar of web browsers. The device is directed to the proper location to
access the site's data by the IP address of the website.
• When the DNS server discovers the right IP address, browsers use it to transfer
data to origin servers or edge servers of content delivery networks (CDNs). The
user will then be able to view the website's information. Finding the matching IP
address for a website's uniform resource locator is how the DNS server begins the
procedure (URL).

1.2.2 How Does DNS Work?

DNS recursor: The DNS client sends the query to the DNS recursor, which is also
referred to as a DNS resolver. The correct IP address is then discovered by interacting
with other DNS servers. The resolver then behaves as a client itself after retrieving the
request from the client. While doing this, it issues requests to the root nameservers,
authoritative nameservers, and top-level domain (TLD) nameservers.

Root nameservers: The DNS root zone of the internet is served by the root nameserver.
Its responsibility is to respond to queries for records located in the root zone. When a
request is made, it replies with a list of the trustworthy nameservers associated with the
relevant TLD.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 65 of 149

TLD nameservers: The second-level domain's IP address is kept within the TLD name
by a TLD nameserver. After that, it releases the website's IP address and sends the request
to the nameserver for the domain.

Authoritative nameservers: The genuine response to your DNS query comes from an
authoritative nameserver. An authoritative nameserver can be either a master server, also
known as the primary nameserver, or a slave server, also known as the secondary
nameserver. The zone records' original copies are kept on the master server, whereas the
slave server is a precise duplicate of the master server. It distributes the burden on DNS
servers and serves as a fallback in case the primary server malfunctions.

Uses of DNS.
DNS is used to underlie many other types of Internet communication in addition to
transforming domain names into IP addresses. like.

▪ Messages are forwarded to email servers and webmail providers.


▪ Within a web application, connecting app servers, databases, and middleware.
▪ Virtual Private Networks (VPN

• DNS has altered during the past two decades. Thanks to advanced traffic routing
features offered by next-generation DNS systems like NS1, DNS has found new
applications.
• Migration of data centers and clouds - Managing traffic from on-premises to cloud
resources.
• Internet traffic management involves preventing gridlock and directing traffic in
the most effective way to the most appropriate resource.
• Geographical routing: Users should be routed to the nearest resource based on
their location and where they are in relation to it.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 66 of 149

About DNS Hierarchy


• DNS manages its distributed database system using a hierarchy. Like directory,
the DNS hierarchy, also known as the domain name space, is an inverted tree
structure. The root domain, which is the single domain at the top of the DNS tree,
is its only component. The root domain is identified by a period (.) or dot. The
top-level domains that partition the DNS hierarchy are found below the root
domain.
• The top-level DNS domains and the kinds of businesses that utilize them are listed
below. The domain name space is further split into subdomains that represent
various organizations below the top-level domains.

The DNS hierarchy is comprised of the following elements:

• Root Level
• Top Level Domains
• Second Level Domains
• Sub-Domain
• Host

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 67 of 149

DNS Root Zone

In the DNS hierarchy tree, the root zone is at the top. The root zone's name server is the
root name server. It responds to queries for records in the root zone and to queries for
additional information by supplying a list of authoritative name servers for the relevant
TLD (top-level domain). The root nameservers are crucial because they are the initial
stage in domain name resolution. The DNS root zone is served by these authoritative
nameservers.

Top Level Domains

Top level domains are the next tier in the DNS system. There are now a lot of TLDs
accessible. As you can see, there are two subcategories for TLDs. Geographic hierarchy
and organizational hierarchy are these. Let's examine each one closely.

Domain Purpose
com Commercial organizations
edu Educational institutions
gov Government institutions
mil Military groups
net Major network support centers
org Nonprofit organizations and others
int International organizations

Second Level Domains

The Second Level Domains make up the next level of the DNS system. This is the
domain that follows the tld exactly. The primary component of the domain name is this. It
may change depending on the buyer. As the tlds, there are no restrictions here. When a
domain becomes accessible, anyone can buy it. The best choice is the same 2nd level
name with other tlds if the domain is currently unavailable.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 68 of 149

Sub-domain

• The following level in the DNS hierarchy is the sub-domain. The domain that is a
subdomain of the main domain is referred to as the sub-domain. The root domain
is the only domain that is not also a subdomain. Think of two areas. Examples a
and b are websites. In this case, example.com is the primary domain, while both
other domains are subdomains of the com top-level domain.

Hosts
• A host is a computer or other device on a network that connects to other hosts
(also known as a "network host"). On a network, clients and servers are hosts that
transmit or receive data, services, or applications. Hosts seldom contain
intermediate network components like switches and routers, which are referred to
as nodes. While a host needs an IP address, a node is a more general term that
refers to everything connected to a network. In other words, network nodes are
hosts until they require an IP address in order to operate, whereas all hosts are
network nodes.
• On a TCP/IP network, every host has a host number that, when paired with a
network identification, yields a unique IP address for that host. At the Open
Systems Interconnection (OSI) architecture, communication between hosts is
handled via protocols in the transport layer, commonly referred to as Layer 4.
Users can communicate between hosts using the User Datagram Protocol and the
Transmission Control Protocol (TCP) (UDP).

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 69 of 149

1.2.3 How domain names are structured

• A complete domain name consists of a three-part arrangement. The computer or


host name comes first (such as "www" for the "World Wide Web"), followed by
the name of the website, and then the TLD (like .com or .gov). A domain name
like "www.google.com" is totally acceptable since a dot separates each part of the
name. A search engine is often a software program or script that runs on the
Internet that looks for keywords in documents and folders and delivers the results
of any files that contain those keywords. There are already several search engines
available online, each with a unique set of features. They have a tremendous
amount of power. The most popular and effective search engine is Google.
• Although there are a number of well-known search engines, like Baidu, Bing, and
Yahoo, Google is the best and most effective of them all. Because search engines
are the most effective means for websites to engage with visitors, their influence
on website success is crucial. Users gain from it since it enables rapid access to
the website. It also enhances the operation of the website, which is another
advantage. People are less likely to find a website if it does not appear in the top
results or on the first page of the search results section, which will negatively
affect website performance. However, search engines have other, equally
important influence on the outcomes of websites.
• Website indexing is the process through which search engines collect information
from websites and store it in databases. They do this because they must process
data in order to display the most crucial information to their clients. Web page
indexing is therefore essential if websites are to show up in search results in
response to user queries. Search engines offer a variety of tools that may be used
to enhance the indexing of any website.

▪ metadata for robots It implies that a search engine searches for the
meta robot’s name when it crawls a page. This tag informs them if they
can index this page or not.
▪ Robots.txt is a crucial tool for enabling or disabling search engines'
mass crawling of websites. It is kept in the website's root directory.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 70 of 149

1.2.4 Search engine optimization

What is Search engine optimization (SEO)?

▪ The art and science of search engine optimization (SEO) involves raising a page's
search engine ranking in Google and other search engines. A website's traffic may
rise as a result of ranking better in search results as this is one of the primary ways
users find material online.
▪ The results page in Google and other search engines frequently has sponsored
advertisements at the top of the page, followed by the standard results, or what
search marketers refer to as the "organic search results." To distinguish it from
traffic obtained through sponsored search, traffic obtained through SEO is
frequently referred to as "organic search traffic." Pay-per-click (PPC) and search
engine marketing (SEM) are other names for paid search (PPC).

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 71 of 149

How SEO works?

Search engines like Google and Bing utilize bots to move between websites, acquire
information about them, and index them in order to crawl internet pages. Think of the
index as a massive library where a librarian might quickly call up a particular book (or
web page) to help people find it.The algorithms that look at sites in the index while taking
into account thousands of ranking factors or signals then decide in what order pages
should show in the search results for a certain query. The librarian in our imagined library
has read every book there and knows which one would offer the answers to our issues.

We may consider the various user experience components to be substitutes for our SEO
success factors. This is how search engine bots evaluate how well a website or web page
can deliver the results a user is looking for.

Unlike paid search advertising, greater organic search rankings cannot be purchased, thus
SEO experts must put in the required work. We are here in answer.

In our Periodic Table of SEO Factors, the criteria are divided into six main groups and
given weights depending on their relative importance to SEO. For instance, although
content quality and keyword research are essential elements of content optimization,
crawlability and speed are significant site design characteristics.

The freshly updated SEO Periodic Table also includes a list of Toxins that impair SEO
best practices. These are shortened versions of techniques or methods that, in the past,
when search engine algorithms were less complex, would have been enough to guarantee
a high rank. They could even just momentarily work right now.

We also have a new niches section where we go into great detail on the SEO success
criteria for three key topics: local SEO, news/publishing, and e-commerce SEO. Even
while our basic SEO Periodic Table will provide you the best practices, knowing the
nuances of SEO for each of these Niches will help us succeed in search results for a small
business, food blog, and/or online store. The goal of the search algorithms is to provide
consumers with an effective search experience by surfacing reliable, relevant pages. If we
optimize our site and content with these factors in mind, our pages could rank higher in
the search results.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 72 of 149

For each query, search engines like Google utilize an algorithm or set of rules to decide
which sites to display. To decide the ranks of their SERPs, these algorithms, which have
become incredibly complicated over time, consider hundreds or even thousands of
distinct ranking indicators. Search engines, however, base their evaluation of a site's
quality and where it should rank on three key metrics:

Links: The ranking of a website in Google and other search engines is significantly
influenced by links from other websites. Due to the fact that website owners are unlikely
to link to low-quality websites, a link can be viewed as a vote of approval from other
websites. In the view of search engines, websites that receive links from several other
websites gain authority (referred to as "PageRank" by Google), particularly if the
websites linked to them are also authoritative.

Content: Search engines examine a webpage's content in addition to its links to evaluate
if it would be relevant for a particular search query. Making content that is focused on the
keywords that users of search engines are looking for is a big aspect of SEO.

Page structure: Page structure makes up the third essential element of SEO. Because
HTML is the language used to create webpages, the way the HTML code is organized can
affect how well a search engine understands a page. Site owners may take steps to
enhance the SEO of their website by include pertinent keywords in the page's title, URL,
and headers and by ensuring that a site is crawlable.

Search engine optimization techniques


• Keyword research - Keyword research is often the starting point for SEO and
involves looking at what keywords a site is already ranking for, what keywords
competitors rank for, and what other keywords potential customers are searching
for. Identifying the terms that searchers use in Google search and other search
engines provide direction on what existing content can be optimized and what new
content can be created.

• Content marketing - Once potential keywords are identified, content marketing


comes into play. This can be updating existing content or creating brand new

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 73 of 149

pieces of content. Because Google and other search engines place a premium on
high-quality content, it's important to research what content is already out there
and create a compelling piece of content that provides a positive user experience
and has a chance of ranking higher in the search engine results. Good content also
has a greater chance of being shared on social media and attracting links.

• Link building - Because links from external websites (called "backlinks" in SEO
parlance) are one of the core ranking factors in Google and other major search
engines, obtaining high-quality backlinks is one of the main levers that SEO has.
This can involve promoting good content, reaching out to other websites and
building relationships with webmasters, submitting websites to relevant web
directories, and getting press to attract links from other websites.

• On-page optimization - In addition to off-page factors such as links, improving


the actual structure of the page can have tremendous benefits for SEO, and is a
factor that is entirely in the control of the webmaster. Common on-page
optimization techniques include optimizing the URL of the page to incorporate
keywords, updating the title tag of the page to use relevant search terms, and using
the alt attribute to describe images. Updating a page's meta tags (such as the meta
description tag) can also be beneficial-- these tags don't have a direct impact on
search rankings but can increase click-through rate from the SERPs.

• Site architecture optimization - External links are not the only thing that matters
for SEO, internal links (the links within one's own website) play a large role in
SEO as well. Thus, a search engine optimizer can improve a site's SEO by making
sure key pages are being linked to and that relevant anchor text is being used in
those links to help improve a page's relevance for specific terms. Creating an
XML sitemap can also be a good way for larger pages to help search engines
discover and crawl all of the site's pages.

• Semantic markup - Another SEO strategy that SEO experts utilize is optimizing
a website's semantic markup. Semantic markup (such as Schema.org) is used to

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 74 of 149

describe the meaning behind the content on a page, such as helping to identify
who the author of a piece of content is or the topic and type of content on a page.
Using semantic markup can help with getting rich snippets displayed in the search
results page, such as extra text, review stars and even images. Rich snippets in the
SERPs doesn't have an impact on search rankings, but can improve CTR from
search, resulting in an increase in organic traffic.

SEO Ranking Factors


Keyword Research: Keyword Research is the process of finding the actual search terms
that people are entering into the search engines. Its helps in acquiring and maintaining the
attention of your correct audience, as well. Effective Keyword Research gets more
benefits such as engagement of correct audience, increase in customer conversion,
increase SERPs Position, and more.

URL Optimization: Website URL structure should be short and keyword rich; Dynamic
URL's structure should be avoided. First, 3 to 5 words in a URL structure is more
important as it contributes more weight to the website. Using keywords in a URL can be
referred as one of the best practices. Proper structuring of URL with specific keywords
will definitely give you a good page rank in search engines like Google and others.

Meta Tags: Meta Tags is the most important factor of On Page SEO. It has four
fundamental components: Meta Title, Meta Description, Meta Keywords, and Meta
Robots Tag.

While the Meta Title is used to describe or convey the contents of a page on to the search
engines and users, Meta Description is a short description that tells the search engines and
users about page concepts. Meta Robots is a tag that tells the search to follow a specific
page in the website, and Meta Keywords describe the list of keywords and their
relevance.

Header Tags: Header Tags are pieces of HTML Code that allow us to make certain
keywords stand out on a web page. It tells the user what the page is about and also
determine whether continue to read it or not. It also helps to improve search engine
placement.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 75 of 149

Content Optimization: Content is the king! Professional Content Optimization focuses


on using specific keywords in very specific places to send the strongest and high ranking
for keyword target. It encourages the website owners to get top SERPs Rankings.
Keyword frequency, relevance, usefulness, and progression are some of the important
things to consider under Content Optimization.

As a web development company, Spec bee ensures effective and result-oriented SEO
services. Team up with our vast experience in SEO and other development services;
generate more web-traffic with your page rank going higher in search engines.

What Is an SEO Article?


An SEO article is a piece of written content like a blog post that is featured on your
website as a page with a unique URL. An SEO article educates, informs and/or entertains
your target audience with expertise and quality. An SEO article is also optimized for
search engines so that it has a better chance of getting on Page 1 of the search results.

Why Should You Write an SEO Article?


Here are six reasons why you should write an SEO article.

1. Web content is why Google exists.


Webpages, including articles, are what search engines like Google store in their index.
When someone performs a search, the engine analyzes their query and matches it to the
most relevant indexed items. Without these webpages, Google would have nothing to
show users in its search results.

2. Google’s algorithm is getting smarter all the time, but it still needs
help.
An SEO article is optimized for search so that it can help search engines better understand
what the topic is about (see Google’s Webmaster Guidelines for more on this). This
increases the chance it will be considered relevant to a query and show up on Page 1 of
the search results.

Search Engine Optimization is about helping search engines understand and present
content.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 76 of 149

-Google, Search Engine Optimization (SEO) Starter Guide

3. Being found for a search can impact your revenue.


The organic search channel drives more than 50 percent of traffic to a website on average
(and up to 64 percent for B2Bs). Organic search is also responsible for up to 59 percent of
revenue over other channels.

4. You can establish your expertise and authority on a topic.


Google places more value on websites with high expertise and authority, and a well-
written article is one of the keyways to demonstrate this.

High quality pages and websites need enough expertise to be authoritative


and trustworthy on their topic.

-Google, Search Quality Evaluator Guidelines

5. Delight your intended audience.


SEO articles can result in things like return visits to your site, more time on your site
viewing other content, and conversions.

Creating compelling and useful content will likely influence your website more than any
of the other factors discussed here. Users know good content when they see it and will
likely want to direct other users to it. This could be through blog posts, social media
services, email, forums, or other means. Organic or word-of-mouth buzz is what helps
build your site’s reputation with both users and Google, and it rarely comes without
quality content.

-Google, Search Engine Optimization (SEO) Starter Guide

6. Beat your competition in the search results.


A search-optimized article uses data to make it better. Find out what the top-ranked
content is doing on the same topic. Then you can meet or exceed it.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 77 of 149

How Do You Write an SEO Article?


To write an SEO article, you need at least these two things:

A professional writer and a subject matter expert.


SEO tools that can provide the data you need to optimize the content.
Here are eight key steps to writing an SEO article.

Step 1. Define the document specs.


First, specify the basic article facts such as the topic, target keywords, meta title, meta
description and URL. At the top of your document, create a table that contains the key
details for the new content. This table helps you organize all the details of a well-
optimized article before you start writing.

Step 2. Create expertly written content.


Google wants the search results on Page One to have an element of expertise. That’s
because Google wants its users to be satisfied with its results. Quality content keeps your
audience happy, too.

That said, before you write an article, make sure you have at least one of the following:

Subject matter expertise or a subject matter expert you can interview


Writing ability or a professional writer
An expert editor
For example, if you are the subject matter expert but you’re not confident in your ability
to write, hire a ghostwriter or editor. If you are a writer, make sure you have access to a
subject matter expert (or really great research skills) to help you craft the piece.

From Google’s SEO Starter Guide, here are two pieces of sage advice:

Expertise and authoritativeness of a site increases its quality. Be sure that content on your
site is created or edited by people with expertise in the topic. For example, providing
expert or experienced sources can help users understand articles’ expertise. Representing
well-established consensus in pages on scientific topics is a good practice if such
consensus exists.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 78 of 149

Also:

Users enjoy content that is well written and easy to follow.

Avoid:
3 Writing sloppy text with many spelling and grammatical mistakes.
3 Awkward or poorly written content. …

Step 3. Use SEO tools.


Many writers are not trained in SEO, so mastering an SEO article can be intimidating.
Good news: SEO tools exist that can help writers easily optimize their content.

For instance, Bruce Clay’s WordPress SEO plugin helps content creators get SEO data
before, during and after the writing process. So articles are optimized with best practices
for a specific search query (not blanket best practices that aren’t that useful).

Step 4. Research keywords (aka search queries).


What is your audience typing into Google’s search bar when looking for the info you
have on your website?

In its SEO Starter Guide, Google explains the very basics of keyword research:

Think about the words that a user might search for to find a piece of your content. Users
who know a lot about the topic might use different keywords in their search queries than
someone who is new to the topic. For example, a long-time football fan might search for
[FIFA], an acronym for the Fédération International de Football Association, while a new
fan might use a more general query like [football playoffs]. Anticipating these differences
in search behavior and accounting for them while writing your content (using a good mix
of keyword phrases) could produce positive results.

You want to have at least one primary search term you optimize your article with, and up
to two secondary keyword phrases. Does that mean you have to use more than one? No.
But it can be an advanced strategy for some.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 79 of 149

At this point, it’s worth noting that an article will be naturally optimized when you write
it. That’s because if you write enough (quality) words on a subject, the words you use will
describe the content well.

So why optimize? To help your great content better compete in the search results. When
you use specific keyword queries in your content, it can signal to Google that your
content is more relevant to the searcher’s query than other content like it out there.

For more, see our article on optimizing page content, and try our free keyword suggestion
tool to get started.

Step 5. Identify and analyze the competition.


Did you know that your competition online consists of the top-ranked pages for your
keywords? These are the webpages in which you are vying for attention in the search
results.

Once you have your keywords, you can begin a competitive analysis. Using the right SEO
tools, you can find out which pages are ranking in the top spots on Google for your search
query.

This is where things get good. Armed with that data, you are not blindly following
general SEO best practices (<It must be 1,000 words!=) for your article. You are
optimizing specifically to be on par with 4 or even exceed 4 the top results for that
keyword.

For example, Bruce Clay’s WordPress SEO plugin examines your competition and
presents data such as:

Total word count to aim for


The title tag and meta description length
The number of times a keyword is used
The readability score of your SEO article compared to the top-ranked webpages
(And all of this is in real-time before or during the writing process, not after.)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 80 of 149

Step 6. Optimize the content in your SEO article.


At this point, you should have both the well-written article and your keywords. Now is
the time to optimize.

You want your keywords to show up naturally in the content. So the first step is to
identify where you might be able to switch up a few words or phrases with your key
terms.

Rule No. 1: Always make sure it reads well. Slapping your keywords any old place
without regard to grammar can make your article look spammy to Google and annoy
readers.

Optimize content for your users, not search engines … Designing your site around your
visitors’ needs while making sure your site is easily accessible to search engines usually
produces positive results.

Avoid:
3 Inserting numerous unnecessary keywords aimed at search engines but are annoying or
nonsensical to users. …

-Google, Search Engine Optimization (SEO) Starter Guide

In general, you want your keywords to be evenly distributed throughout the content from
top to bottom. For more on this, see our in-depth article on how to use keywords in
content, and check out our handy and printable.

Step 7. Review the content.


Depending on the size of your organization or circumstances, you will also need an
editorial and SEO review prior to the article being published. This can ensure that the
article is written well, free of errors, and in line with Google’s guidelines.

Keep in mind that if you are accepting guest posts, you should hold that content to the
same standards as the content you produce in-house. Not doing so can have serious
implications for the quality of your site.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 81 of 149

As an example, guest posts done wrong can cause a site to get hit with a manual penalty
from Google.

8. Track the Content’s Performance


Writing an SEO article is not a set-it-and-forget-it approach. You will want to track the
performance of that article and learn from the data.

Using Google Analytics or an SEO tool like our WordPress SEO plugin, you can view
how an SEO article is performing in search. You’ll want to look at things like:

The number of page views


Average time on page
What queries are bringing search traffic to that SEO article

Author: Bruce Clay

1.2.5 Web Development Technologies

• The term "web technologies" describes the use of markup languages in computer
and device communication. It involves Utilizing hypertext markup language, it is
communication over the internet and the creation, delivery, or management of
web content (HTML).
A web page is an HTML (hypertext markup language) document that is published
online. It is said to have reduced the globe to a small town where people and
objects may interact with each other without difficulty. Information that was
previously unavailable or could have been challenging to discover is now
accessible thanks to the www.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 82 of 149

Web professionals refer to the two main non-design aspects of building Web
sites4authoring markup and coding4as "web development." Web development
can employ content management systems (CMS) to make content revisions easier
and more accessible to users with just minimal technical skills.
For bigger businesses and organizations, teams of web developers may number in
the hundreds and build websites utilizing standardized methods like Agile
procedures. Smaller companies may just require a single permanent or contract
developer, or they may assign extra staff to positions that are comparable to the
developer, such as graphic designer or information systems technician. Web
development may include departmental collaboration as opposed to being the
responsibility of a certain department.

Important terms of Web Technology

• 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."
• HTML: Hypertext markup language, or HTML, is a formatting language used
to display content acquired via the Internet. Every retrieval unit is referred to as
a Web page (from the World Wide Web), and these pages typically have
hypertext connections that make it possible to obtain adjacent pages.
• Web Server: A computer that hosts a website on the Internet.
• Web Browser: An application program called a web browser is used to view a
local or global website. The web browser obtains the page's files from a web
server and then visually renders the page on the user's screen whenever a user
requests a web page from a certain website.
• URL: Is a URL the same as a domain name? Surprisingly to many, the answer is no.
But the terms are used so interchangeably, it’s understandable why people confuse

one for the other. But there is a difference.

• Protocol
• Internet Protocol (IP) Address
• HTTP

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 83 of 149

• XML
• Gateway
• API

Types of web development technologies

➢ Browsers.
➢ HTML and CSS.
➢ Programming Languages.
➢ Frameworks.
➢ Web Servers.
➢ Databases
➢ API
➢ Protocols.
➢ Lastly, data Formats.

❖ Browsers.
After making a request, browsers provide us information that we can comprehend. Think
of them as the interpreters of the internet. Some of the most well-liked are listed below:
Examples: The company's most popular browser right now is Google Chrome.

• The web browser used by Apple is called Safari.

• Firefox, an open-source browser, is supported by the Mozilla Foundation.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 84 of 149

• Microsoft's browser, Internet Explorer

❖ HTML and CSS:


One of the first things we should learn is HTML, along with CSS. When a request comes
in, HTML helps web browsers understand what to show. To fully understand how CSS
works, we also need to master HTML. CSS, or Cascading Style Sheets, define how
HTML elements should look on the screen. If we study enough tutorials, we can easily
create CSS text effects, website transitions, photo hover effects, and more. James
Williamson's Essential HTML & CSS teaching will allow us to use these technologies
right away even if we are complete beginners.
Programming Languages
As we've already mentioned, computers don't use languages that are even somewhat
similar to human languages, thus they require their own unique ways of communication.
The following is a list of the most popular programming languages:
• JavaScript is necessary for all web browsers, Meteor, and a number of other
frameworks. Coffee Script is a "dialect" of JavaScript. Despite appearing to be
simpler, it converts back into JavaScript.

• Python is used in most mathematical operations as well as the Django framework.

• Ruby is a language that is used in the Ruby on Rails framework.

• The WYSIWYG editors that are still in use today were developed by WordPress
using PHP. It is also used by Facebook, Wikipedia, and other well-known
websites.

• Newer lingo Go was developed to be quick. Swift, Apple's most recent


programming language.

❖ Java
The object-oriented, class-based, general-purpose programming language Java was
created to have fewer implementation requirements. It is an application development
platform for computers. Java is consequently quick, safe, and trustworthy. For creating
Java applications, it is widely used in laptops, data centers, game consoles, scientific
supercomputers, and mobile devices.

❖ JavaScript
Along with HTML and CSS, the computer language known as JavaScript, or JS, is one of
the foundational elements of the World Wide Web. 98% of websites will utilize

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 85 of 149

JavaScript for client-side webpage behavior by the year 2022, frequently including third-
party libraries.

❖ C++

Danish computer scientist Bjarne Structure developed the general-purpose programming


language C++ as an expansion of the C programming language, sometimes known as "C
with Classes."

❖ C#

A multi-paradigm, general-purpose programming language is C#. Programming


paradigms such as imperative, declarative, functional, generic, object-oriented, and
component-oriented can all be used with C#.

Frameworks:

Web development frameworks are a good place to start for tools that a developer may
utilize to start working right away rather than undertaking simple or boring jobs.

Examples:

One of the most recent web technologies, Angular, is made exclusively for creating
dynamic online apps. Without the usage of other frameworks or plugins, you may quickly
construct front-end-based apps using this framework.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 86 of 149

To build real-time web apps for several platforms, use Meteor JS, which is developed in
Node.js. With Meteor JS, the framework for building straightforward websites for
personal usage truly shines out

Java EE

Previously known as Java Platform, Enterprise Edition and Java 2 Platform, Enterprise
Edition, Jakarta EE is a collection of standards that adds enterprise capabilities like
distributed computing and web services to Java SE.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 87 of 149

Asp.Net
Dynamic web pages are developed using the open-source ASP.NET framework for
server-side web applications. For programmers to construct dynamic websites,
applications, and services, Microsoft invented it. The technique is known as Active
Server Pages Network Enabled Technologies.

Web Servers:

Web servers provide client and server-to-client communication. The most popular servers
are as follows

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 88 of 149

• Apache Web Server


• Nginx Web Server
• IIS Web Server
• Lite Speed Web Server

Databases:

Both relational and non-relational databases, such as MongoDB, can be used. Web
applications store data that is used to show on web pages in databases of all types. The
most popular databases are shown below.

• MongoDB 3 is an open-source NoSQL database


• Oracle 3 is an enterprise SQL database
• SQL Server 3 Microsoft’s SQL database
• Redis 3 is the most popular key-value store
• PostgreSQL 3 is a popular, open-sourced SQL database
• MySQL 3 a popular open-source database

Protocols:

Protocols are the instructions on how to transfer data back and forth between computers
and other devices.

• HTTP

Each website may reach the browser because of this protocol. The protocol asks Google's
server for the website, which is then returned together with the website's HTML, CSS,
and JavaScript.

• DDP

establishes a reliable connection between the client and the server using WebSocket.
Therefore, you receive real-time website changes without having to reload the browser.

• REST

This protocol, which is mostly used for APIs, provides common methods like GET,
POST, and PUT that enable information sharing between apps.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 89 of 149

Data Formats:

A data format is a framework used to store data.

A format for storing and transmitting data is called JSON, or JavaScript Object Notation
(just like XML). It is quickly overtaking all other data formats in popularity.

XML: Previously the most widely used data format, it is now mostly utilized by
Microsoft systems.

Data structured in CSV (comma separated values), such as Excel dat

1.3 Web Development Framework

Web services, web resources, and web APIs may all be created more easily with the aid
of a software framework known as a web framework (WF) or web application framework
(WAF). A standardized process for developing and delivering web applications on the
Internet is provided by online frameworks. Web frameworks make an effort to lighten the
administrative load brought on by typical web development duties. Many web
frameworks, for instance, come with libraries for session management, templating
frameworks, and database access, and they usually promote code reuse. They apply to
static websites as well, despite the fact that they typically concentrate on the development
of dynamic websites.

Examples:

▪ ASP.NET
▪ A server-side web application framework that is open-source and used to
build dynamic web pages is known as ASP.NET. For programmers to
construct dynamic websites, applications, and services, Microsoft invented it.
The technique is known as Active Server Pages Network Enabled
Technologies.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 90 of 149

▪ Java EE.

▪ Jakarta EE, formerly known as Java Platform, Enterprise Edition and Java 2
Platform, Enterprise Edition, is a set of standards that enhance Java SE with
enterprise features including distributed computing and web services.

▪ WebObjects

▪ WebObjects is a Java web application server and server-based web application


framework that was first developed by NeXT Software, Inc. WebObject is
distinguished by its object-orientation, database connectivity, and prototyping
tools.

• Web2py
▪ The open-source Web2py framework for web applications was developed using
Python. Web2py enables Python programmers to create dynamic online content.

• Catalyst

▪ Catalyst is an open-source online application framework developed in Perl that


closely adheres to the model-view-controller architecture and also supports a
number of cutting-edge web design principles. It is created in Perl utilizing the
cutting-edge Moose object system.

• Rails by Ruby

▪ Ruby on Rails is a framework for server-side web applications that was developed
in Ruby and distributed under the MIT License. Databases, online services, and

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 91 of 149

web pages all have built-in defaults in the model-view-controller framework


Rails.

• Django
▪ Django is a model-template-views-based web framework that is free and
open-source that uses Python. The Django Software Foundation, a private
company registered in the US as a 501 non-profit, oversees keeping it up
to date.

• Zend Framework
▪ The Laminas Project is a PHP 7-based, open source, object-oriented web
application framework that is covered under the New BSD License.
Basically, the framework is a collection of expert PHP-based programs.
• Symfony.
▪ A collection of reusable PHP component libraries and a free and open-
source PHP web application framework are both known as Symfony. On
October 18, 2005, it was made available as free software under the MIT
license.
• Cake PHP
▪ An open-source web framework is Cake PHP. It is designed in PHP, using
the model-view-controller design pattern, is based on the ideas of Ruby on
Rails, and is available under the terms of the MIT License.

1.3.1 Web Development Techniques

Maintaining Consistency

Maintaining a site's color, layout, and font somewhat consistently is a smart idea. The
transition from one page to the next on your website should be seamless. To ensure
consistency, your site's typeface, color, and layout structure should essentially be the

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 92 of 149

same throughout. To prevent readers from becoming lost, it is crucial to maintain


consistency across the items on all pages.

No Stock Photography

The glamorous photos no longer pique people's curiosity. They want a far more accurate
representation of what a product represents or portrays. Stock images on a plain white
backdrop are categorically out of style. People are searching for individuality and stories.
On your website, only use photos that have meaning.

Using Responsive Images

Now, designers can make responsive layouts, which are known to support a range of
image sizes and resolutions. Designers can now create graphics that are mobile-optimized
and perfect for tiny devices, and they can create copies in greater resolution for bigger
screens. For varying picture sizes based on screen width, you may utilize JavaScript and
hit access files.

CSS Media Queries


You might adhere to a guide from CSS-Tricks that covers how to use media queries on a
single style sheet and how to make small changes using media queries. One could
determine what to do if the browser window is very narrow, what to do if it is wider, and
what to do precisely if it is really quite wide based on the actual width of the browser
window, for instance in the case of a fluid-width design with a sidebar that is 35% of the
actual width of the page.

Using Responsive Data Tables


Data tables are frequently rather large. While zooming out could allow you to see the
entire table, doing so would need you to scroll both horizontally and vertically to peruse
the table. Reformatting the table for much easier reading looks to be the best option.
Using a pie-graph to illustrate the data is still another option. Consider turning the table
into a useful mini graphic that will fit on small screens without interfering with the
information while the big table is displayed.

Design a Great Navigation System


Creating an excellent navigation system that supports all search preferences is the greatest
approach to keep your visitors interested. The simplicity of information search is the most
important aspect of web design. Visitors will lose interest and depart if they can't discover

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 93 of 149

the information they're looking for. The navigation system needs to be simple to use and
understand.

Make your site accessible


Making your site responsive to different browsers and devices is necessary if you want to
attract a lot of visitors. You must make sure that everyone who visits your website can
view it, regardless of the software or browser they are using.

Usability
It's critical to remember that a website's usability, not its aesthetic design, determines its
success. If you want to create a website that will generate revenue, it is important to
employ a user-centric design. A website's usability is crucial to its success because if
consumers can't utilize it, it's pointless to have one at all. Using eye-catching 1-2-3-done
steps or sizable buttons with eye-catching visual effects is completely acceptable. The
user must be able to easily see every feature that is offered. Effective user interface design
includes feature exposure. Visitors ought to be able to easily engage with the system.

1.3.2 Web Development Tools

Chrome Developer Tools.

The Chrome browser comes with a complete set of developer tools called Chrome
Developer Tools. With the use of these technologies, you may create better websites more
rapidly and edit web pages in real time. But you can still make use of Developer Tools
even if you're not a developer.

jQuery.

A quick, compact, cross-platform JavaScript library that aims to streamline the frontend
procedure emerged. jQuery gave developers more freedom to add plug-ins, create
animations, or even just navigate around documents by abstracting a lot of the
functionality that was often left for them to figure out independently.

And it’s obviously effective jQuery was by far the most widely used JavaScript library in
2015, having been installed on 65% of the top 10 million most popular websites on the
internet at the time.

GitHub.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 94 of 149

• You may examine any modifications you've made to your project by rolling it out
with the service, or even return to a prior state (making pesky mistakes a thing of
the past). There are several explanations for why GitHub is essential to
developers. In addition to offering a variety of additional features like bug
tracking, feature requests, task management, and wikis for each project, the
repository hosting service also offers a thriving open-source development
community that makes team collaboration simple as pie.
• Now is the ideal moment to sign up because many employers will want well-
honed Git abilities. Additionally, it's a terrific opportunity to get engaged and
learn from the best because there are so many open-source projects to work on.

Code Pen.

• An online community called Code Pen allows users to test and display HTML,
CSS, and JavaScript code snippets. Developers may write and test code snippets,
known as "pens," in this online code editor and open-source learning environment.

Sass.
• Learn about the CSS pre-processor, a tool that will enable you to create more
manageable, future-proof code while also writing less CSS (keeping it DRY).
Sass, an eight-year-old open-source project that essentially established the genre
of contemporary CSS pre-processors, is perhaps the most well-known of them all.
Sass's mixture of variables, nesting, and mixings will produce simple CSS when
compiled, making your stylesheets more legible while initially being a little
challenging to understand.
Angular.js.
• enters an open-source web framework. With Google's AngularJS, you can expand
the HTML syntax in your application, creating a more expressive, legible, and
quick-to-develop environment that would not have been possible with only
HTML.
Although some feel that this type of data binding results in a cluttered, non-
separated code, we still believe it is a vital ability to have in your frontend
toolbox. The project is not without its detractors.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 95 of 149

1.3.3 Why we would Develop Web Applications?

• An application program known as a web application (Web app) is one that is kept
on a distant server and made accessible through the Internet by means of a
browser interface. Web services, which are what most websites have but not all,
have web apps. Any component of a website that provides a service to the user is
referred to as a web app, according to Jarell Remick, editor of Web App Storm.
Everyone, from individuals to businesses, has access to web apps, which may be
created for a range of functions. Webmail, online calculators, and online stores are
a few examples of frequently used web apps. All browsers can access most Web
applications; however, some are exclusively available in a certain browser.

1.3.4 Web Application advantages

• Easier To Develop
▪ Businesses who wish to create both a website and a mobile application
must do it separately, which may call for the use of extra developers and
resources. Additionally, if you want to go native and have your app
available on both the Play Store and the Apple App Store, you'll need
additional resources. Web apps deal with these problems by leveraging a
single codebase. This brings up the next issue.

• Cost And Time Effective


▪ The fact that developing a web application is far quicker and less
expensive than going native is one of the most significant advantages for
many firms. This might be a terrific option for any organization that wants
to enter the market as quickly as possible. Additionally, it is significantly
more cost-effective to create platforms without the need for separate
developers.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 96 of 149

• Easier Maintenance
▪ It is simpler and more effective to upgrade your web application when you
simply need to update the server(s).

• Easy Access
▪ With web apps, it doesn't really matter whether device your users are using
to visit your page4whether they are using computers, tablets, or
smartphones4as they will be able to do so. With any operating system,
your users will be able to utilize the multi-platform website if they have a
reliable internet connection.

• Convenience
• Users can save space on their device by using your web application without
having to download anything if you make it available to them. Some
individuals just enjoy having fewer apps clog up their displays and take up
space. Perhaps we don't give it much attention because our smartphones
provide more and more capacity every year.

• Easier To Develop
• Businesses who want to construct both a website and a mobile app will need to produce two
separate items, perhaps requiring additional developers and resources. Additionally, you'll
need extra resources if you want to go native and want your app to be available on both the
Play Store and the Apple App Store. By utilizing a single codebase, web apps address these
issues. This brings up the following point.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 97 of 149

• Cost And Time Effective


• The fact that developing a web application is far quicker and less expensive than going native
is one of the most significant advantages for many firms. This might be a terrific option for
any organization that wants to enter the market as quickly as possible. Additionally, it is
significantly more cost-effective to create platforms without the need for separate developers.

• Easier Maintenance
• It is simpler and more effective to upgrade your web application when you simply need to
update the server(s).

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 98 of 149

2 Task

2.1 Considering the requirements 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.

About Frontend
The front end of a website is the section that the user interacts with directly. It's also
referred to as the application's 'client side.' Everything that users see directly is included:
text colors and styles, photos, graphs and tables, buttons, colors, and the navigation menu.
The languages used for Front End development are HTML, CSS, and JavaScript. Front-
end developers provide the structure, appearance, behavior, and content of everything that
appears on browser displays when websites, web applications, or mobile apps are opened.
The Front End's major objectives are responsiveness and performance. The developer
must guarantee that the site is responsive, meaning that it works properly on devices of all
sizes. No part of the website should behave abnormally irrespective of screen size.
Frontend Development:
The front end of a website refers to the area that users interact with directly. It is
sometimes referred to as the application's "client side." It covers everything that users see
and interact with immediately, such as button colours, text styles, photos, graphs, and
tables. For front-end development, three languages are used: HTML, CSS, and
JavaScript. Front end developers put into practice the structure, design, behaviour, and
content of everything seen on browser displays when websites, web applications, or
mobile apps are opened. The Front End's primary goals are responsiveness and
performance. The website's developer must make sure that it is responsive, meaning that
it displays properly on all types of devices and shouldn't act strangely depending on the
size of the screen.

Frontend Development Languages


Hypertext Markup Language (HTML): HTML stands for Hypertext Markup
Language. It is a markup language that is used to design the front-end portion of web
pages. HTML is a markup language that combines hypertext with markup. The term
"hypertext" refers to the link between web pages. Within the tag that specifies the
structure of web pages, the markup language is used to create the text documentation.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 99 of 149

• CSS stands for Cascading Style Sheets, which is a simple language meant to make
the process of making web pages presentable easier. Styles can be applied to web
pages using CSS. More crucially, CSS allows you to do so without having to
worry about the HTML code that makes up each web page.
• JavaScript is a well-known programming language that is used to create magic on
websites in order to make them more interactive for users. It's utilized to improve
a website's functionality and run exciting games and web-based software.
• React: JavaScript is used to create the UI development library React. It is
controlled by Facebook and an open-source development community. Despite
being a library and not a language, react is widely used in web development. One
of the most used frontend frameworks for web development, the library was
released in May 2013.
• jQuery: A popular and well-known JavaScript framework and application
development environment is jQuery. It has characteristics that make the job of a
JavaScript application developer much easier and is smaller, faster to load, and
filled with functionality. JavaScript is no longer grafted onto stateless HTML as
an afterthought. From PCs to tablets and smartphones, it is increasingly employed
as the basis and the main engine for web development and application
development.

What is Backend?
• The server-side of a website is called the backend. It also ensures that everything
on the client side of the website functions properly while storing and organizing
data. It is the portion of the website that you are unable to view and use. It is the
part of the program that consumers do not directly interact with. Users indirectly
access the components and features created by backend designers through a front-
end application. The backend also includes tasks like writing APIs, building
libraries, and interacting with system elements devoid of user interfaces or even
systems of scientific programming.

Backend Development:
• The server-side of a website is called the backend. It also ensures that everything
on the client side of the website functions properly while storing and organizing

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 100 of 149

data. It is the portion of the website that you are unable to view and use. It is the
part of the program that consumers do not directly interact with. Users indirectly
access the components and features created by backend designers through a front-
end application. The backend also includes tasks like writing APIs, building
libraries, and interacting with system elements devoid of user interfaces or even
systems of scientific programming.

Backend Development Languages

PHP: The server-side scripting language PHP was created primarily for building
websites. PHP is referred to be a server-side scripting language since it executes code on
the server.

C++: It is a general-purpose programming language that is frequently used in modern


programming competitions. In addition, it serves as a backend language.

JAVA: Modern programming contests commonly employ this general-purpose


programming language. It also functions as a backend language.

Python: Python is a programming language that enables rapid work and more effective
system integration.

Node.js: JavaScript code may be executed outside of a browser using the open-source,
cross-platform runtime environment known as Node.js. You must keep in mind that
NodeJS is not a programming language or a framework. Most folks are perplexed and
realize it's a computer language or framework. For creating back-end services like APIs
for web apps or mobile apps, we frequently employ Node.js. Large corporations like
PayPal, Uber, Netflix, Walmart, and others employ it in their manufacturing.

Relationship between Frontend and Backend

• While both the frontend and backend are essential to the operation of a website,
they different in terms of functionality. Regardless of their differences, they are
like two sides of the same coin. The former refers to what a user sees and interacts
with, while the latter refers to what a user is unable to see. The client-side of an

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 101 of 149

application is referred to as the frontend, while the server-side is referred to as the


backend. Both are essential to web development, yet their jobs, responsibilities,
and working conditions are vastly different. The frontend is what users see,
whereas the backend is where everything happens.

2.1.1 Difference between Frontend and Backend

FRONTEND BACKEND

• Frontend refers to the client side of the application Backend refers to the server
side of the application
• It is the part of the website users can see and interact with It constitutes
everything that happens behind the scenes
• It typically includes everything that attributes to the visual aspects of websites It
generally includes a web server that communicates with database to server
requests that the frontend presents
• It forms the basis of what users can touch and experience on their web browsers It
is the brain of the website that is never visible to the end users
• The essentials of frontend web development include HTML, CSS, and JavaScript
the essential of backend development include Ruby, Python, Java, .Net, etc.…

2.1.2 PRESENTATION LAYER

What is presentation layer?


• The sixth layer in the Open System Interconnection (OSI) paradigm is called the
Presentation Layer. Because it acts as a data translator for the network, this layer
is also known as the translation layer. To transfer the data across the network, this
layer extracts and modifies the data that it gets from the Application Layer. This
layer's primary duty is to offer or specify the data format and encryption. The
presentation layer is sometimes known as the syntax layer because it oversees
ensuring that the data it receives or sends to other layers has the correct syntax (s)

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 102 of 149

• Data transferred across the network is formatted and encrypted by the presentation
layer.
• This layer ensures that the data is transmitted in a way that the recipient will
comprehend it and be able to use it effectively and efficiently.
• This layer controls the abstract data structures and permits the development or
exchange of high-level data structures, such as banking records.
• At the transmitter and receiver, this layer performs encryption and decryption,
respectively.
• This layer applies data compression to lower the transmission bandwidth of the
data (the primary goal of data compression is to reduce the number of bits which
is to be transmitted).
• Since different computers employ various encoding techniques, this layer oversees
ensuring interoperability (the capacity of computers to exchange and use
information).
• This layer mostly handles the data display aspect.
• Data compression, or reducing the number of bits used in transmission, is done by
the presentation layer, which also increases data performance.
• Additionally, this layer addresses the problems with string representation.
• The integration of all formats into a uniform format for effective and efficient
communication is another duty of the presentation layer.
• For communication between different systems, this layer encrypts the message
from the user-dependent format to the common format and vice versa.
• The syntax and semantics of the messages are handled by this layer.
• This layer also makes sure that the messages that must be delivered to the top and
lower layers are accurate and presented in a consistent manner.
• The translation, formatting, and transmission of information for processing or
display are also the responsibilities of the presentation layer.

2.1.3 Aplication Layer

What is application layer?


• The Application Layer is the top layer according to the Open System
Interconnection (OSI) model. Any type of user may access the network with ease

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 103 of 149

thanks to this layer's wide range of data manipulation possibilities. Additionally,


this layer demands a variety of information from its presentation layer, which is its
bottom layer. The Application Layer interface, which interfaces directly with
programs, provides common web application functions. This layer provides
services directly to application processes and is essentially the top level of an open
system.

• Users can forward multiple emails using the application layer's feature, which also
offers storage.
• Users can access, retrieve, and manage files on a distant computer using this layer.
• Users can sign on as a remote host.
• This layer gives users access to worldwide data on different services.
• Email, file transfers, results distribution to the user, directory services, network
resources, and other services are all provided by this layer.
• It offers protocols that let computer programs transmit and receive data and
provide consumers useful information.
• It deals with concerns like resource allocation, network transparency, and other
things.
• Users and application processes can access network services through this layer.
• Although it performs application layer functions, the application layer is
fundamentally not a function.
• The shared protocols and interface techniques used by hosts in a communication
network are specified by the application layer, which is essentially an abstraction
layer.
• Application Layer aids in coordinating communication and identifying
communication partners.
• Users can communicate with other software programs through this layer.
• Since the material is presented visually in this layer, consumers are better able to
comprehend it than when it is remembered or shown as binary (0s or 1s).
• By interacting with the operating system (OS), this application layer essentially
further safeguards the data in an appropriate way.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 104 of 149

2.1.4 Custom Built Website

What is Custom Built Website?


A unique website is created from nothing. It is coded to work with anything your
company does. There isn't a template that will limit your requirements.
Custom websites may be updated easily and will expand as your company does.
Personalized websites may be modified more easily than templated ones.

Examples:
• WordPress
• 21 capitals
• Land Rover
• Capital Harvest
• Mastercard
Custom built website Pros:
• specialized to the business
• countless designs
• Updates are always possible
• improved SEO rankings
• adaptable as firms expand
• Highly responsive and mobile-friendly
Custom built website Cons:
• Expensive
• Time-consuming
• The website is dependent on the skill of the developer
• Template Website

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 105 of 149

What is Template Website?


• Most content management systems provide ready-to-use, built-in themes called
templates (CMS). You may pick from a set of pre-existing layouts, fonts, and
colors in their settings.
• Website templates are quick and simple to use. They are easily available online
for purchase or free download.

Templates website Pros:


• Simple personalization
• swift implementation
• less costly
• already have a good design
• suitable for new enterprises
• easily maintained
Templates website Cons:
• limited in terms of upgrades and design
• Navigation simply follows the topic.
• Security is a problem.
• Functioning is restricted

2.1.5 Custom Built Website vs Template Website

KEY WORDS CUSTOM BUILT WEBSITE TEMPLATE WEBSITE


1.Cost High initial realization costs Low initial cost
2.Maintenance to guarantee responsiveness and security, need to maintain a team of
professionals to monitor and improve the website Maintenance involves only texts and
pictures, so it does not need information technology professionals
3.Construction Time a custom-made website may take from a few weeks to a few
months to be built, depending on its complexity short construction time
4.Securityif updated constantly, custom-made websites are more secure than template
sites Low security
5.User experience Offer higher satisfaction and better user experience Templates are
basic in design with navigational limitations with average user experience

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 106 of 149

6.Flexibility custom built websites have unique needs or design, or flexibility


Templated websites offer less flexibility in design capabilities
7.Performance Custom built website performance is higher than a template site Template
site performance is lower than the custom-built sites
8.functionality Custom websites offer us greater functionality (Responsive design,
Smooth navigation, Security, streamlined code, Compatibility) Template Website
functionality is average according to custom built websites

3 Task

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 evidence of the design,
multipage website supported with fidelity wireframes and a full set
of client and user requirements.

3.1.1 Client and User Requirements

Functional requirements
Login: Users must be able to sign into the system by entering their username and
password in the login module.
Patient Registration: The front desk staff members have access to add new patients and
their data to the database thanks to permission from the hospital management.
Authentication: The HMS gives front desk staff the ability to create a unique ID for
every patient, which is then placed to the patient's record sheet. The patients can use the
ID during their whole stay in the hospital.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 107 of 149

Patient Information: The patient's ID, name (first and last), address, phone number, the
doctor's information, ward name, and medical history are all included in the report that
the hospital administration system generates for each patient.
Room Availability: Additionally, the hospital management system helps with the
creation of reports on the scheduling of wards and rooms, including details on room
availability, bed numbers, vacant or occupied bed details, ward name, staffing, and
operating room scheduling.
Update patient information: Users of the hospital management system are able to
update patient information, including patient bills and records of their medical history.
Erase information: If a user makes a mistake, the hospital management system allows
them to delete the patient's or doctor's information.
Doctor updates reports: The system should enable doctors to read patient records and
submit any necessary patient advice or new prescriptions.

Non-Functional Requirements

Availability: The system must be accessible round-the-clock.


Capacity: The system must be able to handle 2500 concurrent users.
Performance: A web page shouldn't take more than 6 seconds to load while using a
56Kbps modem connection.
User Interface: A reaction time of 5 seconds is required for user interface displays.
Conformity: The system must adhere to Windows accessibility guidelines.
Durability: In the event of a failure, the system must automatically recover within 10
seconds, and the server must get a detailed crash report outlining the issue.
Adaptability: To support devices of different shapes and sizes, the system (web
application) must be responsive and adaptable.
Security: Firewalls must be activated, and an Active Anti-Virus must be running on all
hospital-using devices.
Modification: Only the admin is responsible for planning and carrying out system
modifications such as insert, remove, and update.
Accessibility: The administrator and other users who have registered can access the
system, but each user controls the amount of access.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 108 of 149

System Requirements
Hardware Specifications Software Specifications

Computer: Desktop PC 4 GHz minimum Operating system: Windows 10


Processor: Core i5 processor, i7 processor Xampp server
recommended
Memory: 16GB RAM minimum, 32 GB
recommended
Storage: 500GB of hard disk space

Internet connection: Wi-Fi router 500 kbps

3.1.2 ER Diagram

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 109 of 149

3.1.3 WIRE FRAME

What is a Wire Frame?

A website wireframe is a visual depiction of a website's basic architecture, often known


as a page schematic or screen blueprint. The term "wireframe" is taken from other areas
that use a skeleton structure to depict three-dimensional shape and volume. Components
are organized in wireframes to best achieve a certain aim. The purpose is typically driven
by a creative idea and a business objective. The wireframe displays the website's page
layout, together with the interface elements and navigational tools, and their relationships.
Typographic design, color, and graphics are often not included in a wireframe since the
focus is primarily on the information's usefulness, behavior, and relevance. In other
words, it prioritizes screen usefulness over screen aesthetics. Designers, and those with
knowledge of interaction design, information architecture, and user research are often the
ones that generate wireframes.

Wireframes focus on:


• The variety of features offered
• The information and functions' relative priority
• The guidelines on how to show specific types of information
• Different situations' effects on the display

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 110 of 149

• Home Page wireframe

• Home Page Interface

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 111 of 149

• Wireframe for About Us

• Interface for About Us

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 112 of 149

• Wireframe for Login

• Interface for Login

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 113 of 149

Wireframe for information insert

• Patient information INSERT

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 114 of 149

Patient for information UPDATE

Patient for information DELETE

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 115 of 149

Patient Information SELECT

Payment Information Interface

Interface for Rooms information

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 116 of 149

Interface For Room Availability

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 117 of 149

Interface for staff Information

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 118 of 149

Main Cording

• Home Page Codes

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 119 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 120 of 149

• Java Script

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 121 of 149

• Invoice

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 122 of 149

• Operation

• Patient UPDATE

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 123 of 149

• Patient SELECT

• Patient Info INSERT

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 124 of 149

• Patient Information DELETE

Database design for the proposed system

• Patient Information table

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 125 of 149

• Operation Information table

• Payment Information table

• Rooms Information table

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 126 of 149

3.2 Technical challenges you faced during the development.

4 Task

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.

Quality Assurance (QA) makes sure that end users have the greatest possible user
interface and experience when using a website. It examines a website to check for issues
that were overlooked throughout the design and development phase.

The QA team evaluated the user experience and system user interface It is hoped that the
procedure would reveal design and development errors. the QA testers responsible for
carrying out several duties within the QA process, such as evaluation monitoring
compliance with all customer requests and requirements. They develop a test approach as

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 127 of 149

well.to test the system, as well as test scenarios. On the other hand, quality assurance
often involves testing of requirements, designs, and functionality.
Requirement testing: considers both the customer's stated demands and any design
documents that have been approved by the client. The system's design and prototype are
evaluated by the QA testers using a list of criteria that they create. To ensure that the
project team completes all of its mission goals, requirement testing is important
throughout the development process. The QA testers complete the document and create a
test plan to test the system after confirming that the requirements document's quality is
guaranteed and maintained. Among the browsers that work with the website are
Microsoft Edge, Google Chrome, Opera, and Mozilla Firefox.
Testing the functionality- Design testing is concentrated on the aesthetics. When testing
the design, the QA tester determines if the website's look and feel adhere to the intended
design and overall layout. The process of design testing has several facets and includes
activities like browser testing. On the other side, the site's user interfaces have undergone
extensive testing, and everything from the typography to the images to the color of the
interfaces works as it should. The design may be tested using a number of approaches,
such as tree testing, card sort testing, and A/B testing. To ensure the quality of the
product, a design test is run on several browsers.

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.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 128 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 129 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 130 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 131 of 149

Test plan

• Introduction- The well-known and often crowded Arogya Healthcare


Hospital is renowned for its medical services. The Arogya Healthcare Hospital
made the decision to use a hospital administration system, which was created

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 132 of 149

using HTML, CSS, JavaScript, PHP, and MySQL. The Arogya Healthcare
Hospital Management System gives employees and doctors all necessary and
fundamental information on patients, as well as information about daily
schedules, patient invoicing, and room availability.

• Purpose- Basic tasks are now carried out manually in this area, however
building a fully automated system is the major goal. Patients may register and
log in to the system here, and administrators can update information and check
the availability of rooms, among other capabilities that have largely been
added to the system. Another is that the system enables patients to schedule
appointments, another is that administrators can figure out how much to
charge for visits, and the last is that people may look for physicians based on
speciality. These are the system's primary few functions. Therefore, the main
goal is to develop an automated system with these features.

• Scope-Testing will be done on a few functionalities to make sure the system is


user-friendly and completely functional. Here, the full buttons will also be put
to the test. We have prioritized the features because the hospital management
system has a vast number of functions, and testing will proceed in accordance
with this priority.

• Goals- The major objective of the test is to discover flaws in the system while
also ensuring user usability. And provide a permanent remedy for their bugs;
moreover, after the testing, the system should be easy to use and beautiful;
additionally, after the testing, the system's users should be able to easily
accomplish their tasks effectively.

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 133 of 149

4.2.1 Testing criteria

Test Case Id Test case data Expected output Actual Output


(Input)
01 Login login Successful Login Successful
Username: ESoft
Password: 2255

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 134 of 149

Test Case Id Test case data Expected output Actual Output


(Input)
02 Insert Patient’s Patient’s information Patient’s information
Information to the inserting inserting
database Successfully Successfully

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 135 of 149

Test Case Id Test case data Expected output Actual Output


(Input)
03 Insert Doctor’s Successfully Successfully
Information to the inserting information inserting information
database to the table to the table

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 136 of 149

Test Case Id Test case data Expected output Actual Output


(Input)
04 Operation Operation Information Operation Information
Information Insert insert Successful insert Successful

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 137 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 138 of 149

Test Case Id Test case data Expected output Actual Output


(Input)
05 Rooms Information Operation Information Operation Information
Insert insert Successful insert Successful

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 139 of 149

From all these test cases we were able to obtain the expected results

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 140 of 149

Based on test findings and other testing techniques, the Arogya healthcare hospital
management system has been a significant success in this area. Although the system is
more attractive, several functions still need to be included. Based on the test results, the
built system may be regarded as a good system. It is also more user-friendly. The system
works well because it performs well and meets expected needs. The system may be
referred to be efficient since user operations take less time, and the security level is the
most crucial component of the system because all user information is completely
protected. These are the main causes of the system's effectiveness.
The developed system does have several shortcomings. The first is that you cannot add a
profile photo when you register. There is no option to add a photo to the patient profile
while registering as a patient. These types of qualities are more appealing to most people
now than ever before. Lack of good communication among system users is the second
problem. Users don't like that the only way to contact us is through contact us. User
engagement will increase if a chat system is used to connect people as required. Another
illustration is this website, which is exclusively accessible to subscribers.

4.2.2 User Guide

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 141 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 142 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 143 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 144 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 145 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 146 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 147 of 149

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 148 of 149

5 Referents

Create a Web Application (2022) [online]


https://spdload.com
Available at 3 https://spdload.com/blog/how-to-develop-a-web-application/
[ Accessed 19th Sep 2022]

Definition of SEO (2022) [online]


https://blog.hubspot.com
Available at 3 https://blog.hubspot.com/marketing/what-is-seo
[ Accessed 19th Sep 2022]

web development (2022) [online]


https://tillerdigital.com
Available at 3 https://tillerdigital.com/blog/an-introduction-to-web-development
[ Accessed 19th Sep 2022]

difference between webpage, website, web server (2022) [online]


https://developer.mozilla.org
Available at 3 https://developer.mozilla.org/en-US/docs/Learn/Common_questions
[ Accessed 19th Sep 2022]

protocol (2022) [online]


https://dictionary.cambridge.org
Available at 3 https://dictionary.cambridge.org/dictionary/english/protocol
[ Accessed 19th Sep 2022]

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)


lOMoARcPSD|19670363

Page 149 of 149

Web Design Techniques (2022) [Online]


https://thenextscoop.com
Available at: https://thenextscoop.com/web-design-techniques/
[Accessed 19th Sep 2022]

Web - Server Types (2022) [Online]


https://www.tutorialspoint.com
Available at: https://www.tutorialspoint.com/web_developers_guide/
[Accessed 19th Sep 2022]

Niluksha Dulmina Web Design & Development Assignment 01

Downloaded by udesh ishanka (udeshedu@gmail.com)

You might also like