final report draft jeff

8/4/2019 Final Report Draft Jeff

1/28

3111 34th

Avenue N.W.

Calgary, AB T2L 0Y2

Phone: (403) 998-9976

Fax: (403) 998-9977

E-Mail:[email protected]

August 15, 2011

Valerie Pek

Manager of Marketing and Corporate Partnerships

Calgary Stampeder Football ClubMcMahon Stadium

1817 Crowchild Trail NW

Calgary, AB T2M 4R6

Dear Valerie Pek:

Enclosed is the Calgary Stampeders website assessment that you requested for August 18, 2011.

This report provides the explanation, research, and recommendations of the six essential aspects

of web design applied to the Calgary Stampeders website. If you have any questions or concernsthe experts at Spyder Web Design would be happy to set up an appointment with you at your

convenience to further discuss this assessment.

Thank you for allowing our team to have the opportunity to present this report. We hope thatyour requirements and expectations have been met and exceeded.

Regards,

B.SedorBrittany SedorSpyder Web Design Manager

[email protected]

Enclosed: Calgary Stampeders Website AssessmentFinal Report
mailto:[email protected]:[email protected]:[email protected]:[email protected]:[email protected]:[email protected]:[email protected]


2/28

2

Calgary Stampeders Website Assessment

Final Report, 2011

Prepared by: Thomas Lam

Mitchell CarnevaleBrittany Sedor

Kaila StepanicJae Van Klei

Jeff Yip

Prepared for

The Calgary Stampeders Marketing Committee


3/28

3

Abstract

This report examines the effectiveness and overall impression of the Calgary Stampeders

website in accordance with the six essential aspects of web design. The purpose of this report isto assess the website in order to help improve fan access, increase security, and more effectively

connect the Calgary Stampeders to the community. The report evaluates the following sixcomponents: (1) website aesthetics (2) organization of information (3) technical issues of webdesign (4) website security (5) special needs accessibility (6) mobile access technical issues. Our

recommendations for improvement are (1) optimize multimedia formats and compatibility

including videos, images, and links (2) ensure appropriate access to information including closedcaptioning, embedded links and secure connections.


4/28

4

Table of Contents

Abstract ........................................................................................................................................... 3List of Figures ................................................................................................................................. 6Executive Summary ........................................................................................................................ 71.0 Introduction ............................................................................................................................... 92.0 Aesthetics .................................................................................................................................. 9

2.1 Typography ........................................................................................................................... 92.2 Layout.................................................................................................................................. 102.3 Color .................................................................................................................................... 11

3.0 Organization of Information ................................................................................................... 113.1 Ease of Access to Information ............................................................................................ 12

3.1.1 External Access ............................................................................................................ 123.1.2 Internal Access ............................................................................................................. 13

3.2 Visual Organization............................................................................................................. 143.2.1 Embedded Links ........................................................................................................... 143.2.2 Visual Data Structures .................................................................................................. 14

4.0 Technical Issues of Web Design ............................................................................................. 164.1 Web Browsers ..................................................................................................................... 164.2 Screen Resolution ................................................................................................................ 174.3 Download Speed ................................................................................................................. 17

5.0 Website Security ..................................................................................................................... 18

5.1 Key Aspects of Website Security ........................................................................................ 185.2Ticketmaster Security ........................................................................................................... 18

5.2.1 CAPTCHA.................................................................................................................... 185.2.2 Encryption .................................................................................................................... 195.2.3 Multiple Methods of Secure Payment .......................................................................... 195.2.4 Firewalls ....................................................................................................................... 195.2.5 Effectiveness of Ticketmasters Security ..................................................................... 19

5.3 Online Store Security .......................................................................................................... 206.0 Accessibility for Special Needs Users .................................................................................... 20

6.1 Reason for Web Accessibility Assessment ......................................................................... 206.2 Identify Problems ................................................................................................................ 216.3 Problems & Suggestions ..................................................................................................... 21

6.3.1 Closed Captioning & Text Transcript .......................................................................... 21


5/28

5

6.3.2 Text Instruction of Navigation Control ........................................................................ 226.3.3 Alternative Text Message with Photo .......................................................................... 226.3.4 Alternative Text Message with Image .......................................................................... 22

7.0 Technical Issues Related to Mobile Devices .......................................................................... 227.1 Operating Systems............................................................................................................... 227.2 Adobe Flash......................................................................................................................... 237.3 Mobile Webpages ................................................................................................................ 237.4 Mobile Applications ............................................................................................................ 247.5 Key Technical Issues ........................................................................................................... 257.5.1 Content ............................................................................................................................. 25

7.5.2 Compatibility ................................................................................................................ 258.0 Conclusion and Recommendations ..........................................Error! Bookmark not defined.References ..................................................................................................................................... 27


6/28

6

List of Figures

Figure 2.1: Text size changes and contrast...10

Figure 2.2: Layout division and moving graphics.10

Figure 2.3: BC Lions vs Calgary Stampeders homepage colors...11

Figure 3.1: Calgary Stampeders Google search results........13

Figure 3.2: Comparison of internal search results13

Figure 3.3: Comparison of player articles....14

Figure 3.4: Comparison between Stampeders.com and Riderville.com..15

Figure 4.1: Survey results for popular browser usage.16

Figure 4.2: Screen resolution trends....17

Figure 5.1: Screen capture of the Ticketmaster address..19

Figure 5.2: Screen capture of the checkout page20

Figure 7.1 Screen capture of mobile devices..23

Figure 7.2 Compatibility chart24

Figure 7.3 Screen capture of mobile application.25


7/28

7

Executive Summary

This report examines the effectiveness and overall impression of the Calgary Stampeders

website in accordance with six essential aspects of web design. We have considered the

requirements of your organization and your website, basing our results off of these requirements.

