Website Design and Development Report: London Automobile Limited

This report details the website design and development process for London Automobile Limited, a car dealer firm. It begins by defining web design and development and then explores the purpose and types of DNS, server hardware, communication protocols, web servers, and operating systems. The report assesses the influence of web development frameworks, such as Bootstrap 3, and evaluates the impact of search engine optimization (SEO) on website performance. It justifies the techniques and tools used for custom-built websites, illustrating the relationship between back-end and front-end technologies. Furthermore, it compares online website creation tools with custom-built sites, assessing functionality, UI/UX, performance, and flexibility. The report includes a design document for a multipage website, supported by wireframes and user requirements, and discusses the creation of a test plan to evaluate the website's performance and functionality. Finally, it evaluates the quality assurance process and reviews the overall success of the multipage website, covering technical disputes and providing a comprehensive overview of the design and development stages.

Website Design
and
Development

Table of Contents
Introduction......................................................................................................................................3
P1 Identify the purpose as well as types of DNS and ways in which they can be managed &
organized......................................................................................................................................3
P2 Explicate purpose & relationship among server hardware, communication protocol, web
server and operating system software with respect to design, publish and accessing website. . .4
P3 Assess the influence of web development frameworks & technologies.................................4
P4 Evaluation of influence of search engines on performance of website and render evidence
based support for improvisation of index value...........................................................................5
P5 Justification of the techniques and tools used to comprehend custom-built website..............5
P6 Illustrate abilities and relationship between back end and front end website technologies,
along with application & presentation layer.................................................................................6
P7 Compare online website creation tools with custom-built sites in context of functionality,
UI, UX, performance and flexibility..........................................................................................17
P8 Assess techniques and tools that are available for designing as well as development of
custom-built website. ................................................................................................................17
P9 Develop a design document for multipage website that is supported with medium fidelity
wireframes and user requirements..............................................................................................18
P10 Utilize design document with suitable standards, guidelines and principles for producing a
multipage website supported with realistic content...................................................................18
P11 Compare as well as contrast the multipage website with design document.......................19
P12 Critical evaluation of design as well as development process with respect to design
document and analyze technical disputes...................................................................................19
P13 Creation of appropriate Test Plan identification key performance area as well as utilize it
to evaluate performance and functionality of website...............................................................20
P14 Evaluation of quality assurance (QA) process along with its execution while designing
and development stages..............................................................................................................20
P15 Critical evaluation of outcome of Test Plan and comprise a review of the overall success
of your multipage website. ........................................................................................................20
Conclusion.....................................................................................................................................21
References .....................................................................................................................................22

Introduction
Web design is defined as a process that is associated with creation of website and
comprise of wide range of aspects like webpage layout, graphic design and content production. It
is a subset of web development (Belanche, Casaló and Guinalíu, 2012). The process involved
within establishment of web site for intranet (private network) or internet (World Wide Web) is
referred to as website development. This report is based on a London Automobile Limited which
is a car dealer firm and is developing their website for promoting their business in which they
will be selling new as well as used cars. This report comprises of server technologies &
management services, categorization of different software, tools and technologies. Apart from
this, usage of website technologies along with principles for development will be illustrated.
Furthermore, test plan will be created for reviewing the design as well as performance of
multipage website.
P1 Identify the purpose as well as types of DNS and ways in which they can be managed &
organized.
The internet system that can be utilized for conversion of alphabetic names into numbers
(IP address) is referred to as DNS (domain name system). For an example, www.google.com,
here google.com is a domain name and www is the name of host (Bhamra and Lofthouse,
2016). Types of DNS have been specified below: DNS Recursive Resolver: This is first stop within DNS query which acts like a
middleman among nameserver and client. Recursive resolver may either reply with
cached data or send request which will be followed by TLD name server and at last again
appeal will be made to authoritative. Once response is attained, recursive resolver will
respond to client’s demand. DNS Root Name server: This is the initial step from hostname to IP address which is
liable for extracting top level domain from query made by users. For an instance,
www.facebook.com which renders details associated with .com TLD and server will
furnish details related with domain .com (Erl, 2016). TLD Nameserver: Top level domain server that is liable for maintaining information
related with common domain names like .net, .com or anything which comes after dot in

