Multipage Website Design and Development Project for Tours and Travels

Desklib provides past papers and solved assignments for students. This project details the creation of a multipage website for tours and travels.

Table of Contents
Introduction......................................................................................................................................3
LO1: Explain server technologies and management services associated with hosting and
managing websites...........................................................................................................................4
P1: Identify the purpose and types of DNS, including explanations on how domain names are
organized and managed...............................................................................................................4
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......................................................................................................................5
M1 Evaluate the impact of common web development technologies and frameworks with
regards to website design, functionality, and management.........................................................6
M2 Review the influence of search engines on website performance and provide evidence-
based support for improving a site’s index value and rank through search engine optimization.
.....................................................................................................................................................6
LO2 Categories website technologies, tools, and software used to develop websites....................7
P3 Discuss the capabilities and relationships between front-end and back-end website
technologies and explain how these relate to presentation and application layers......................7
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)...............................................................................................................................8
M3 evaluate a range of tools and techniques available to design and develop a custom-built
website.........................................................................................................................................9
LO3 Utilize website technologies, tools and techniques with good design principles to create a
multipage website..........................................................................................................................10
P5 Create a design document for a branded, multipage website supported with medium-
fidelity wireframes and a full set of client and user requirements.............................................10
P6 Use your design document with appropriate principles, standards, and guidelines to
produce a branded, multipage website supported with realistic content...................................10
M4 Compare and contrast the multipage website created to the design document...................11
LO4 Create and use a Test Plan to review the performance and design of a multipage website.. 11
P7 Create a suitable Test Plan identifying key performance area and use it to review the
functionality and performance of your website.........................................................................11
M5 Evaluate the Quality Assurance (QA) process and review how it was implemented during
your design and development stages.........................................................................................17
Conclusion.....................................................................................................................................19
References......................................................................................................................................20

Table of figure
Figure 1: Navigation bar................................................................................................................12
Figure 2: Test case 1......................................................................................................................14
Figure 3: Test case 2......................................................................................................................14
Figure 4: Test case 3......................................................................................................................15
Figure 5: Test Case 4 Validation 1................................................................................................15
Figure 6: Test case 4 Validation 2.................................................................................................16
Figure 7: Test case 5 Mozilla Firefox............................................................................................17
Figure 8: Test case 5 Google Chrome...........................................................................................17
Figure 9: Test case 5 Opera Browser.............................................................................................18
Figure 10: Quality Assurance chart...............................................................................................19

Introduction
In this scenario, a user required to develop the website used for tours and travels. The website
will be easy to use and easy to navigate. The navigation bar will be included in the website to
reach every other page of the website. This scenario will cover the study of the development of
the website. In this development designing of the website is performed including coding of the
website. Testing will also be covered in this scenario which is one of the important steps towards
the development. Quality Assurance technique will also be discussed during the scenario.
Website will be developed by using HTML, CSS (Alawar & Naser, 2017). A bracket text editor
will be used due to its features for the development of the website.

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.
Website:
The website is a collection of Webpages which are interconnected & can be accessed by
publically by sharing a unique domain name. It is used to provide the facility for different
purposes.
DNS:
 DNS stands for Domain Name System (Bridy, 2017).
 It can be defined as the contact book of the internet. We can easily get the data,
information & files through domain names.
Purpose of DNS:
 DNS is used to contain the IP address and the domain name of the website.
 It is used to identify the requested domain from server to ease to resolve the queries
which are hit by the user.
 Web browser directly calls the IP address (Internet Protocol) when a user hits the request
for accessing the information from the website and this IP address got by the browser by
converting domain names to IP address with the help of DNS.
Types of DNS: DNS servers are classified on the basis of their different functionality like
performance by a single server in different zones, forwarding the query and reverting it.
 Zone Master Server: Zone Master Server is the trustworthy server which contains all
the data of a database, linked to a particular server region. This data is contained by
primary master-slave & secondary slave.
 Primary Master-Slave: When the operation starts the primary data or master data is