The purpose of this report is to provide the Calgary Stampeders organization with the

information necessary to assess the website and consider the improvements that we haverecommended.

Recognizing your organization as both a professional sports team and a profitable business, we

have identified the Stampeders needs to attract fans and make profit through ticket and

merchandise sales. We have also identified your organizations need for a website that iscompetitive with rival CFL teams like the Saskatchewan Roughriders.

As a result, our assessment focused on making your website an effective tool for communicating

news and updates to your clients, the fans of the Stampeders and for selling tickets andmerchandise with both ease and security.

The first component of the Stampeders website we assessed was its aesthetic appearance,considering its typography, layout and use of color. Inconsistencies with font size and colour

scheme were identified as key issues, along with the effect of graphics in drawing attention awayfrom key aspects of your website. It was determined that font sizes need to reflect consistency

across all pages of your website. Also, graphics should be small and meaningful, with stationary

advertisements to avoid user distraction. Finally, the colour scheme should be changed to bettermatch the colors of the Calgary Stampeders.

Considering its organization of information, Google search results for your websites informationare clear and prioritized. Also, your sites use of a Google powered search tool provides userswith prioritized results and easy access to specific pages. As well, articles should use embedded

links within text to improve reader access to related stories or background information. Finally,

unlike the majority of sports team websites, your main menu is positioned on the left side of itshomepage, stacking its main links vertically. Orienting this menu horizontally near the top of the

homepage will make it more user-friendly and less confusing to navigate.

The security of your website was analyzed, looking at encryption, the use of CAPTCHA to

separate human users from computers, multiple methods of secure payment and the use of

firewalls. It was determined that an encrypted connection should be added to your online store to

improve the security of your website and protect the information of your clients. This can beachieved by purchasing an online encryption certificate for your website. Also, the addition of a

few more secure methods of payment would provide your clients with more options to buy team

merchandise.

Your website was also analyzed for technical issues including web browser compatibility,

optimization of screen resolution and download speed. It was determined that the only area with


8/28

8

room for improvement is download speed. Also, your website could be modified to have fewer

images and objects or make the current images and objects smaller in file size.

Your website was assessed for its accessibility and several conclusions were drawn. First, for

multimedia pages, closed captioning features or text transcripts should be added into the video

and audio browser. Also, text instruction should be linked up to all the control buttons on thenavigation bar. As well, on the store pages, color description should be included in the

merchandise description. Finally, on the team pages, team description should be provided as analternative of the team logo.

Finally, we have evaluated the effectiveness of the websites mobile platform, and haveidentified key issues with the availability of content and overall compatibility of the site. First,

the website needs to be modified to allow the user to fully access all the websites content on the

go, such as ticket sales and video pages, which were completely unavailable to mobile users.

Also, the compatibility of the website should be enhanced by using mobile applications and morewidely compatible multimedia formats.

Overall, a major recurring issue throughout your site involved the level of accessibility of

information and who could access it. More specifically, we found that it was difficult for users to

access exactly what they were looking for, as your websites organization of content and

accommodation of user needs was limited and ineffective. Conversely, personal and private

information gathered by your websites store lacks appropriate security and therefore is tooeasily accessible.

The other significant and common issue identified throughout the aspects of your website design

concerns the compatibility of its multimedia formats. Specifically, your website offers limited

content consistency between its PC and mobile versions, evident within the Stampeders Store,

ticket sales and video pages.


9/28

9

1.0 Introduction

The Calgary Stampeders are a local football team in the Canadian football league. Every game

thousands of fans flock to McMahon stadium and gather around home televisions to watch the

team play against some of their rivals such as the BC Lions, the Edmonton Eskimos, and their

greatest rival, the Saskatchewan Rough Riders. Accomplishments such as the 2008 Grey Cupwin over the Montreal Alouettes persuade fans to visit your website where they can purchase

tickets, merchandise, and keep updated on games as well as other news.

The purpose of this report is to assess the Calgary Stampeders website to help improve the

effectiveness and communications between the team and their fans. The assessment will assist inmaking the Stampeders website into a more effective tool for communicating important news

about the team to your fans and increase profits made from merchandise and ticket sales.

Your website was assessed using the six basic components of web design. These componentsconsist of the aesthetic appearance, organization of information, technical issues of web design,

website security, website accessibility, and technical issues relates to mobile devices. Usingthese components we compared your website to that of some of your main competitors.

2.0 Aesthetics

Aesthetics is defined as a particular taste for or approach to what is pleasing to the senses and

especially sight according to the MerriamWebster dictionary (Merriam-Webster, 2011).

Appearance of a website can greatly alter how the website is perceived. It is important to have

an aesthetically pleasing appearance to convey the proper image of the Calgary Stampeders andto encourage fans to revisit the site.

This section examines the three main aspects of website aesthetics used to assess the CalgaryStampeders website. These aspects include typography, layout, and color.

2.1 Typography

Typography refers to the use of text. According to George Prociuk (2010) font size, color, and

style should be kept consistent across all pages. In order for text content to be visually appealing

it should be surrounded by plenty of background in order to stand out. However, text should notcontrol the page but be harmonized with the page. Text should contrast with the background and

be easily visible.

As shown in figure 2.1 the text changes font size many times and appears unbalanced because ofthe use of capital letters. The use of red text on a black background is not a well contrasted set

up and is therefore harder to read.


10/28

10

Figure 2.1: The red circles highlight the text size changes in relation to one another.

It is recommended that the font should be changed to lower case letters and to remain consistentwith size. Also a more appropriate color scheme should be chosen to better contrast the textagainst the background.

2.2 Layout

The way a webpage is divided should direct the readers attention to the important information ofthe page, not to advertisements or less important factors. Short pages are more effective and

