Project Title - DBS eSource

Template developed by Dr Shazia A Afzal 0

Word Count: 6000

Final Report

PROJECT TITLE Higher Diploma in Science in Computing

Patrick Mulligan

[email protected]

14/08/2020

Supervisor Rory ODonnell

Higher Diploma in Science in Computing BHD08WCT

1

Contents Contents .................................................................................................................................................. 1

1. Abstract ........................................................................................................................................... 2

2. Project Scope and Objectives .......................................................................................................... 2

3. Student’s Learning Objectives ........................................................................................................ 3

4. Background ..................................................................................................................................... 3

Background Information ................................................................................................................. 4

Page Layout ..................................................................................................................................... 4

Browser Compatibility .................................................................................................................... 5

Navigation ....................................................................................................................................... 5

Color and Graphics .......................................................................................................................... 5

Multimedia ...................................................................................................................................... 5

Content Presentation ...................................................................................................................... 6

Functionality ................................................................................................................................... 6

Accessibility ..................................................................................................................................... 6

5. Specification and Design ................................................................................................................. 8

6. Project Testing and Evaluation ..................................................................................................... 17

7. Conclusion ..................................................................................................................................... 29

8. References / Bibliography ............................................................................................................. 30

2

1. Abstract

For my project I developed a website for a Computer Technical Support company. The main

purpose of the website will be to promote a Tech Support Company and also to gain

experience creating an ecommerce website. The website is also to be used as a

demonstration for potential customers to show what can be achieved for a small

investment.

The website is to be user focused with a simple modern design. From the customers point

of view the website should be viewed as a resource to:

• Purchase Support on demand – Request Remote Support, Request On Site Support

or Request Email Support

• Purchase supplies – Purchase computer equipment, accessories and supplies e.g.

Ink, Toner, computers, monitors etc

• Knowledge – Gain, Share and Research Knowledge on a Blog.

The website will be vendor neutral and offer links to trusted websites for support,

purchasing and product reviews. The website will incorporate a remote support portal, were

users of desktop and server computers can gain easy access to allow a technician to

remotely access the users computer to help resolve technical issues remotely.

The website will also have an ecommerce portal with the ability to customers to purchase

goods and services from various venders.

Acknowledgments

My project supervisor was Mr Rory ODonnell. I had a couple of Zoom meeting with Rory and

he advised me not to reinvent the wheel and to try and do something that would be of

benefit to me in the future.

2. Project Scope and Objectives

The scope of the project are as follows

• Develop a modern User Interface Design with a simple consistent layout to promote

the company brand, generate customers and earn revenue

• The web site is to be secured with Secure Socket Layer Protocol and comply with

General Data Protection Regulations

• Incorporate an option of Remote Access functionality were a user can click on a link

to grant a technician access to their computer for support purposes

• Responsive Web Design that can accommodate different screen sizes, resolutions

and devices like mobile phones, tablets and personal computers

• Basic E - commerce functionality with a shopping cart and payment functionality.

• Explore various ecommerce platform like www.wix.com, www.shopify.com,

www.woocommerce.com

3

• Evaluate www.wordpress.com as a content management system and site builder

tool

3. Student’s Learning Objectives

Plan a complete project from design to deliver, with deliverables at each stage. Enhance my

web developments skills in the area of design and implementation of websites. Develop a

responsive web site using CSS media queries, responsive images and flexible layouts that can

handle different internet browsers, different screen resolutions and sizes with the ability to

work on different devices. Improve my programming language skills in web design with

HTML, CSS, Javascript and learn Typescript. Research and evaluate new tools like

WordPress, Shopify, Wix, Angular, React and Vue to enhance a website design and

functionality. Decide which tool is best to use in which situation.

Learn how to implement an E Commerce website using a ecommerce platform and the

associated payment facilities. Understand what is involved in complying with legal and

government requirements.

4. Background

In today’s business environment most companies need a professional website to be

successful. The website can be either a static website that acts as an online brochure which

is manually updated and unless new content is added will be rarely used. After customers

initially visit the site they will be unlikely to come back to the site and the resource will be

underutilised and a missed opportunity to develop customer relationships and generate

revenue. You can also have a dynamic website that promotes user interaction and can

support and promote a business. A dynamic website can vital to a businesses success by

providing a

• Sales channel – Online Store where goods and services can be purchased,

• Marketing channel – to promote the company and generate new customers,

• Customer Relationship Management – acquire and keep clients, focused client

management,

• Supporting Business Process – accounting, invoicing, job management etc

There are many was to create a website and I explored the following

• Angular Framework – a typescript based complete framework for Single Page

Applications - www.angular.io

• React Framework – a JavaScript based user interface development library –

www.reactjs.org

• Vue Framework – a JavaScript based user interface development framework –

www.vuejs.org

• Microsoft MVC – Asp.net design pattern – dotnet.microsoft.com/apps/aspnet/mvc

Although each of these frameworks provided the ability to create a fast user interface they

did not have all the functionality necessary to create a fully functioning web store easily and

4

the development time required to learn and develop a site similar to what could was created

in web builder solution was prohibitive. I then looked at the following platforms that handle

website creation

• Shopify – popular E-commerce platform - www.shopify.ie

• Wix – very easy too use feature rich platform, ideal for beginners virtually no coding

involved – www.wix.com

• WordPress – open source blogging platform, when combined with WooCommerce

extends to a E-Commerce. www.wordpress.org

I decided to go with a self hosted WordPress site which is open source and reported to