loaded into the disk & make changes into server zone database and if in case there is an
extra load on the primary master-slave then the data is shared on the secondary slave
server.

 Caching-Only Name Server: The caching only name server is containing the outcomes
of the hit queries by the user. When the next time this query is hit to the server then it
provides the results directly instead of waiting.
 Root Server: These are one of the most important reliable servers which are needed to be
used for the complete domain name system structure. The very most first step is the
process of converting the domain name to the IP (Internet Protocol) address. It is used for
replying the requests for the domain name and reverting it to the top-level domain.
 Forwarding Server: These servers are the proxy, client or remote server which is used
to forward all the requests which are created by the user to the DNS servers and create a
backup of the outcomes.
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.
HTTP
HTTP is standing for the hypertext transfer protocol. It is widely used for communicating the
protocol.it is followed by the address field. It is having a client-server protocol. The server is
sending back to the response of request generated by the user browsing (Graniszewski, et al.,
2016).
Telnet
Telnet is used as communication protocols. Telnet is using the accessibility of server working as
remote. It is following the actually log on to the remote server & performing the functionality
and if you are sitting in the face of server terminal (Seong, et al., 2016).
FTP
FTP is standing for the file transfer protocol. It is using documents like image, music and remote
computers. User is having the logon for the FTP server with CLI as command line interface.
User can easily navigate the remote server file structure with movement & renaming the deleting
& copying file as operation (Wei, et al., 2016).
HTTPs

HTTPs is standing for the Hypertext transfer protocol with security. It is completely the same as
HTTP working but with the security, aspect is followed by TLS transaction layer security
(Petrov, 2017).
M1 Evaluate the impact of common web development technologies and frameworks
with regards to website design, functionality, and management.
Managing & Organizing of Domain Names
DNS is a universal system for translating the IP address to domain names which are easily
understood by the user. When a user wants to access the web address like “akshay.com” then the
web browser requests a DNS query against a DNS server containing the hostname. The DNS
server takes the hostname and converts it into a numerical IP address.
DNS resolver is responsible for the identifying the hostname is in local cache database or not and
if not then it contacts the server until and unless it receives the IP address of the DNS name
servers.
M2 Review the influence of search engines on website performance and provide
evidence-based support for improving a site’s index value and rank through search
engine optimization.
Ways & reviewing the performance of the website using SEO
SEO is standing for search engine optimization (Luh, et al., 2016). Here below is the evidence-
based support which is providing the evidence-based support for enhancing the website ranking
& indexing using SEO and these are as follows:
 Remember that only relevant information is published as content on the website using
web writing skills.
 Regularly updating content is required for web site relevance.
 Metadata is required for a better description of the metadata and keyword and working as
pre-populated this data.
 Always use the alt tags with an alternative text description.

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.
Front End Development
Front end development is having the interaction for receiving the backend application. It is
having the touch & feel the experience. The major role of a web designer is having to change
dramatically button which are available on the website like navigation, colors, and images. The
major role of front-end development is having to create the environment for viewing the user
with a combo of server client-side technologies as HTML CSS and JavaScript.
Back End Development
Back end is also having the server-side scripting languages for the development of the website
which are not able to interact as client-side used. Eventually, it is working as a server-side
provider for front end development. It is having the part of the system for directly contacting the
user. The back-end development is handling the user interface with API (Application
Programming Interface). It is also having libraries for utilizing the web designer. The major role
of the back end is to maintain the core functionality of software with the management of logic
also.
Relationship Between Front End & Back End
Here, below is the fact regarding the relationship between front end & back end and these are as
follows:
 Both of them are having a different crucial role in the development of web technologies.
The front end is having the complete visual facts of the website such that user can see and
feel the experience. However, the backend for the database connection.
 The role of the front end is to design a website in such a better understanding &
experience. For back end development, it is having content published from a database in
a better manner.
 The front is also referred to as client-side & back end is known as a server-side scripting