easier to navigate. A webpage should follow the rule of thirds when dividing and placing

information. The rule of thirds states that information should be placed at the intersection oflines dividing the page into three equal parts both horizontally and vertically (Leigh, 2011). The

division of thirds is shown on a screen capture of the Stampeders website as shown in Figure 2.2.

Figure 2.2: The red lines divide the page into thirds and the blue circle displays the moving advertisement.


11/28

11

The use of graphics on a webpage can be both positive and negative. According to Prociuk(2010), if a graphic does not add value to a page then it should not be there. Graphics should be

small and meaningful with the main purpose of directing attention to key aspects of the page.

The circled advertisement in figure 2 is a moving ad and draws attention away from the goal of

the page.

A recommendation for this area would be to make the advertisements stationary and to placeinformation at the intersection divided lines to avoid centering of information. Allowing more

visible background in between the posted information would also give a more visually pleasing

layout.

2.3 Color

Psychologically emotions are greatly affected by color (Leigh, 2011). Different colors can

subconsciously bring out different feelings toward images. For example, black is mostly related

to death and mourning where as red is more related to fire and aggression (Leigh, 2011). Theblack background used on the website brings a boring and uninteresting appearance according toa recent survey. In comparison the Stampeders website does not relate there team colors on their

website as well as other competitors such as the BC Lions or the Saskatchewan Rough Riders.

Figure 3 shows the difference in team color use on the homepage of the BC Lions in comparisonto the Stampeders homepage referred to in figure 2.3.

Figure 2.3: The homepage of the BC lions in comparison to the Calgary Stampeders

It is recommended that a different color scheme should be chosen to better match the team colorsof the Calgary Stampeders and to make the website more pleasing to look at.

3.0 Organization of Information

Research into the organization of information on your website has provided several interesting

results that can be described by the two general categories ease of access to information and

visual organization.


12/28

12

Ease of access to information considers fans and customers of the Calgary Stampeders, and howeasy it is for them to locate the specific pages and information from your website. The category

of ease of access can be further divided into external and internal access.

Visual organization can be described as the way in which your website organizes and presentsinformation on any specific page or group of pages. Results will focus on links for navigation

between your sites pages as well as the embedded link format within your websites articles.

This is the area with the most room for improvement for your website.

3.1 Ease of Access to Information

3.1.1 External Access

There are two main ways in which a user could access your site directly. The results below

discuss the consistency and clarity of locating your website through direct address navigation or

an external search engine.

The first way to access your site is to type the www.stampeders.com URL directly into the

browser address bar. Other major sports leagues, such as the NHL or the NFL, share a consistentaddress format among their constituent teams. For example, the official website of the Calgary

Flames is www.calgaryflames.com. This format consists of the city name followed by the team

name as part of the same word. Because of this, fans of multiple sports may find it a challenge to

locate your site as www.stampeders.com does not follow this format.

It is also important to consider accessing an unknown URL using an internet search engine.

Google, the search engine used by more than 70% of the internet user market (SEO Consultants,

n.d.) was the logical choice around which to focus our research. Search engine access to yourwebsite is exceptional. Varied key words such as Stampeders and Calgary Stampeders were

all found to turn up the same top four search results, accommodating a wide range of user searchinput patterns.

As shown by figure 3.1 below, Google search results for calgary stampeders are clear and

organized. Your official websites homepage is the first search result with subset linksunderneath should a user require a specific web page. The second, third and forth search results

to the team schedule, roster and ticket sales page are clearly prioritized. They represent the key

objectives of your website, communicating team information to fans and providing quick and

easy access for ticket sales. Also, the added inset of these three search results from the pag es left

margin is an excellent visual presentation of the three pages as specific branches of thehomepage above.


13/28

13

Figure 3.1: Calgary Stampeders Google search results

3.1.2 Internal Access

For your websites internal access to information, our research found that your website boasts an

outstanding internal search application. Your search application is powered by Google and its

results are clear and organized. Observe, in figure 3.2, the search results highlighting thekeyword schedule, but also differentiating between game and practice schedules.

Figure 3.2: Comparison of Stampeders.com and Riderville.com internal search results

The use of Google also ensures results are sorted by relevance and priority (Altman &

Tennenholtz, 2005). The ordering of the top three search results places the most important result,

the game schedule, as the first link. This is followed by the team practice schedule, and finally a

link to an article referencing the team schedule. This ordering coincides with what our designteam felt were the main priorities of your website.

By comparison, the Saskatchewan Roughriders website search application performs only a basicstring search, seeking out any pages containing the searched keyword, and generates results with

no apparent priority or relevance order. When compared with rival sites like that of the

Roughriders, your websites internal ease of access is excellent, and needs little improvement.


14/28

14

3.2 Visual Organization

3.2.1 Embedded Links

A major component of stampeders.com is its archive of news stories and articles. In browsing a

sample of these articles, we found that over 90% of them reference a specific athlete or memberof the Stampeders organization. These articles, however, do not contain embedded links within

the text of the articles, and therefore make it difficult to find background information or other

pages related to the story.

For example, note the image of a stampeders.com article below. This article discusses receiver

Larry Taylor, however, it does not contain any links within the text for someone to locate his

specific player page. Without these embedded links, it does not tailor to website users hoping tofind out more about Larry Taylor.

Conversely, observe a similarly styled article found on the Roughriders site. Here, the name of

the player Dallas Baker is highlighted in green, throughout the article text, as a link to theplayers profile page. There are several parallels between these two articles; however, a user of

Riderville.com will find background information on Dallas Baker much more easily than a user

of Stampeders.com.

Figure 3.3: Comparison of player articles between Stampeders.com and Riderville.com

For the purpose of connecting your fans and better informing website users who read your news

and updates, consider embedding the text of your articles with links to pages relevant to your