power more than 37% of all websites according to www.wordpress.com. The WordPress

software is used as a website builder was originally designed for creating blogs but has been

expanded to be become a fully featured content management system capable of creating

almost any type of website including E-Commerce sites. It is important to draw a distinction

between Wordpress.com and Wordpress.org

• Wordpress.com which is a service provider that uses WordPress software to allow

customers to create and manage websites, it is ideal for a managed WordPress

experience but has limited options for customisation and it is not possible to use

third party plugins to enhance the functionality, also there is no access to the

underling code.

• WordPress.org which is an open source platform available from www.wordpress.org

which allows you to use the software to create your own self hosted WordPress

experience which can be customised and more easily monetised. You can use third

party plugins to enhance the functionality of the website and also use customized

themes. When WordPress is coupled with the WordPress Plugin WooCommerce it is

possible to create a fully functioning E-Commerce site. You can also access and

modify the backend code to further customize and enhance your website. The

downside is that you have to manage the website yourself which includes security

management, update management and plugin compatibility management.

For website design I plan to keep as much a possible to the principles “Web Design Best

Practices” (Morris, T (2019) Web Design Best Practices. Available form:

https://terrymorris.net/bestpractices/)

Background Information

• URL: • Target Audience: • Purpose:

Page Layout

1. ❏ Appealing to target audience

2. ❏ Consistent site header/logo

3. ❏ Consistent navigation area

4. ❏ Informative page title that includes the company/organization/site name

5. ❏ Page footer area includes copyright, last update, contact e-mail address

5

6. ❏ Good use of basic design principles: repetition, contrast, proximity, and alignment

7. ❏ Balance of text/graphics/white space on page

8. ❏ Good contrast between text and background

9. ❏ Viewport meta tag is used to enhance display on smartphones

10. ❏ Media queries configure responsive page layout for smartphone and tablet display

Browser Compatibility

1. ❏ Displays on popular/current versions of Microsoft Edge

2. ❏ Displays on current versions of Firefox

3. ❏ Displays on current versions of Google Chrome

4. ❏ Displays on current versions of Opera

5. ❏ Displays on current versions of Safari (both Mac and Windows)

6. ❏ Displays on popular/current versions of Internet Explorer

7. ❏ Displays on popular mobile devices (including tablets and smartphones)

Navigation

1. ❏ Main navigation links are clearly and consistently labeled

2. ❏ Navigation is easy to use for target audience

3. ❏ If main navigation uses images, clear text links are in the footer section of the page

4. ❏ If main navigation uses media, clear text links are in the footer section of the page

5. ❏ Navigation is structured in an unordered list

6. ❏ Navigation aids, such as site map, skip navigation link, or breadcrumbs are used

7. ❏ All navigation hyperlinks "work" — are not broken

Color and Graphics

1. ❏ Color scheme is limited to a maximum of three or four colors plus neutrals

2. ❏ Color is used consistently

3. ❏ Text color has sufficient contrast with background color

4. ❏ Color is not used alone to convey meaning

5. ❏ Use of color and graphics enhances rather than distracts from the site

6. ❏ Graphics are optimized and do not significantly slow download

7. ❏ Each graphic used serves a clear purpose

8. ❏ Image tags use the alt attribute to configure an alternate text description

9. ❏ Animated images do not distract from the site and do not endlessly repeat

Multimedia

1. ❏ Each audio/video file used serves a clear purpose

2. ❏ Any animation used enhances rather than distracts

3. ❏ Captions are provided for each audio or video file used

4. ❏ If needed, links to downloads for media plug-ins are provided

6

Content Presentation

1. ❏ Common fonts such as Arial or Times New Roman are used

2. ❏ No more than one web font is used

3. ❏ Techniques of writing for the Web are used: headings, bullet points, brief paragraphs

4. ❏ Fonts, font sizes, and font colors are consistently used

5. ❏ Content provides meaningful, useful information

6. ❏ Content is organized in a consistent manner

7. ❏ Information is easy to find (minimal clicks)

8. ❏ Timeliness: The date of the last revision and/or copyright date is accurate

9. ❏ Content does not include outdated material

10. ❏ Content is free of typographical and grammatical errors

11. ❏ Content provides links to other useful sites

12. ❏ Avoids the use of "Click here" when writing text for hyperlinks

13. ❏ Hyperlinks use a consistent set of colors to indicate visited/nonvisited status

14. ❏ If graphics are used to convey meaning, the alternate text equivalent is provided

15. ❏ If media is used to convey meaning, the alternate text equivalent is provided

Functionality

1. ❏ All internal hyperlinks work

2. ❏ All external hyperlinks work

3. ❏ All forms function as expected

4. ❏ No JavaScript errors are generated

Accessibility

1. ❏ If main navigation uses images or other media, text links are in the footer section of the page

2. ❏ Navigation is structured in an unordered list

3. ❏ Navigation aids, such as site map, skip navigation link, or breadcrumbs are used

4. ❏ Color is not used alone to convey meaning

5. ❏ Text color has sufficient contrast with background color

6. ❏ Img elements use the alt attribute to configure an alternate text description

7. ❏ If graphics are used to convey meaning, the alternate text equivalent is provided

8. ❏ If media is used to convey meaning, the alternate text equivalent is provided

9. ❏ Captions are provided for each audio or video file used

10. ❏ Use attributes designed to improve accessibility such as title when appropriate

11. ❏ Use the id and headers attributes to improve the accessibility of table data

12. ❏ Configure frames with frame titles and place meaningful content in the noframes area

13. ❏ The html element's lang attribute indicates the spoken

The main reason I decided on WordPress rather than Shopify or Wix is that WordPress is an

open source system which gives you full control over the website you create and it is free to use.

Shopify and Wix are proprietary systems and although they allow a lot of user freedom in

7

development, hosting and control, technically you do not own the website and it is possible that you

could be shut down by the host. Shopify and Wix also charge a fee for their service. Although

Shopify and Wix are suitable for creating websites and are easier to use than WordPress they offer

reduced options for customization and no access to the underling code of the site. Also WordPress

is the market leader.

For hosting the website I decided to use GoDaddy (WordPress Hosting |Fast and Secure with

Award-winning Support, viewed 30 June 2020 <https://ie.godaddy.com/hosting/wordpress-

hosting>) as they offered a managed WordPress E-commerce hosting package. The package includes

• Free SSL Certificate for duration of hosting

• 1 Website

• Unlimited Storage

• Unlimited visitors

• Free Business email

• Website Backup protection

• Free Domain

• Automatic Daily malware scans

• SEO ( Search Engine Optimization )

• 1-click testing site

• Unlimited malware and hack repair

• No Transaction Fees

• Unlimited Products

• Bookings and Appointment Scheduling

• Real Time Shipping Rates

• Free Access to Top Premium WooCommerce Extensions

On the 1st of July I registered with www.Godaddy.com for a WordPress managed WordPress

E-commerce hosting package for the data to be stored Europe. I registered the website

WWW.PCRIGHT.NET this attached an Secure Socket Layer (SSL) certificate which is required

by payment processors.

I decided to register a business account with PayPal on www.paypal.com to handle the

receipt of payments for purchases from the website.

For testing the website I set the PayPal into a sandbox with allows dummy transactions to be

processed and created a dummy sandbox user.

For the social media aspect to complement the site I setup the following accounts

• Facebook – https://www.facebook.com/patrick.mulligan.14203

• Instgram – https://www.instagram.com/pcrightsire/

• LinkedIn - www.linkedin.com/in/pat-mulligan-7a52332

• Twitter - https://twitter.com/patmulliganpcr1

8

I needed the data to be hosted in Europe to comply with GDPR (“General Data Protection

Regulations (GDPR) Compliance Guidelines” viewed 1st August 2020 https://gdpr.eu)

5. Specification and Design

Week 1

I researched various Support Web sites to decide on a particular design. By the end of the

week I produced a Design a blueprint for the website. I decided I would WordPress and not

use a framework like Angular or React, or an Model View Control like Microsoft ASP or other

platform like Shopify and Wix.

Too aid in the decision to go with WordPress I randomly picked five technical support

companies by googling “ best tech support website Ireland” from the list I selected

• IT.IE – based on Wordpress

• Pctechsupport.ie - based on Wordpress

9

• Techit.ie – based on Wix

• Remotepcrepair.ie

10

• Everythingit.ie - based on WordPress

By examining the source code of each website I was able to deduce that three of the five

sites were based on WordPress, one was based on Wix and the last one was plan old Html,

CSS and JavaScript. Although this is by no means a conclusive test it bare testimony to often

reported WordPress saying that one third of the hosted web sites are powered by

WordPress. Rather than reinventing the wheel I decide on self hosted WordPress to develop

the website.

I examined the main functionality of the randomly selected websites and complied a table

functionality

www.it.ie www.pctechsupport.ie www.techit.ie www.remotepcrepair.ie www.everythingit.ie

Home ✓ ✓ ✓ ✓ ✓

11

Remote Support ✓ ✓ ✓ ✓ ✓

Sell ✓ ✓

List Services ✓ ✓ ✓ ✓ ✓

Security ✓ ✓ ✓

Support ✓ ✓ ✓ ✓ ✓

Backup ✓ ✓ ✓ ✓

Repair ✓

Blog / News ✓ ✓ ✓

Contact Us ✓ ✓ ✓ ✓ ✓

Testimonials ✓ ✓ ✓

About Us ✓ ✓ ✓ ✓ ✓

Social Media ✓ ✓ ✓

Switch ✓ ✓

Cloud ✓ ✓ ✓

Helpdesk ✓ ✓

Recovery ✓ ✓

FAQ ✓

Compliance ✓

For the projects web site design I wanted the following pages

• Homepage – This is the launch page that links to the other pages.

• Shop – This is were customers can browse the products catalogue and purchase

products and services by adding the items to a shopping basket and then paying for

them via PayPal.

• Contact – A customer can enter a message and it will be emailed to the host for

follow up.

• Support – This page allow a customer to select a link to receive remote support for

Microsoft Windows, Apple Mac, Android devices and Ios devices. This is powered

by Splashtop. SOS Download | Splashtop Inc.( SOS Download | Splashtop Inc, viewed

1st August 2020,https://sos.splashtop.com/sos-download)

• Blog – This page displays a html based blog page, registered customers can

comment on the individual blogs.

For the Remote functionality of the website I researched five remote access provider

providers. What I wanted was to make it a simple as possible for the end user to get secure

remote support and also be cost effective.

Remote Access Website Annual OneTime

Splashtop www.splashtop.com €313.65

FixMe.IT www.techinline.com €300.00

Logmein gotomypc https://get.gotomypc.com €480.00

12

Teamviewer www.teamviewer.com €480.00

RemoteUtilities www.remoteutilities.com €500.00

I decided on Splashtop as offered the features I needed to allow a one click install for the

end user. When the end user selects the support page a remote client is automatically

downloaded to the user computer, when run the remote client generate a nine digit code

for the support technician. If the automatic download does not happen there is an option to

manually download the program, the end user can then run the program manually to

generate the nine digit code.

Splashtop also supported multiple operating systems which is a bonus

• Microsoft Windows

• Apple Mac

• Goggle Android

• Apple IOS

Week 2 – 4

I signed up for WordPress + E-Commerce Mastery: Build Your Own Online Store(Master It,

WordPress + E-Commerce Mastery: Build Your Own Online Store | Udemy, viewed 2nd May

2020,https://www.udemy.com/course/wordpress-e-com-mastery-build-your-own-pod-

business/) This course gave a good overall grounding of WordPress. I installed a version of

WordPress on my local computer and developed the planned website. The local installation

I used was downloaded from https://bitnami.com/stacks . This creates a easy to install local

copy of WordPress.

I also subscribed to Dale McManus YouTube channel and followed his course How to Make a

WordPress Website | 2020 Step-By-Step Guide for Beginners! (2020) How to Make a

WordPress Website | 2020 Step-By-Step Guide for Beginners! Available at

https://www.youtube.com/watch?v=hfglk7JsalM&t=13s (Accessed May 2020). This course

showed how to use the WordPress Plugin Elementor, which is an advanced WordPress drag

and drop editor the can be used instead of the built in block editor. The course also showed

how to change the website theme and modify colours fonts and design. A WordPress theme

is a collection of tools and widgets that provide the following:

• Overall design and style of your website

• Widgets that can be used to add features and functions for the website such as

menus, social media etc

• Font families and styling

• Colour selection and styling

• Page layouts, number of columns

There are thousands of themes to choose from both free and paid for themes. As the theme

decides the overall look and feel to the website it is important to choose one that has the

features you need but it is also real easy to change the theme if it does not suit your needs. I

choose to use the Astra theme which gave a layout that suited my website design. It is fast

13

and light weight and suited to E-Commerce store front and blogging. It has over a million

active installations Astra – WordPress Theme | WordPress.org, viewed 13th August

2020,<https://wordpress.org/themes/Astra>

To comply with GDPR regulations I added a “Privacy Policy”, a “GDPR Policy” and a “Terms

and Conditions Policy” this is also a requirement of WooCommerce for Payment processing.

To generate the Policy pages I used a WordPress plugin called “WP AutoTerms” it was free

to use the plugin generate the “Privacy Policy” and “Terms and Conditions Policy” but not

the “GDPR Policy”. I set the legal pages to be in the Footer of all the web pages. To

generate the text for the “GDPR Policy” I used the website

https://www.gdprprivacypolicy.net/ it automatically generates policy test when you enter

the following text

• Company Name

• Website Name

• Website URL

Figure 1 - Legal Pages

For Product to sell on the website I created a number of services and add products to the

site manually.

• Remote Support – this is a service a customer could purchase for an hourly rate. The

customer would then be directed to a support page to allowed remote access to

their computer to resolve their issue

• Onsite Support – A customer could purchase this service and book a calendar day so

that a engineer could be sent to the customers site for support.

• Contract – A customer could purchase Support Contract to suit their needs.

• I approached a European Electronics Store LambdaTek available at

<https://www.lambda-tek.eu/marketplaces/marketplaces.pl> to see if it was

possible to sell their products through my www.pcright.com web store. I am still

awaiting their response.

14

• Manually added a couple of computer products to the site to make them available

for sale. This is not practical method of adding a large number of products on an

ongoing basis as I would not be in control of stock level or pricing changes and it is

too time consuming. Direct shipping of purchased products to customers site is a

function of most suppliers but the logistics of handling stock that was returned is a

difficulty.

Setting up the WordPress was straight forward. After I signed up for the GoDaddy account

WordPress was installed on the site. I then ran updates to make sure I had the latest

version. The next step was to install the following plugins

• WP AutoTerms – Used to create legal pages

• WooCommerce – E-Commerce platform for creating and managing orders, shopping

baskets, inventory management, shipping management, payment management.

• Elementor – An advanced editor for creating and updating web pages

• Essential Addons – An elements library for Elementor

• WPForms – Used to create the contact form and customer subscription form

• WP File Manager – used to browse the WordPress directory on the GoDaddy web

site

WordPress is a php based website builder and content management system. As part of the

installation WordPress need an “MySQL” database setup here are the details of my setup

The next step was to add the Astra Theme. This populates the website with place holder

data so that you can see how the web page will look.

In order to add the uniform resource locater ( URL ) for the domain name PCRIGHT.NET I had

to modify Domain Name Service records (DNS). PCRight.net is a Google Suite domain to set

it up with GoDaddy I needed to prove domain ownership by adding a TXT record to the DNS

Records of PCRight.net once that was verified I had to add a “A” record for PCRight.net to

point to GoDaddy IP address 160.153.137.163

The resulting DNS Record looks like this

15

There was a clash with the DNS between Google and GoDaddy which resulted in the website

not appearing intermittently. I contacted GoDaddy support but they could not resolve the

issue. The problem was caused by multiple “A” records on the Google DNS this is fine for

Google but not allowed for GoDaddy, I had to delete all DNS “A” records except for the one

for GoDaddy to resolve the problem.

I designed a logo for the website on www.logomakr.com I also designed a

favicon which displays in the title of the webpage.

Next stage was to load content onto the individual pages. I created a couple of sample blog

entries to be used on the “Blog” page, these are entered in as HTML posts.

For the pictures on the home page I used personal images and images from royalty free web

sites. I have compiled a list of sites that offer royalty free images that can be used for

commercial purposes

• Pixabay – https://pixabay.com

• Unsplash – https://unsplash.com

• Pexels – https://pexels.com

• Canva – https://canva.com

I scripted the home page and replaced all the placeholder data. As the homepage has a lot

images and the larger an image is the longer it takes to load in a web browser, I optimised

the image size using GNU Image Manipulation Program (Gimp) available at www.gimp.org

To create the user “Subscribe Form” and I user “Simple Contact Form” I used WordPress

plugin “WPForms” the approach was to keep it as simple as possible with the minimum

amount of user data to be collected.

To setup the “Shop” page I needed to configure the “WordPress WooCommerce” plugin.

This needed to be populated with data relevant to the store

• Seller address

• Where to you want to sell and ship to, I select to only sell to Ireland

16

• Currency setting

• Product measurement – metric or imperial

• Tax settings and tax rates

• Shipping settings

• Payment settings – I decided to setup PayPal as this can receive payment from

user with a PayPal account or users with any major credit card

• The Accounts tab configures order creations and data privacy for users

• The emails tab show the flow of email after certain actions

The integration tab show the MySQL data path

The Advanced tab show the of where users are sent depending on which option they

take

17

The rest of the WordPress setup was down to creating and configuring menus,

headers, Footers and design options like layout colours and fonts.

6. Project Testing and Evaluation

Here are some screen shots from the website

Figure 2HomePage

18

19

This is the home page which launches all other pages. From the menu at the top you can

choose “Shop”, “Contact” “Blog” “Support” or “My-Account” selecting these links bring you

to the relevant pages also selecting the Logo brings you back to the homepage. A little

further down the page is a “Get Started” button which brings the customer down to a part

of the homepage to were they can select the type of service they want to purchase. Below

the “Get Started” button there is a “What are you interested in?” section that lets the

customer choose the individual pages “Shop”, “Contact” “Blog” “Support” these are large

links that make the navigation of the website easy on mobile devices as the top menu is

compress on mobile devices making it easy to miss. Below the “What are you interested in?”

is a profile section with my image, a message and icons linking to social media profiles

Facebook, Twitter, Instgram and linkedin. Below this is the “About Us” Section. Below the

“About Us” is the Blog section. Below the blog section is the customer testimonial section

with links to their websites. Then you have the social media section with icons and links to

Instgram, Facebook and Twitter. Below the social media section you have the choice of

service section which links to the “Let’s Chat” section were a customer can send a message

or request a service. At the bottom of the all the web site pages you have the copyright

symbol, the company address and the company email address. Below this you have the

“GDPR Policy”, “Privacy Policy” and “Terms and Conditions”.

Figure 3 Shop Page

20

This is the shop front page and it allows a customers to browse the inventory catalogue, add items to

shopping basket and purchase the items from the shopping basket. When the customer selects the

product they get an expanded view of the item with product information and images. From the

“My-Cart” or basket view the customer can “Proceed to checkout” to complete the purchase the

items

Figure 4 My Cart

In the “Proceed to checkout” page the customer can pay for the item using PayPal which accepts

PayPal accounts and all major Credit Cards as payment. The customer must fill in the “Billing

Details” that has required fields such as address, phone number etc and they must agree to “Terms

and Conditions” before they can pay for a product.

21

Figure 5 - Checkout

When an order is processed and paid for a confirming email is sent to the customer and to the host.

The items can then be processed for delivery once payment has been cleared.

Figure

Figure 6 - Contact Page

The contact page allows a customer to post a message which is then forwarded to host by email for

further action. Minimal information is required from the customer to generate this message all they

22

need to input is an email address and type a message then select “Contact Us”. When the message is

sent the customer get a confirming message is displayed on screen

Figure 7 - Support Page

The “Support” page is key goal of the website. It allows the customer to click on the link “Select this

link for remote support” or click on the Splashtop picture. This will redirect the customer to the

website SOS Download | Splashtop Inc.( SOS Download | Splashtop Inc, viewed 1st August

2020,https://sos.splashtop.com/sos-download).

From this website a small program is downloaded and run which generates a nine digit code that the

customer gives to the support technician. The support technician enters the nine digit code into a

Splashtop Business console the splashtop software then creates a secure encrypted link between the

customers computer and the technicians Splashtop Business Console. Once the link is established

the technician can then remotely access the customers device and try to fix the issue for the

customer.

23

Figure 8 - Blog Page

The blog page is were the customer can view blog entries created by host. If the customer is

registered with the host they can leave a comment on the individual blogs, comments will not be

displayed until the host has reviewed approved them. This encourages customers to register with

the host and to interact with the site. The quality of the information in the blog and the frequency

that it is updated will be a major factor in deciding if the customers returns to blog site. When a

comment is added an email is sent to the host for approval. The purpose of the blog on this website

is to provide technical knowledge and tips but it could be used to disseminate any information such

as marketing information or special offers.

24

Figure 9- Blog Leave a comment

Below the Blog page are customer testimonials. These link to the customers web sites.

Figure 10- My Account

The “My-Account” page is were customer registers for the website and were returning customers

login. Registration is as simple as entering a valid email address. An email with the customers

password is then automatically sent to the provided email address.

25

The website is still very much a work in progress and needs a lot more quality content and products

to sell. It also needs relevant social media content uploaded that will support the website by bringing

new customers and encouraging existing customers to return to the site but the basic functionality is

fully operational. It is possible to upload products for sale, register a user account, add a product to

a shopping cart, purchase and pay for products, create a blog post and allow a registered customer

to comment on a blog post. A customer can also create a contact post message.

Testing

For testing the website I setup a test environment using a combination of Virtual Machines using

“Oracle VM VirtualBox Manger” and actual devices.

Devices Tested

• Android Phone – Android version 10 – Model OnePlus 8

Browser Google Chrome

• Android Phone – Andriod Veraion 8 – Model Elephone U Pro

Browser Google Chrome

• Microsoft Windows 10 – Acer Laptop -

Browser Google Chrome Version 84.0.4147.125 (Official Build) (64-bit)

Browser Mozilla Firefox Version 79.0 (64 bit)

Browser Microsoft Edge Version 84.0.522.59 (Official build) (64-bit)

Browser Opera Version 70 • Virtual Machine – Linux Mint Version 19.1

Browser Mozilla Firefox Version 79.0 (64 bit)

• HP Android Tablet running Android 4.1.2

chrome browser

Browser Firefox version 68.11.0

Tests Performed

• All links on home page working

• Social Media links working

• Responsive Web Design working -

Making sure that the website display resized correctly on different screen sizes, different

windows sizes and devices

• Make sure the “Shop” Page opened and it was possible to add an item to the “Shopping

Basket”

From the Shopping basket it was possible to “Proceed to Checkout”

• Make sure the “Support” page opened and the link redirected to the “Splashtop” page

and the device is detected correctly and the correct download provided.

On a Android device the Splashtop Android Download was offered

On a Windows device the Splashtop Windows Download was offered

• Make sure the “Blog” page opened and was navigable

• Make sure the “Contact” page opened and it was possible to send a message

• Make sure the “My-Account” page opened

That a user could register

That an already registered user could sign in and sign out

• Make sure the SSL link was on for browsing and purchasing pages

26

Test Results

Android Phones

Testing on the Android Phone showed the web site resized correct and was functional. The

menu at the top of the page collapsed into a button that needed to be pressed to display the

a drop down menu. The rest of the elements on the page resized under each other. The site

was fully functional on both Android Phones.

• All links were operational

• Social links worked

• Responsive Web Design worked – screen resized, top menu collapsed into drop down menu

Rotating the phone resized the display.

• All pages “Support” “Shop” “Blog” “Contact” “My-Account” opened and functioned as

expected.

• When the support page redirected to Splashtop it displayed instructions to install the

“Splashtop On-Demand Support” app correctly as per the second screen shot below.

• SSL lock appeared at the top of page.

Here are some of the screenshots of the phone display the various pages of the website.

27

28

Test Results Windows 10

I tested the website at in the three different browsers at full screen, half screen and

minimum sized window. The website functioned correctly, resized the display to match the

windows size. At the minimum windows size the displayed output was similar to the output

from the phone. There were no unexpected results or errors displayed.

29

Test Results Linux Mint

The website worked correctly except for one page. The support page when redirected to the

Splashtop website prompted to download the Windows Exe. This would not be executable

on the Linux machine and this solution could provide remote support for a Linux device.

This is more a limitation on Splashtop than the website.

HP Android Tablet Results

This is a very old device and would not display the website in the google chrome browser. I

installed Mozilla Firefox on the tablet and this displayed the website correctly but the

performance was slow this would be caused the a combination of the speed of the device

and the quantity of images on the homepage.

7. Conclusion

At the end of the project I have experienced the implementation of a full stack web

deployment. From the design, to the platform choice, to the implementation stage. This has

been an opportunity to bring together the skills that I have learned on this course and

demonstrate them in a practical way.

Using WordPress hides most of the underlining code of the website from the user. It is

possible to develop a professional looking fully functional website without writing any code

at all. Although using WordPress selfhost does allow you to access the code and make

changes if required. One of the problems with this is that you may loose your modifications

when the next updates are applied to your site. Having a background knowledge of the code

(html, php, css,SQL) required to create a website such as the one created by WordPress

allows you to that advantage of WordPress to optimise the website.

In the current environment there is an opportunity to develop websites and ecommerce

websites for business of all sizes. In the resent past most small to medium sized businesses

that had a web presence used it as a static brochure. The current pandemic environment

increased the importance for the ability of a company to be able to sell their goods and

services online. This has become crucial to most business for their very survival and has been

a high growth area for web development businesses. Also due to the pandemic working

from home has become a growth area and the need for customers to have laptop computers

for working from home and the ability for secure remote support in order to setup these

computers has grown.

The skills I have demonstrated in this project are in high demand. I want to be able to

approach a small to medium sized companies and develop for them an online presence and

web store from scratch in a secure and professional manner. I also want to direct my

current customers to the website to simplify the provision of remote support and also

possible generate some sales from the site.

30

8. References / Bibliography

Felke-Morris, T. (2019). Web Development & Design Foundations. 9th Edition. New York:

Pearson.

Niederst Robbins, J. (2018) Learning Web Design. 5th Edition. Canada: O’Reilly.

Rao Chivukula, S. Iskandar, A (2019). Web Development with Angular and BootStrap. 3Rd

Edition. Mumbai: Packt

Ballard, G (2017). The Definitive Guide to Shopify Themes (Master the Design Skills to Build

World-Class Ecommerce Sites). Australia:Apress

Król, K (2019). WordPress 5 Complete. 7th Edition. Mumbai: Packt

Udemy. (2020). Master Angular 7 (formerly Angular 2): The Complete Course | Udemy

Available from: http://udemy.com/course/the-complete-guide-to-angular-2/

Udemy. (2020). WordPress + E-Commerce Mastery: Build Your Own Online Store | Udemy

Available from: https://www.udemy.com/course/wordpress-e-com-mastery-build-your-

own-pod-business/

Appendices

GDPR Policy

Privacy Policy for Mulligan I.T. Services

At PC Right, accessible from https://www.pcright.net, one of our main priorities is the

privacy of our visitors. This Privacy Policy document contains types of information that is

collected and recorded by PC Right and how we use it.

If you have additional questions or require more information about our Privacy Policy, do

not hesitate to contact us.

General Data Protection Regulation (GDPR)

We are a Data Controller of your information.

Mulligan I.T. Services legal basis for collecting and using the personal information described

in this Privacy Policy depends on the Personal Information we collect and the specific

context in which we collect the information:

Mulligan I.T. Services needs to perform a contract with you

31

You have given Mulligan I.T. Services permission to do so

Processing your personal information is in Mulligan I.T. Services legitimate interests

Mulligan I.T. Services needs to comply with the law

Mulligan I.T. Services will retain your personal information only for as long as is necessary for

the purposes set out in this Privacy Policy. We will retain and use your information to the

extent necessary to comply with our legal obligations, resolve disputes, and enforce our

policies.

If you are a resident of the European Economic Area (EEA), you have certain data protection

rights. If you wish to be informed what Personal Information we hold about you and if you

want it to be removed from our systems, please contact us. Our Privacy Policy was

generated with the help of “https://www.gdprprivacypolicy.net/” GDPR Privacy Policy

Generator and the “https://www.app-privacy-policy.com/app-privacy-policy-generator/

App Privacy Policy Generator

In certain circumstances, you have the following data protection rights:

The right to access, update or to delete the information we have on you.

The right of rectification.

The right to object.

The right of restriction.

The right to data portability

The right to withdraw consent

Log Files

PC Right follows a standard procedure of using log files. These files log visitors when they

visit websites. All hosting companies do this and a part of hosting services’ analytics. The

information collected by log files include internet protocol (IP) addresses, browser type,

Internet Service Provider (ISP), date and time stamp, referring/exit pages, and possibly the

number of clicks. These are not linked to any information that is personally identifiable. The

purpose of the information is for analyzing trends, administering the site, tracking users’

movement on the website, and gathering demographic information.

32

Privacy Policies

You may consult this list to find the Privacy Policy for each of the advertising partners of PC

Right.

Third-party ad servers or ad networks uses technologies like cookies, JavaScript, or Web

Beacons that are used in their respective advertisements and links that appear on PC Right,

which are sent directly to users’ browser. They automatically receive your IP address when

this occurs. These technologies are used to measure the effectiveness of their advertising

campaigns and/or to personalize the advertising content that you see on websites that you

visit.

Note that PC Right has no access to or control over these cookies that are used by third-

party advertisers.

Third Party Privacy Policies

PC Right’s Privacy Policy does not apply to other advertisers or websites. Thus, we are

advising you to consult the respective Privacy Policies of these third-party ad servers for

more detailed information. It may include their practices and instructions about how to opt-

out of certain options.

You can choose to disable cookies through your individual browser options. To know more

detailed information about cookie management with specific web browsers, it can be found

at the browsers’ respective websites.

Children’s Information

Another part of our priority is adding protection for children while using the internet. We

encourage parents and guardians to observe, participate in, and/or monitor and guide their

online activity.

PC Right does not knowingly collect any Personal Identifiable Information from children

under the age of 13. If you think that your child provided this kind of information on our

website, we strongly encourage you to contact us immediately and we will do our best

efforts to promptly remove such information from our records.

Online Privacy Policy Only

33

Our Privacy Policy created at GDPRPrivacyPolicy.net) applies only to our online activities and

is valid for visitors to our website with regards to the information that they shared and/or

collect in PC Right. This policy is not applicable to any information collected offline or via

channels other than this website. “https://gdprprivacypolicy.net” Our GDPR Privacy Policy

was generated from the GDPR Privacy Policy Generator.

Consent

By using our website, you hereby consent to our Privacy Policy and agree to its terms.

Privacy Policy

Last updated: July 2, 2020

Mulligan IT Services (“us”, “we”, or “our”) operates the PC Right - Technical Support and Store

website (the “Service”).

This page informs you of our policies regarding the collection, use and disclosure of Personal

Information when you use our Service.

We will not use or share your information with anyone except as described in this Privacy Policy.

We use your Personal Information for providing and improving the Service. By using the Service, you

agree to the collection and use of information in accordance with this policy. Unless otherwise

defined in this Privacy Policy, terms used in this Privacy Policy have the same meanings as in our

Terms and Conditions, accessible at https://www.pcright.net

Information Collection And Use

While using our Service, we may ask you to provide us with certain personally identifiable

information that can be used to contact or identify you. Personally identifiable information

(“Personal Information”) may include, but is not limited to:

Name

Email address

Telephone number

Address

34

Log Data

We collect information that your browser sends whenever you visit our Service (“Log Data”). This

Log Data may include information such as your computer’s Internet Protocol (“IP”) address, browser

type, browser version, the pages of our Service that you visit, the time and date of your visit, the

time spent on those pages and other statistics.

Cookies

Cookies are files with small amount of data, which may include an anonymous unique identifier.

Cookies are sent to your browser from a web site and stored on your computer’s hard drive.

We use “cookies” to collect information. You can instruct your browser to refuse all cookies or to

indicate when a cookie is being sent. However, if you do not accept cookies, you may not be able to

use some portions of our Service.

Service Providers

We may employ third party companies and individuals to facilitate our Service, to provide the

Service on our behalf, to perform Service-related services or to assist us in analyzing how our Service

is used.

These third parties have access to your Personal Information only to perform these tasks on our

behalf and are obligated not to disclose or use it for any other purpose.

Security

The security of your Personal Information is important to us, but remember that no method of

transmission over the Internet, or method of electronic storage is 100% secure. While we strive to

use commercially acceptable means to protect your Personal Information, we cannot guarantee its

absolute security.

Links To Other Sites

Our Service may contain links to other sites that are not operated by us. If you click on a third party

link, you will be directed to that third party’s site. We strongly advise you to review the Privacy

Policy of every site you visit.

35

We have no control over, and assume no responsibility for the content, privacy policies or practices

of any third party sites or services.

Children’s Privacy

Our Service does not address anyone under the age of 18 (“Children”).

We do not knowingly collect personally identifiable information from children under 18. If you are a

parent or guardian and you are aware that your child has provided us with Personal Information,

please contact us. If we discover that a child under 18 has provided us with Personal Information, we

will delete such information from our servers immediately.

Compliance With Laws

We will disclose your Personal Information where required to do so by law or subpoena.

Changes To This Privacy Policy

We may update our Privacy Policy from time to time. We will notify you of any changes by posting

the new Privacy Policy on this page.

You are advised to review this Privacy Policy periodically for any changes. Changes to this Privacy

Policy are effective when they are posted on this page.

Contact Us

If you have any questions about this Privacy Policy, please contact us.

Terms and Conditions

Last updated: July 2, 2020

Please read these Terms of Use (“Terms”, “Terms of Use”) carefully before using the

https://www.pcright.net website (the “Service”) operated by Mulligan IT Services (“us”, “we”, or

“our”).

Your access to and use of the Service is conditioned on your acceptance of and compliance with

these Terms. These Terms apply to all visitors, users and others who access or use the Service.

36

By accessing or using the Service you agree to be bound by these Terms. If you disagree with any

part of the terms then you may not access the Service.

Accounts

When you create an account with us, you must provide us information that is accurate, complete,

and current at all times. Failure to do so constitutes a breach of the Terms, which may result in

immediate termination of your account on our Service.

You are responsible for safeguarding the password that you use to access the Service and for any

activities or actions under your password, whether your password is with our Service or a third-party

service.

You agree not to disclose your password to any third party. You must notify us immediately upon

becoming aware of any breach of security or unauthorized use of your account.

Intellectual Property

The Service and its original content, features and functionality are and will remain the exclusive

property of Mulligan IT Services and its licensors.

Links To Other Web Sites

Our Service may contain links to third-party web sites or services that are not owned or controlled

by Mulligan IT Services.

Mulligan IT Services has no control over, and assumes no responsibility for, the content, privacy

policies, or practices of any third party web sites or services. You further acknowledge and agree

that Mulligan IT Services shall not be responsible or liable, directly or indirectly, for any damage or

loss caused or alleged to be caused by or in connection with use of or reliance on any such content,

goods or services available on or through any such web sites or services.

We strongly advise you to read the terms and conditions and privacy policies of any third-party web

sites or services that you visit.

Termination

We may terminate or suspend access to our Service immediately, without prior notice or liability, for

any reason whatsoever, including without limitation if you breach the Terms.

37

All provisions of the Terms which by their nature should survive termination shall survive

termination, including, without limitation, ownership provisions, warranty disclaimers, indemnity

and limitations of liability.

We may terminate or suspend your account immediately, without prior notice or liability, for any

reason whatsoever, including without limitation if you breach the Terms.

Upon termination, your right to use the Service will immediately cease. If you wish to terminate your

account, you may simply discontinue using the Service.

All provisions of the Terms which by their nature should survive termination shall survive

termination, including, without limitation, ownership provisions, warranty disclaimers, indemnity

and limitations of liability.

Disclaimer

Your use of the Service is at your sole risk. The Service is provided on an “AS IS” and “AS AVAILABLE”

basis. The Service is provided without warranties of any kind, whether express or implied, including,

but not limited to, implied warranties of merchantability, fitness for a particular purpose, non-

infringement or course of performance.

Governing Law

These Terms shall be governed and construed in accordance with the laws of Ireland without regard

to its conflict of law provisions.

Our failure to enforce any right or provision of these Terms will not be considered a waiver of those

rights. If any provision of these Terms is held to be invalid or unenforceable by a court, the

remaining provisions of these Terms will remain in effect. These Terms constitute the entire

agreement between us regarding our Service, and supersede and replace any prior agreements we

might have between us regarding the Service.

Changes

We reserve the right, at our sole discretion, to modify or replace these Terms at any time. If a

revision is material we will try to provide at least 30 days notice prior to any new terms taking effect.

What constitutes a material change will be determined at our sole discretion.

38

By continuing to access or use our Service after those revisions become effective, you agree to be

bound by the revised terms. If you do not agree to the new terms, please stop using the Service.

Contact Us