URL. If user is looking for specific domain name then a query will be sent to TLD name
server that will respond via authoritative name server.
 Authoritative Nameserver: When a response is attained by recursive resolver from TLD
name server, then it will be directed to authoritative name server. It comprises of
information peculiar to domain server which it serves (Jolliffe, Ritter and Stevens, 2012).
Domain name is managed by different organisations, they are Accredited registrars,
operators of top level domains, Internet Assigned Numbers and Internet Corporation for
Assigned Names and Numbers. They are organised within subordinates or subdomain levels
present in DNS root domain that is nameless.
P2 Explicate purpose & relationship among server hardware, communication protocol, web
server and operating system software with respect to design, publish and accessing
website.
Communication depends on interaction which takes place in between distinct protocols
that are liable for implementing conventions as well as rules which will govern the ways in
which devices communicate in a network. Web server is either a hardware or software which is
liable for rendering client satisfaction. It processes request over HTTP as well as other associated
protocols. Web servers of London Automobile Limited can carry out storage, processing and
delivery of web pages to their clients. The communication among server as well as client occurs
through the usage of hypertext transfer protocol. Web hardware comprises of large memory as
compared to computer and posses faster hard drives and processors which makes it easy for
clients to access the request made by them (Kraak and Brown, 2014). Web server software is
being utilized by server computers for making programs and files available for clients. For an
instance email software and internet utilities are used. Some communication protocols are UDP
(User datagram protocol), SMTP (Simple mail transfer protocol), IP (Internet protocol), POP
(Post office protocol) and there are many others. Web servers are Apache Tomcat, Caddy,
Tornado, Apache HTTP server, etc. Operating software are linux, macOS, Unix, iOS, Android
and there are other versions also. An instance can be taken to understand this concept like
operating system provides a platform on which user may carry out their operations but while
making use of internet the messages are transmitted through the usage of communication
protocols like when request is made then server respond to it accordingly. While developing
website all these aspects must be taken into consideration as when any individual will search for

something then there must be appropriate response for this.
P3 Assess the influence of web development frameworks & technologies.
Bootstrap 3 is the common framework which is being utilized at for development of
website. It entirely depends on web developer that how customized is the website. London
Automobile Limited can make use of this as it renders CMS-powered sites along with dropped-in
templates and bootstrap exist in the middle. This implies that some work has been carried out in
advance; it will also provide customizable Bootstrap CSS and JavaScript effects. Bootstrap
enables developers to start from small and it can be scaled up as per requirements without getting
complicated. For this, developers of London Automobile Limited can ensure that top-down
approach is utilized as this is counterintuitive. In this grid-based layout approach acts as a key in
which 12 columns can be utilized in layout which is then combined for wider columns those are
planned within layout classes whose size vary depending on device on which they are being
accessed (Larman, 2012). It allows developers for building up front ends without advance
knowledge of CSS or HTML. Bootstrap can be applied by developers for any kind of content
management system, customized PHP coded site or static HTML site as this is flexible.
P4 Evaluation of influence of search engines on performance of website and render evidence
based support for improvisation of index value.
SEO (Search Engine Optimization) denotes the process of enhancing quality as well as
quantity of traffic on website by improving the visibility of web page to the users who make use
o web search engine (Montgomery, 2017). In simple words, it can be utilized for making
improvements within ranking of the website of London Automobile Limited or any other
organization. This can be taken as a framework which comprises of set of control and defined
stages.

SEO plays crucial role within the performance of website. People click on the top 5
suggestion present on the result page, this imply that website of London Automobile Limited
must appear on this. SEO is a practice which can be utilized by them for improving experience of
users along with website capability (Reiser and Dempsey, 2012). This will act as an affirmative
asset for London Automobile Limited firm as it will amplify likelihood of people who are
engaged for having specified service from web. Along with this, load speed will also lead to
improvisation within ranking of search engine as web hosting quality can be improved with this.
Header tags can be placed in an appropriate manner and content can be organized so that it
becomes easy to read. The relevance as well as reliability is dependent on how many times other
sites have been linked with this. The content of website must be kept up-to-date so that website
of London Automobile Limited can attain higher ranking.
P5 Justification of the techniques and tools used to comprehend custom-built website.
It is important for developer of London Automobile Limited to identify that whether
dynamic or static website is to be created. Here, dynamic website will be created then MySQL,
PHP, HTML5 and CSS3 will be used. Then the framework has to be chosen which will be used,
Sublime Text 3 (editor), Bootstrap 3 (frontend design framework), MySQL and PHP (backend
development framework). The reason for making use of these technologies is to provide an
interface which will render high speed of downloads. HTML5 will furnish tags for drawing
graphics on website by making use of JavaScript (Richey and Klein, 2014). For having cascading
style sheets which will amplify the website CSS3 is being utilized. Furthermore, Bootstrap will