article subject. Doing so will provide a quick and effective pathway for the reader of an article to

gain further background information and navigate between pages related to the article content.

3.2.2 Visual Data Structures


15/28

15

One of the key findings of our assessment considers the way in which your website currently

positions and orients its main menu bar and main page links. The left side of Figure 2.4 is a

screenshot of your websites vertically oriented main menu bar. The main links and pages ofstampeders.com are stacked vertically and located along the left margin of the homepage. When

the cursor is held over any of these links, a smaller branch opens to the right, containing

subtopics of the overall category.

This is inconvenient for a website user who tries to move the cursor on to one of the subtopic

links. For example, on the left side of figure 3.4, a user has expanded the Team menu branch

and is attempting to access the Executive subtopic. While moving the cursor to the right toselect the Executive link, the user must keep the cursor within the narrow black band

connecting the branch of subtopics to the overall Team menu item or the branch will collapse.Because of this, the allowable area for vertical cursor motion is limited and it is noticeably

difficult to access category subtopics consistently.

Visually, a vertically oriented main menu is also confusing to a website user, as it does not

reflect the appropriate information hierarchy of website pages. In other words, by placing asubtopic link beside a main menu heading, the visual structure fails to reflect the difference in

level of logical category between these two elements. As a result, it must rely on variations infont size and style instead.

Figure 3.4: Comparison between Stampeders.com and Riderville.com

Looking at the Roughriders main menu bar on the right side of figure 2.4 for comparison, youcan see an example of a horizontally oriented menu of main categories. This orientation is also

consistent with all NHL, NFL, MLB and NBA team websites. Visually, the subtopics of Roster,

Practice Schedule and so forth, flow logically as a secondary level of logical category from the

Team menu link. There is also significantly more allowable area for the cursors motion as a user

is attempting to select one of the category subtopics.

Because it is more user friendly, and offers a more logical alternative for visual organization, it is

recommended that your website orient its main menu of key pages horizontally, with its menus

of subtopics opening downward.


16/28

16

4.0 Technical Issues of Web Design

Technical issues of web design greatly affect the likelihood of a fan or customer continuing to

use your website. To encourage return visits, your site must be easily accessible in a variety of

ways without loss of content or aesthetic appeal. The three main areas of technical issues to

focus on are web browsers, screen resolution and download speeds.

Effective websites are compatible with multiple browsers and maintain the exact same outline ineach. It is necessary to explore what browsers are most popular and if your website opens

properly with these browsers.

Websites are optimized to a particular screen resolution. Any screen with a higher resolution

will not affect the website integrity but lower resolutions will make the site too big for the

screen, requiring excessive scrolling.

The final element that can cause glitches for websites is the download speed. People obtain their

internet through different sources and at varying speeds. It is important to optimize yourwebsites content so that it can perform well under any circumstance.

4.1 Web Browsers

There are five web browsers, displayed Figure 4.1, that are most popular among internet users.

Although Internet Explorer is and has been the most popular browser for users in the past studies

have shown that many users are preferential to the other four browsers, Google Chrome, Safari,

Foxfire and Opera (Web Developers Notes, n.d.). This suggests that the popularity of thesebrowsers will continue to grow for years to come. The Calgary Stampeders should thereforefocus on making their website compatible with not only Internet Explorer but all five of the listed

popular web browsers (Internet Explorer, Firefox, Google Chrome, Safari and Opera).

Figure 4.1: Survey results for popular browser usage (Web Developers Notes, n.d.).

On top of the variety of web browsers available, there a multiple operating systems the browsers

can be used on. The two main operating systems used to test the Calgary Stampeders websitewere Macs and PCs.

We are pleased to report that the Calgary Stampeders website performed exceptionally in thearea of web browsers. The site was compatible with all browsers tested (Internet Explorer,

Firefox, Google Chrome, Safari and Opera) on PCs and maintained the same content and visuals.

50%

26%

7%

16%1%

Popular Browser Usage

Internet Explorer

Firefox

Safari

Chrome


17/28

17

On certain Mac devices there was a problem with loading the flash videos. This area of concern

will be further discussed in the Technical Issues with Mobile Devices section. In terms of webbrowser compatibility, we have no recommendations at this point as stampeders.com is

exceeding and leading the way for competitors.

4.2 Screen Resolution

The screen resolution is the number of individual pixels that are displayed in one dimension.The lowest resolution within the common resolutions spectrum is 640x480 but can go up to1280x1024 (Expedient, n.d.). The number of computers with a screen resolution of 1024x768 or

lower is decreasing at an exponential rate as seen in Figure 4.2. This means most users are using

1280x800, the next resolution available, or higher.

Figure 4.2: Screen resolution trends from 2000 to 2011 of the percent of computer users with screen resolution of

1024x768 or higher (W 3 School, n.d.).

Testing on the Stampeders website shows that the site is optimal for screen resolution of1280x800, therefore the optimal resolution for this site is suitable for nearly all users. On par

with competitors, for example, the BC lions and exceeding others such as the Saskatchewan

roughriders, there are no recommendations for this area.

4.3 Download Speed

There are many ways to connect to the internet with the three main methods being through dial

up, cable or DSL. The download speed of a website depends on which connection the user is

hooked up to. Dial up connections are typically the slowest and use a standard 56k modem

producing download speeds less than 56Kbps (ISP Reviews, n.d.). Cable connections are themost widely used and offer different speeds depending on the service provider and the traffic of

users in the neighbourhood (ISP Reviews, n.d.). DSL connects to the internet through a

dedicated phone line and also varies in speed but only based on the service provider.

The Calgary Stampeders website was tested and there were a few areas of concern that affect

download speed. The total size of the website is 1,138,642 bytes which equates to 290.59seconds of loadtime on a 56Kbps modem dial up connection, the slowest scenario. A couple of