language.

 The major role of front-end development is having to create the environment for viewing
the user with a combo of server client-side technologies as HTML CSS and JavaScript,
however, PHP is used for the development of the server side and database interaction.
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).
Online Creation Tools
Most of the websites are having CMS as a content management system for which companies are
allowing the easy updating for the technical support. By opening the most famous of the platform
is word press which is acting as 2017.
Pros of Online Creation Tool
Here, below is the advantages & pros of the online creation tool and these are as follows:
 Online creation tools are having less expensive with more modification into the website.
 Online creation tools are having quite fast for implementation.
 It is having online robustness and a great amount of customization.
 In this, it is having less complexity and better working performance and schedule.
Cons of Online Tools
Here, below is the disadvantages & cons of the online creation tool and these are as follows:
 Skilled designers are having fewer graphics and customization in the template.
 You cannot manage easily with a large amount of template working as expensive graphic
design.
 Most of them are not made properly and maintained.
 There might be a possibility that functionality is within template websites.
Custom Built Website
In this type of website, we have to develop the website within the coding by their in hand with
creating their own design which is fulfilling the requirement of the website. It is having a single
instance of the website look & feel.
Pros of Custom Built Website
Here, below is the advantages & pros of the online creation tool and these are as follows:
 It is having a large amount on the graphics and functionality.
 They are having more flexibility within the growing of the website.

 They are very easier for updating the website content rather than having the word press is
updating.
 Search engine optimization is very easy for customizing built website.
M3 evaluate a range of tools and techniques available to design and develop a
custom-built website.
Web site designing is having the tasks for the discipline as maintaining the website and its
management. For designing of the website, we have to follow the below-mentioned area:
 Web graphic designer
 Designer for interface
 Authoring
 Designer for User Experience
 SEO
 Standardized code as proprietary software.
Here, below is the list of the tools which are used for designing the website and these are as
follows:
 Pixate
 Webflow
 Macaw
 UXPin
 Sketch
 Avocode
 Affinity

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.
Home Page
This home page is having the details of all contact us and as well as a header file. It is having the
details of the hotel with tourism also. With these all at the end, it is having the contact details of
information with the contact form contacting the queries of the user.
About Page
This about usage is used to giving the details of the CEO of the website. In this about us page
what the company does and how they do is represented. Information of the CEO is also provided
on the website only.
Service Page
In this page, the services of the company are allotted. The service section involves all the
provided service of the website.
Gallery Page
Gallery page contains some of the best photographs of the tours provided by the company. This
page is usually created to attract clients towards the company.
Contact Page
All the communication details of the company are provided on this page. Here google map is
also used to define the location of the company. Company address, phone number, etc. are
provided in this section.
P6 Use your design document with appropriate principles, standards, and guidelines
to produce a branded, multipage website supported with realistic content.
Website is developed according to the requirement of the client. All the necessary components of
the website are included like a navigation bar which is used to navigate the user to all the
component of the website.

Figure 1: Navigation bar
The above figure depicts the navigation bar of the website which is according to the requirement
of the client. This navigation bar is used to navigate the user to a different part of the website.
The overall content of the website is placed in such a way so the website looks beautiful and
realistic. As the Holidaymaker is a website for booking tours. Thus this website includes lots of
packages of tours and travels. Photos of various famous visiting sites are used to attract user
towards the package.
M4 Compare and contrast the multipage website created to the design document.
The website is designed according to the documentation only. As in documentation, we talk
about the navigation bar. This navigation bar is included in the final product or formed website.
The website is designed according to the documentation provided only. The final website is
completely fulfilling all the requirement of the website.
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.
Testing part of any software is the main part of the development. Because all the bugs are
removed after testing only. The website is tested against various odds so to remove every bug
before delivering it. Testing also involves cross-browser compatibility of the website.
Test cases
Sr. No. Objective Expected result Actual result Pass/Fail
1). To test the
alignment of the
content of the
Content must be
aligned properly
as the size of the
The result is as
expected.
Pass