assist developers of London Automobile Limited to have customized features and will also give
flexibility in choosing suitable attributes for pursuing the project.
P6 Illustrate abilities and relationship between back end and front end website technologies,
along with application & presentation layer.
A front end website technology denotes developing web pages as well as user interfaces
for web applications. This executes design, structure, animations and behavior of what is seen on
screen when mobile or web apps are opened.
Figure 1 : shows Home page sketch
The home page is shown above which details about London Automobile Limited and
options for user if they need old or new car accordingly they can have the details by clicking on
specified links.

Figure 2: shows used car sketch
The old car page have been shown which will provide user with details of vehicle along
with price according to this.

Figure 3: Shows New car sketch
It is identical to used car page but new vehicles are there. It comprises of images as well
as price of new vehicles which are available with company.

Figure 4: Shows contact us sketch
This page will give user with details associated with location of company as well as they
can communicate with the firm.

Figure 5: shows home page
Figure 6: shows home page
Figure 7: shows used car

Figure 8: shows used car details
The details of the vehicle which are used will be shown to user in this manner. It includes
colour, features, price along with other information.
Figure 9: shows new car page

Figure 10: shows new car details
Figure 11: shows contact us page

Figure 12: shows bootstrap codding
The coding has been illustrated above with respect to carousel along with size of images.
It is just a small part of coding which have been done while development of the website.

Figure 13: shows css coding

Figure 14: shows html coding
Figure 15: shows location of file
The above figure illustrates that on desktop where this website is placed. Basically, it
shows location of the file.
1. Home Screen shot: It illustrates different aspects of the website and the way in which the

entry page of organisation looks like.
2. Css coding: It has provided few details of coding. Basically, it implies cascading style
sheets which are being used for presenting document which has been written by making
use of markup language like HTML.
3. Html: Hypertext markup language is being utilised for displaying web browser and for
this technologies like CSS and other scripting languages can be used.
4. Bootsrape coding: This is a framework which comprises of huge collection of HTML,
JS and CSS for development of mobile based projects on web. Through this, code can be
reused.
5. File location screen shot: This implies the physical location of file like where it is stored
on the system of developer.
A front end website technology denotes developing web pages as well as user interfaces
for web applications. This executes design, structure, animations and behavior of what is seen on
screen when mobile or web apps are opened. The technologies which can be used by developer
of LAL are Java Script, CSS3 and HTML5. A Backend website technology includes Java, PHP
and .Net. When page is requested then server will parse the dynamically created web pages
(Simonsen and Robertson, 2012). This enables have a controlled programming environment in
which software can be executed, installed and developed.
Illustration 1: Three Tier Architecture
Front end is liable for carrying test which will determine three-tier architecture and
comprises of data request attained from client and accordingly responds to this (Venable, Pries-
Heje and Baskerville, 2016). The requests of users are compiled within packet before they are
sent to client server and the packets received by server can be browsed on the machine of client.
This is the reason that developers of LAL are asked about json, soap, xml, etc. along with tit
knowledge elated with languages is also important. This will enable individuals to have