18/28

18

reasons for this slow speed are the number of objects and images on the site. There are forty two

objects on the homepage and this will significantly slow down loading time. Twenty objects orless is recommended for optimal download speed. The thirty two images on the homepage

equate to 1,095,552 bytes, which is also detrimental to download speed. To increase download

speed you could switch the graphic formats of the current images, to make smaller file sizes.

One way of doing this would be to switch the JPEG files to PNG files.

5.0 Website Security

Two of the primary functions of your website include promoting online ticket and team

merchandise sales. To ensure that you will maximize your ticket and merchandise sales it iscritical that you create a good first impression by having a secure website to protect the

confidential information of your clients. As Turner, Zavod and Yurcik (2001) noted;

participants were often willing to try something on a site one time, and their experience with the

site often determined whether they continued to transact business with the site. Below we willoutline our findings of the security measures that your website has in place, we will also explain

several security improvements that you should add to your website to gain the confidence ofyour clients.

5.1 Key Aspects of Website Security

Several of the main aspects of website security that we used for the analysis of your website

include:

Encryption Completely Automated Public Turing test to tell Computers and Humans Apart

(CAPTCHA)

Multiple Methods of Secure Payment Firewalls

Below we will describe in more detail what each of these aspects includes. The online store and

Ticketmaster are two areas of your website that require the use of security measures to protect

the information of your clients. Ticketmaster is a third party website which you utilize for the

sale of your online tickets.

5.2Ticketmaster Security

Using three of the main aspects of website security, we completed a detailed analysis of the

security that Ticketmaster imposes. Overall we found Ticketmaster makes good use ofCAPTCHA and encryption. Ticketmaster also offers various secure methods of payment.

5.2.1 CAPTCHA

Ticketmaster incorporated the use of CAPTCHA to ensure that only humans can access your

tickets online. CAPTCHA is a program that generates and grades a challenge response test that a

human can pass but a computer cannot. The most common CAPTCHA code is several scrambled


19/28

19

letters that a user must input. By implementing the use of CAPTCHA, Ticketmaster minimizes

the ability for scalpers to profit off of your fans, by buying mass amounts of discounted tickets.

5.2.2 Encryption

Ticketmaster also makes effective use of encryption. After your client successfully inputs theCAPTCHA code they are allowed to proceed to purchase their tickets. They are redirected to a

webpage with a secure encrypted connection. Encryption is a process of transforming the

plaintext information of your clients into a code before it is transferred from their computer toyour server. Therefore if the message is intercepted by a third party it cannot be deciphered. As

Suciu (2006) notes, encryption has become crucial due to the major increase in online sales, as a

result, businesses should focus on offering a secure encrypted connection on their websites in

order to reassure customers that their business is trustworthy.

There are two visual elements that all current web browsers make use of to illustrate a secure

connection. These elements include the use of an https and lock symbol in the address bar

which is shown in Figure 5.1 below.

Figure 5.1: Screen capture of the Ticketmaster address bar on the Stampeders website.

To protect the information of your clients and to gain their confidence it is important that they

can see that you are using a secure webpage for selling tickets. Once your clients feelcomfortable with the security of your website, they will be more likely to continue to purchase

tickets from your website.5.2.3 Multiple Methods of Secure Payment

The two methods of payment that Ticketmaster utilizes are credit cards and gift cards. This doesnot offer your client much flexibility on means to pay for their tickets. We recommend that you

incorporate one other major payment option such as PayPal. PayPal is recognized as a secure and

efficient payment option by consumers. By including this as a payment option for your ticketsales you would be adding one more secure method of payment that would protect your clientsinformation and increase your ticket sales.

5.2.4 Firewalls

Another security feature that Ticketmaster has in place is the use of firewalls to protectinformation. Ticketmasters firewalls allow or block network traffic based upon rules set up by

the administrator. The rules express what information the firewall is to identify and the action thefirewall is to take when that information is identified.

5.2.5 Effectiveness of Ticketmasters Security


20/28

20

Overall the security that your website has in place for ticket sales is on par or above the level of

your competitors, such as other CFL or NFL teams. Ticketmaster makes efficient use of the keyaspects of website security. It protects the confidential information of your clients using

encryption and firewalls and gives them the ability to pay using different secure options.

5.3 Online Store Security

While analyzing the security of your online store we noticed several serious flaws. There is nouse of encryption to secure the confidential information of your clients and the only paymentoption is via credit card. As is displayed in the Figure below, there is no secure connection while

your clients are inputting their payment information. As described previously, this can be seen

from the absence of an https and lock symbol in the address bar.

Figure 5.2: Screen capture of the checkout page of the Stampeders online store

It is essential that you protect the information of your clients to maintain their confidence andincrease your team merchandise sales. To do this you must use an encrypted connection; this can

be achieved by purchasing an online encryption certificate for your website.

The other important aspect of website security that should be utilized for your online store is

multiple methods of secure payments. As Regimantus (n.d.) notes, as an online establishment,

you must know how important it is to accept payment methods aside from credit cards.

Nowadays, consumers have become more cautious when it comes to online shopping and preferto use their accounts with PayPal or Moneybookers.

6.0 Accessibility for Special Needs Users

6.1 Reason for Web Accessibility Assessment

Target audiences of the Calgary Stampeders official web site should consist of a wide range of

users including disability users. Disability can refer to visual, auditory, physical, speech,

cognitive, or neurological aspects which affect access to the Web (W3C, 2011). Disabilities


21/28

21

affect one-in-seven Canadians (Alberta Health Services, 2009). According to the Statistics

Canada in 2007 (as cited in Alberta Health Services, 2009), the total population of peoples withdisabilities was up to 15 percent in Calgary. By comparison, Canada in the same year had 14.7

percent of the population as disability users (as cited in Alberta Health Services, 2009). Over half

of the people with disabilities participate in sport, and they use internet regularly (Human

Resources and Skills Development Canada, 2010). These numbers show a strong correlation ofdisability involvement in sport and with internet. Therefore, people with disabilities could be a

potential group of supporters of Calgary Stampeders, who use the internet to keep informed

about the team. However, there was 14.7 percent of disability users who have problems surfingon the Web because of a lack of availability of the aid in the Web (Human Resources and Skills

Development Canada, 2010). Hence, as a national sport web site, the Calgary Stampeders should

increase web accessibility to fulfill the demand of this group of minority. Besides, from themarketing perspective, a highly accessible web site can increase traffic which leads to promote

publicity and the number of supporters for the team.

6.2 Identify Problems

Looking from the perspective of people with disabilities to find out their problems and their

needs allows us to identify the weaknesses of the website. Therefore, we conducted ananonymous survey of sixty disabled people who were first time to users of the Calgary

Stampeders website. They have problems with vision, auditory and cognition from mild to

severe. Each of them was asked ten questions with respect to the different aspects of websiteaccessibility. The overall results were positive; seventy-five percent of the people were satisfied

in browsing the web site. Then we summarized all the problems they encountered with the web

site, and have recommendations for accessibility based on the principles of perceivability,

operability, understandability, and robustness (W3C, 2009).

6.3 Problems & Suggestions

According to the survey, hereunder are the areas we suggest to improve:

Closed captioning and text transcript Text instruction of navigation control Alternative text message with photo Alternative text message with image6.3.1 Closed Captioning & Text Transcript

According to the survey, the most common problem that hearing loss peoples indicate is thevideo clips under the multimedia section contain no closed captioning feature in the browser.These people are unable to follow the information in the video especially when the background

noise is loud. We recommend downloading software with automated captioning feature into the

video browser. It enables to turn on or off this feature by clicking a control button on thenavigation bar of the video browser. Besides the video, the audio clips should also provide text

transcripts in html format. Therefore, people with auditory disabilities are able to capture the

information from the videos and audio clips.


22/28

22

6.3.2 Text Instruction of Navigation Control

The next common problem we found from the survey is in the navigation bar on the video andthe audio browsers. People who are not familiar using the internet or who have cognition

problems have trouble navigating the video clips and adjusting the volume. Even the symbols ofthe control buttons in the navigation bar were confusing to the users. We recommend that youinclude a text instruction on all the control buttons in the video and audio browser. An alternative

is to show a pop-up text instruction window while users point their cursor at a control button.

6.3.3 Alternative Text Message with Photo

The on-line store exhibits a shopping platform to sell variety of gifts and souvenirs. Shoppers can

look at their favourite merchandises by enlarging the photo and reading the corresponding goods

description. However, without the color description of the merchandise, shoppers who have

vision problem such as colour blindness cannot identify the right colour of merchandise by

looking at the photo. We suggest that you include a color description within the merchandisedescription for all the apparel items. A text colour description is another way to provide content

information for special users who cannot see the images properly.

6.3.4 Alternative Text Message with Image

Under the team section, the media information page shows game schedules, game statistics andgame notes for the preseason and regular season. However, people who are new to watching

football or who suffer from memory loss may not be able to identify the team by just looking at

the team logo. We recommend you include text messages to show the team names which willprovide an alternative for the image presentation.

7.0 Technical Issues Related to Mobile Devices

With the number of smartphones and tablet devices growing exponentially, it's becoming

increasingly important to offer a website that supports mobile devices, allowing users to accessthe website's features on the go.

Our objective here is to find a solution that offers customers seamless access to all the website's

content wherever they may be trying to access it from, ensuring everything is compatible andrunning smoothly.

7.1 Operating Systems

We have analyzed the website using the three major operating systems for mobile devices:

Blackberry, Android and iOS. Together they make up about 90% of the market share for the

mobile operating systems on smartphone and tablet devices (Sarah Perez ,2011). These operatingsystems differ in their software capabilities, and can make it difficult to maintain a fully

compatible mobile platform.


23/28

23

Currently the website does have some difficulties working with the various operating systems

and we will address these in the subsequent sections.

7.2 Adobe Flash

Adobe flash is a multimedia format that is commonly used for videos and animations. Flashoften creates issues for mobile devices because there is a plugin required to access the content; a

plugin which is not available for one of the operating systems that the mobile devices run;

namely Apples iOS which runs on the number one selling tablet device, the iPad (DamonPoeter,2011). This means that the multimedia content on the site is inaccessible for many users.

To avoid these formatting issues we would like to minimize the amount of flash content on thesite and convert any flash multimedia into HTML 5 format, which does not require a plugin and

works with all the browsers that we have tested on mobile devices.

7.3 Mobile Webpages

Mobile webpages, like the one seen on Stampeders.com (Figure 7.1) are an alternate website that

offers users a simplified web page for their smartphone devices which normally includes:

An optimized resolution for small screens More text content Fewer images and advertisements Less scrolling/zooming required

Figure 7.1 Screen capture of the alternate web page for mobile devices

Most mobile webpages have issues recognizing specific devices and gathering enough


24/28

24

information to decide whether or not to redirect the device to the alternate page. There is a very

marginal difference between the operating system on a tablet device and a smartphone, onewhich cannot easily be detected without adding a substantial amount of data to the website, and

thus weighing on loading times and data usage (Jennifer Kyrnin, n.d.).

As seen in Figure 7.2 all of the devices in consideration were recognized by the site except theiPad. We believe that the mobile page is optimized for smartphones but not tablets, since they

have a much larger screen and the capabilities to run graphics-rich content. To resolve this issue