impelling graphical user interface. Backend application will study database and application layer
within the three tier architecture which involves processing of requests which are made from
server side.
P7 Compare online website creation tools with custom-built sites in context of functionality, UI,
UX, performance and flexibility.
Basis Custom built Online website creation
Design flexibility This involves designing of web
according to business needs. This
assists within controlling the way
site looks and what can be
attained from site like end results
can be personalised.
Only few things can be
customised like logo, colour
and images at header. This
implies that layout is not open
to alterations (Yardley and et.
al, 2015).
User Interface(UI) It will aid developers of LAL to
formulate the looks exactly they
wanted it to be.
It is obvious that other sites
may also use the same deign so
there will be no uniqueness.
Presentation and User
Experience (UX)
A custom web design will be the
way to go if you want to create a
high-quality presentation and
user experience for your website
visitors (Belanche, Casaló and
Guinalíu, 2012).
A pre-made website template
might be preferable, however, if
image isn’t an important part of
your business
Custom Functionality It allows users for performing
actions on website which
produce outcome that are unique
to process or business.
Limited functionalities are
provided and that might not be
able to fit within actual needs.
Speed of Delivery It takes around 14 weeks for
completion.
The template can be executed at
specified moment.
P8 Assess techniques and tools that are available for designing as well as development of
custom-built website.
Tools Evaluate
Emmet  Provide a CSS-like shorthand to your manually coded pages.
 Provide you with a tool to cut through the most repetitive of coding task.
 Applying the simple syntax: ‘p.class_name” give you “<p
class=”class_name”>
 </p>. Nesting is simple: ‘div>p.class_name’ become
‘<div><p class=”class_name”></p></div>’
 It is going to save you a lot time (Bhamra and Lofthouse, 2016).
Sublime  Minimal interface for handling dependencies and fast page navigation

Text 3 occurs.
 Many languages are supported including the likes of C++.
 Editing features like indents an code are handle appropriately.
Technologies Pros Cons
HTML/CSS  It is supported by all browsers
and easy to learn.
 It comes by default in every
browser.
Lots of coding has to be done as well as
security features are also not appropriate.
PHP  It entirely compatible around cross-
platform (Erl, 2016).
 Can be easily embedded within
HTML and is highly scalable
 It is an open source platform which
makes it easy to access.
 Basic understanding of HTML is needed and
is not for desktop apps.
 Usually executes slowly as compared to
other languages.
Java Script  JavaScript can be executed quickly as
there is no need to contact with server for
a response.
 It can work with wide range applications
and can also be used within writing scripts
 Codes are executed on users systems which
might lead to exploitation of vulnerabilities.
 Different browsers interpret it
differently so it can be unpredictable
(Jolliffe, Ritter and Stevens, 2012).
P9 Develop a design document for multipage website that is supported with medium fidelity
wireframes and user requirements.
 A graphical skeleton of website which will assist within having ideas of pages which will
inspire customers along with developers is referred to as wireframe. This is a loyalty plan which
comprises of design of website. For example developers of LAL can draw a basic structure with
respect to what all has to be covered in website and how it must look. This will include an option
for sign up and login when users will visit the site. The site will present them with an option of
either opt for new or used cars along with images, specifications and prices of each. Apart from
this, there must be option where individuals can ask queries with respect to what they are
looking for or any other (Kraak and Brown, 2014). This will assist them to have appropriate
services as per their requirements. Furthermore, an option of comparison will also be provided
where customers can compare the different options provided to them so that they can have best
within their budget, this will make their website good otherwise users have to look for certain
things in different websites.

P10 Utilize design document with suitable standards, guidelines and principles for producing a
multipage website supported with realistic content.
The design document will illustrate the basic business needs as well as what users are
anticipating from the system that is being developed. The document is formulated before systems
is being created and are written by end-users and owner of the system for providing quality
assurance (Larman, 2012). These requirements have to be tested within user acceptance testing.
The certain standards and principles are formulated by developers of LAL for making sure that
system designed by them is apt, they are as:
 Users and members of the team needs to register and must login within the system or
website when they need to look for it. (The reason of this is to ensure that an
authenticated user gets into their system and any kind of unauthenticated activities are
not carried out).
 Users have the option to update their profile along with passwords, the different options
will be provided to them (Yardley and et. al, 2015).
 The user can look for what they need, make out comparison with other options
available, check out the specifications.
 In case of any kind of queries, users can send mail through website only or can make
call to support executives for this.
P11 Compare as well as contrast the multipage website with design document.
The website has been and as it was supposed to providers customers of LAL with
information related with new and used cars, it is obvious that it is a multipage website. The design
document has been developed by taking into consideration all the aspects like one page for login,
other for- new cars, next for- old cars, their specifications, making queries or communicating with
support executives, contact us and a page for making comparison in between different models of
car available (Montgomery, 2017). The document is developed but its implementation is important
as it’s easy to formulate a report rather than building a system. Suppose there is page for
comparison where each specification has to be compared, the programming for this can be
complex and time consuming.