we will tweak the algorithm that detects these devices to redirect as many tablets as possiblewithout altering the perfect recognition of smarthphones.

Figure 7.2 Compatibility chart, data obtained by Spyder Web Design

7.4 Mobile Applications

Mobile applications (apps); available on the various app stores for mobile devices, offer the user

several unique advantages over the alternate web page:

Perfect recognition of both tablet and smartphone devices

Optimized features for both smartphones and tablets No compatibility issues Works with exclusive features of each operating system (ex. Google Maps for Android) Allows users to access their team with one touch/click.

Seen in Figure 7.4 is the Calgary Flames mobile application, which offers users the samefeatures available on the website including; videos, ticket sales, and team information. One

notable disadvantage of this approach is the added maintenance costs for maintaining three

different applications in as many application stores.


25/28

25

Figure 7.3 Screen capture of Calgary Flames mobile application

7.5 Key Technical Issues

We have identified two major issues accessing the site from the various mobile devices:

7.5.1 Content

There are several items missing from the menu when the website is accessed from a mobile

device, for instance; ticket sales, memorabilia sales and videos. Great mobile platforms offer

users the same functionality available from a desktop and users will be disappointed to find thatthe app does not live up to their expectations.

To improve the consistency of the content across the website and mobile platform we suggest:

Adding videos to the menu Adding the Calgary Stampeders memorabilia store to the menu Replacing the dead link for ticket sales with a link to ticket master 7.5.2 Compatibility

From the compatibility issues highlighted above; including the issues with flash and the mobileweb page, it is clear that there are some things we need to address in order to make the website amore user-friendly environment for all mobile devices.

To resolve these issues we suggest using a dualistic approach, making both the mobile webpageand the mobile applications available. This way customers have a choice between using either a

web browser or an application; if it is not possible to redirect all of their devices to the right web

page, there is an alternative for them on the App store, which will certainly be compatible.


26/28

26

We would also like to reformat the multimedia content on the site to resolve the issues with theiPad. By switching to HTML5, the website will be compatible with all of the tablet devices we

have tested, and will require no additional software for the various browsers. All without

sacrificing performance or any features currently available.

8.0 Conclusion and Recommendations

After our comprehensive assessment of the Calgary Stampeders website, we have outlinedseveral issues across the six evaluated aspects of your websites design. We have offeredpossible solutions and ideas for improvement within our analysis and identified two main,

recurring issues throughout your site. First, your website was found to provide an unacceptablelevel of access to the information it contains. Second, we determined that the format of

multimedia objects across your website failed to accommodate a broad range of users or devices.

It is important to make sure that the right information is accessible and private information is

kept confidential. One main area of concern for the Calgary Stampeders website was the onlinestore security. As discussed in our report we do not feel that the appropriate precautions have

been made to ensure that customer information is kept private and out of the hands of hackers.To properly protect the confidential information of your clients we recommend that you purchase

an online encryption certification.

In the case of security information was made too easily available, but we also found areas where

not enough information was provided. For instance, a closed captioning feature or text transcript

in the video and audio browser should be provided for the hearing impaired. There should also

be an alternative text message of team logos and merchandise colors for those with visionimpairment. As well, users reading articles may want to access player, team or league

information. Embedding links to player profile and stats pages will ensure this information canbe accessed quickly and easily.

The other important and general issue identified while assessing the design of your website was

the compatibility of its online multimedia formats. For example, your website offers limited

content consistency between its PC and mobile versions, evident within the Stampeders Store,ticket sales and video pages. In response to this, we suggest using a universally compatible

format like HTML5 for multimedia content as it does not require a plug-in. Finally, we

recommend making ticket sales, online store and video content available to mobile device users,which will provide consistency across multiple platforms.


27/28

27

References

Alberta Health Services. (2009). Demographic information of diverse population. Retrieved

August 13, 2011, from

http://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_d

iv_pop.pdf

Altman, A., & Tennenholtz M. (2005). Ranking systems: The page rank axioms. RetrievedAugust 12, 2011, fromhttp://stanford.edu/~epsalon/pagerank.pdf

Damon Poeter. (2011). Apple loses tablet OS share in Q2, Android Picks It Up. Retrieved

August 15, 2011, fromhttp://www.pcmag.com/article2/0,2817,2388894,00.asp

Expedient. (n.d.). Screen resolution. Retrieved August 15, 2011, from

http://help.expedient.com/general/resolution.shtml

Human Resource and Skills Development Canada. (2011). 2010 federal disability report.Retrieved August 13, 2011 from

http://www.hrsdc.gc.ca/eng/disability_issues/reports/fdr/2010/page11.shtml

ISP Reviews. (n.d.). Dialup vs DSL. Retrieved August 15, 2011, fromhttp://www.isp-

reviews.org/dialup_dsl.htm

ISP Reviews. (n.d.). DSL vs cable internet. Retrieved August 15, 2011, fromhttp://www.isp-

reviews.org/dsl_cable.htm

Jennifer Kyrnin. (n.d.). How to detect mobile devices. Retrieved August 15, 2011, from

http://webdesign.about.com/od/mobile/a/detect-mobile-devices.htm

Leigh, A. (2011). Aesthetics. Retrieved August 15, 2011 from

http://www.shire.net/learnwebdesign/aesthetics.htm

Merriam-Webster inc. (2011). Aesthetics. Retrieved August 16, 2011 fromhttp://www.merriam-webster.com/dictionary/aesthetic

Mitchell, B. (n.d.). DSL vs. cablebroadband internet speed comparison. Retrieved August 15,2011, fromhttp://compnetworking.about.com/od/dslvscablemodem/a/speedcompare.htm

Prociuk, G. (2010). Website aesthetics. Retrieved August 14, 2011 from

http://www.pointafter.com/tips-aesthetics.htm

Regimantus, A., (n.d.). Multi-payment method: The key to increased online sales. Retrieved

August 12, 2011, fromhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspx
http://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_div_pop.pdfhttp://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_div_pop.pdfhttp://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_div_pop.pdfhttp://stanford.edu/~epsalon/pagerank.pdfhttp://stanford.edu/~epsalon/pagerank.pdfhttp://stanford.edu/~epsalon/pagerank.pdfhttp://www.pcmag.com/article2/0,2817,2388894,00.asphttp://www.pcmag.com/article2/0,2817,2388894,00.asphttp://www.pcmag.com/article2/0,2817,2388894,00.asphttp://help.expedient.com/general/resolution.shtmlhttp://help.expedient.com/general/resolution.shtmlhttp://www.hrsdc.gc.ca/eng/disability_issues/reports/fdr/2010/page11.shtmlhttp://www.hrsdc.gc.ca/eng/disability_issues/reports/fdr/2010/page11.shtmlhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://webdesign.about.com/od/mobile/a/detect-mobile-devices.htmhttp://webdesign.about.com/od/mobile/a/detect-mobile-devices.htmhttp://www.shire.net/learnwebdesign/aesthetics.htmhttp://www.shire.net/learnwebdesign/aesthetics.htmhttp://www.merriam-webster.com/dictionary/aesthetichttp://www.merriam-webster.com/dictionary/aesthetichttp://www.merriam-webster.com/dictionary/aesthetichttp://www.merriam-webster.com/dictionary/aesthetichttp://compnetworking.about.com/od/dslvscablemodem/a/speedcompare.htmhttp://compnetworking.about.com/od/dslvscablemodem/a/speedcompare.htmhttp://compnetworking.about.com/od/dslvscablemodem/a/speedcompare.htmhttp://www.pointafter.com/tips-aesthetics.htmhttp://www.pointafter.com/tips-aesthetics.htmhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://e-commerce.bestmanagementarticles.com/a-16929-multi-payment-method-the-key-to-increased-online-sales.aspxhttp://www.pointafter.com/tips-aesthetics.htmhttp://compnetworking.about.com/od/dslvscablemodem/a/speedcompare.htmhttp://www.merriam-webster.com/dictionary/aesthetichttp://www.merriam-webster.com/dictionary/aesthetichttp://www.shire.net/learnwebdesign/aesthetics.htmhttp://webdesign.about.com/od/mobile/a/detect-mobile-devices.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://www.isp-reviews.org/dsl_cable.htmhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.isp-reviews.org/dialup_dsl.htmhttp://www.hrsdc.gc.ca/eng/disability_issues/reports/fdr/2010/page11.shtmlhttp://help.expedient.com/general/resolution.shtmlhttp://www.pcmag.com/article2/0,2817,2388894,00.asphttp://stanford.edu/~epsalon/pagerank.pdfhttp://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_div_pop.pdfhttp://www.calgaryhealthregion.ca/programs/diversity/demographics/demographics_of_div_pop.pdf


28/28

Sarah Perez. (2011). Mobile operating system market share, Feb. 2011 (Infographic). Retrieved

August 15, 2011, fromhttp://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.php

SEO Consultants. (2010). Top 10 search engines. Retrieved August 13, 2011, from

http://www.seoconsultants.com/search-engines/

Suciu, P., (2006, September 1). The basics: What is encryption? Retrieved August 12, 2011,

fromhttp://technology.inc.com/2006/09/01/the-basics-what-is-encryption/

Turner, C.W., & Yurcik, W., & Zavod, M., (2001). Factors that affect the perception of security

and privacy of e-commerce web sites. Retrieved August 12, 2011, fromhttp://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.130.2341

W3C. (2011). Introduction to web accessibility. Retrieved August 13, 2011 from

http://www.w3.org/WAI/intro/accessibility.php

W3C. (2009). W3C mission. Retrieved August 13, 2011, from

http://www.w3.org/Consortium/mission

W 3 Schools. (n.d.). Browser display statistics. Retrieved August 3, 2011, from

http://www.w3schools.com/browsers/browsers_display.asp

Web Developers Notes. (n.d.). Popular web browsers. Retrieved August 3, 2011, from

http://www.webdevelopersnotes.com/articles/popular-web-browsers.php
http://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.phphttp://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.phphttp://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.phphttp://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.phphttp://www.seoconsultants.com/search-engines/http://www.seoconsultants.com/search-engines/http://technology.inc.com/2006/09/01/the-basics-what-is-encryption/http://technology.inc.com/2006/09/01/the-basics-what-is-encryption/http://technology.inc.com/2006/09/01/the-basics-what-is-encryption/http://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.130.2341http://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.130.2341http://www.w3.org/WAI/intro/accessibility.phphttp://www.w3.org/WAI/intro/accessibility.phphttp://www.w3.org/Consortium/missionhttp://www.w3.org/Consortium/missionhttp://www.w3schools.com/browsers/browsers_display.asphttp://www.w3schools.com/browsers/browsers_display.asphttp://www.webdevelopersnotes.com/articles/popular-web-browsers.phphttp://www.webdevelopersnotes.com/articles/popular-web-browsers.phphttp://www.webdevelopersnotes.com/articles/popular-web-browsers.phphttp://www.w3schools.com/browsers/browsers_display.asphttp://www.w3.org/Consortium/missionhttp://www.w3.org/WAI/intro/accessibility.phphttp://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.130.2341http://technology.inc.com/2006/09/01/the-basics-what-is-encryption/http://www.seoconsultants.com/search-engines/http://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.phphttp://www.readwriteweb.com/mobile/2011/02/mobile-operating-system-market-share-feb-2011-infographic.php

final report draft jeff

Documents