P12 Critical evaluation of design as well as development process with respect to design
document and analyze technical disputes.
The problem with developers is that they are preoccupied with certain amazing features
and adds them within the website and forget the major aspect that is user interface. There do not
exist any problem while implementation but design may become complicated as if website of
LAL takes time to load them users will shift to other website (Reiser and Dempsey, 2012). The
other technical issue is impeccable user experience, if queries of users are not addressed then also
there can be a problem like if a mail is sent by an individual for knowing specific details of a car
but if there is no response then also users may go for others. There must be auto generated mails
which must acknowledge their users.
P13 Creation of appropriate Test Plan identification key performance area as well as utilize it to
evaluate performance and functionality of website.
Test plan must be formulated to ensure that website is working as per anticipation
of developers as well as the owners of LAL. For this the system has to be tested by making use of
unit testing to check each features like within new cars used cars not shown and many others
(Venable, Pries-Heje and Baskerville, 2016). Then regression testing can be carried out for
verifying that it is working as per desired functionalities.
P14 Evaluation of quality assurance (QA) process along with its execution while designing and
development stages.
Quality assurance is also referred to as QA testing which denotes activity that ensures that
firm is rendering best service and products to their customers. Emphasis is on improvisation of
processes for delivering quality products for their customers. For this, developers of LAL can
make use of different testing methods like unit, regression, etc. This will enable them to
acknowledge which section of the website needs to be improvised (Richey and Klein, 2014). The
focus must not be only on the way website looks or works but it should also be on security aspects
so that there do not exist any kind of vulnerabilities which can create a negative impact on overall
functioning of firm and users.
P15 Critical evaluation of outcome of Test Plan and comprise a review of the overall success of
your multipage website.
The test plan formulated will be tested for making sure that there website is working as per

desired standards. For this, any random end user can be asked to sign up within the system and
login into it (Simonsen and Robertson, 2012). Then they can go to different options provided
within the website. Along with working it will also provide them with clarity related accessibility
to the site.
Conclusion
From above it can be concluded, website development is a process which provides
interaction between organizations as well as their probable users. It is important for developers
to ensure which technology and tools are utilized for developing this by keeping into
considerations their negatives & positive. This will lead them to attain their desired objectives as
per formulated standards. Furthermore, the system developed must be tested to ensure that it is
working according to the formulated plan.

References
Books & Journals
Belanche, D., Casaló, L.V. and Guinalíu, M., 2012. Website usability, consumer satisfaction and
the intention to use a website: The moderating effect of perceived risk. Journal of
retailing and consumer services, 19(1), pp.124-132.
Bhamra, T. and Lofthouse, V., 2016. Design for sustainability: a practical approach. Routledge.
Erl, T., 2016. SOA Principles of Service Design (paperback). Prentice Hall Press.
Jolliffe, A., Ritter, J. and Stevens, D., 2012. The online learning handbook: Developing and
using web-based learning. Routledge.
Kraak, J.M. and Brown, A., 2014. Web cartography. CRC Press.
Larman, C., 2012. Applying UML and patterns: an introduction to object oriented analysis and
design and interative development. Pearson Education India.
Montgomery, D.C., 2017. Design and analysis of experiments. John wiley & sons.
Reiser, R.A. and Dempsey, J.V. eds., 2012. Trends and issues in instructional design and
technology. Boston, MA: Pearson.
Richey, R.C. and Klein, J.D., 2014. Design and development research: Methods, strategies, and
issues. Routledge.
Simonsen, J. and Robertson, T. eds., 2012. Routledge international handbook of participatory
design. Routledge.
Venable, J., Pries-Heje, J. and Baskerville, R., 2016. FEDS: a framework for evaluation in design
science research. European journal of information systems, 25(1), pp.77-89.
Yardley, L. and et. al, 2015. The person-based approach to intervention development:
application to digital health-related behavior change interventions. Journal of medical
Internet research, 17(1), p.e30.